Vylepšené UX s AJUI_Progressbar

Stalo se vám někdy, že jste provedli akci, nic se nestalo a nevěděli jste, zda máte kliknout znovu, nebo pokračovat v čekání? Nebyla poskytnuta žádná zpětná vazba, i když aplikace provádí akci na pozadí? Možná akce vyžaduje nějaký čas, než se vrátí výsledek? Jak možná víte, 4D již poskytuje vestavěnou komponentu progress bar, která činí dobu provádění snesitelnější, ale pokud chcete něco s více webovým designem, pak čtěte dál, protože to vám poskytne AJUI_Progressbar!

Co je AJUI_Progressbar

AJUI ProgressBar je komponenta vyvinutá pomocí 4D 17 R3, založená na SVG a technologii 4D Worker. Umožňuje velmi snadno vytvářet progressbary. Komponenta vytváří sadu vlastností, které definují vlastnosti a vizuální vykreslení progress barů. K dispozici jsou také vzorce pro přístup k posuzovatelům a metody pro generování progress barů.

Komponenta obsahuje dva typy instancí, které představují dvě specifické varianty dostupných progress barů. První provedení je lineární styl a druhé je kruhové. Každá varianta má vlastnosti specifické pro svůj design.

Sloupcům lze přiřadit číselné hodnoty od 0 do 100, ale protože zobrazovaný text lze přizpůsobit, je možné vizuálně znázornit i jiné hodnoty. Komponenta používá při generování ukazatelů průběhu funkci Worker pro obnovení stránky. Worker má také další využití: poskytuje možnost správy animací.

Komponenta nabízí několik metod pro přizpůsobení a manipulaci s ukazatelem průběhu pomocí objektu a funkcí. Poskytuje také dvě metody pro načtení instancí pro každý typ ukazatele průběhu:

• New AJUI_ProgressBar: Lineární ukazatel průběhu.
• Nový AJUI CircularProgressBar: Kruhový ukazatel průběhu.

Obě metody vracejí objekty obsahující vlastnosti pruhu, jejich výchozí hodnoty a také vzorce pro manipulaci s nimi.

Ostatní dostupné metody mají předponu „HDI“ (Jak to dělám já). Tyto metody umožňují volat formuláře obsahující příklady použití vlastností komponenty.

Nastavení lineárního ukazatele průběhu

• Nejprve přidejte do formuláře objekt obrázku. Tento objekt bude sloužit jako hostitelský objekt pro ukazatel průběhu. Pokud chcete generovat několik pruhů průběhu současně, můžete přidat více objektů obrázků.
• Druhým krokem je vytvoření instance panelu průběhu. Můžete se rozhodnout pro spuštění jednou ze dvou výše popsaných metod. V ideálním případě by měl být objekt vrácený zvolenou metodou uložen v proměnné „Form“. Doporučuje se také přidat do objektu „Form“ úroveň.

Jakmile je to hotovo, přidejte k instanci název vašeho objektu obrázku. Pro testování pak doporučujeme upravit hodnotu progrese (výchozí: 0) a aktivovat animace. Chcete-li vygenerovat svůj ukazatel průběhu, stačí spustit příslušný vzorec „spuštění“.

Pokud jste přidali více objektů obrázků, opakujte druhý krok pro každý z nich (pro každý objekt obrázku jedna instance).

Zde je uvedeno, jak vypadá kód pro lineární ukazatel průběhu:

AJUI_Progressbar v hloubce

Další podrobnosti, stejně jako návod na použití a konfiguraci komponenty krok za krokem, naleznete zde. Ať už se rozhodnete použít komponentu AJUI_Progressbar nebo integrovanou komponentu progress bar ve 4D, ujistíte uživatele, že se skutečně něco děje. Bavte se!