ILLA components
ILLA poskytuje desítky předkompilovaných komponentů pro rychlé vytváření webových front-end rozhraní.
Seznam komponentů
- Vstup: Používá se k získání kratšího řetězce zadaného uživateli

- Vstupní číslo: používá se k získání čísla zadaného uživateli.
.png)
- Upravitelný text: Slouží k zobrazení řetězce a přepnutí do režimu úprav po kliknutí.
.png)
- Textarea vstup: slouží k získání dlouhého řetězce zadaného uživateli
.png)
- Nahrát: Používá se pro výběr místních souborů a jejich zpracování do dat base64. Klikněte zde pro více informací o odesílání
.png)
- Již brzy
- Nahrávání
- Posuvník
- Range slider
- Rich text vstup
- JSON editor
Vybrat vstupy
- Přepínač: Přepínač, který může vrátit true nebo false
.png)
- Vyberte: Zobrazí všechny možnosti v rozbalovacím menu a umožní uživatelům vybrat
.png)
- Rozhlasová skupina: Zobrazí všechny možnosti a umožní uživatelům vybrat jeden z nich
.png)
- Zaškrtávací skupina: Zobrazit všechny možnosti a umožnit uživatelům vybrat více možností
.png)
- Kaskader: Používá se k zobrazení a výběru sady přidružených dat
.png)
- Přepínací tlačítko: Zobrazí všechny možnosti ve stylu tlačítka. Povolit uživatelům vybrat jednu z nich.
.png)
- Již brzy
- Vícenásobný výběr
- Výběr stromu
Vstupy kalendáře
- Datum: Používá se k zadání data. Povolit vlastní formát dat.
.png)
- Časový rozsah: Používá se k zadání časového rozsahu. Povolit vlastní formát dat.
.png)
- Čas data: používá se k zadání data a času. Povolit vlastní formát dat.
.png)
Zobrazení
- Text: Používá se k zobrazení řetězců a umožňuje získat dynamická data pomocí „Sriptu. Syntaxe markdown podpory. Klikněte zde pro více informací o tom.
.png)
- Obrázek: Slouží k zobrazení obrázků. Zdrojem obrázku může být URL nebo base64 data.
.png)
- Tlačítko: Klepnutím spustíte odpovídající obchodní logiku
.png)
- Ikona: Používá se k vyjádření akcí, stavu, kategorizaci dat a spuštění událostí po kliknutí
.png)
- Statistika: Používá se k zobrazení statistického čísla
.png)
- Hodnota: Používá se pro zadávání nebo zobrazení hodnocení
.png)
- Průběh lišty: Používá se k zobrazení postupu
.png)
- Průběh kružnice: Používá se k zobrazení postupu
.png)
- Čas: Používá se k zobrazení informací o časovém toku, zpravidla nahrává události v čase flashback, sledování, co uživatel dělá nyní a co dělal v minulosti.
.png)
- Dělič: Používá se k oddělení různého obsahu
.png)
- Karty: Karty kategorizují obsah, aby bylo možné prezentovat velké množství informací v omezeném prostoru. Uživatelé mohou snadno přepínat mezi panely bez přechodu z jedné stránky na jinou
.png)
- Nabídka: Používá se k zobrazení struktury stránky, ovládání skoku stránky nebo spuštění jiných událostí
.png)
- Kontejner: Seskupte komponenty do karet, které podporují více zobrazení. Klikněte zde pro více informací
.png)
- Formát: Zabalí data vstupních součástí do objektu jako hodnotu komponenty formuláře. které lze odeslat přímo API
.png)
- Seznam: Přizpůsobit komponenty v seznamu a zobrazit data
.png)
- Modal: Zobrazovat data nebo provádět operace prostřednictvím plovoucí vrstvy, což činí interakci uživatelského rozhraní přátelštějším
.png)
- PDF: Podpora PDF URL nebo base64 kódovaných dat
.png)
- Video: Podpora většiny video služeb nebo přímého odkazu na jakýkoli běžný typ video souboru.
.png)
.png)
Údaje
- Chart: Vizualizujte svá data, podporovejte sloupec graf, řádkový graf, scatter graf, koláčový graf. Klikněte zde pro více informací o tom.
.png)
- Tabulka: Běžný způsob, jak zobrazit a komunikovat s vašimi daty. Můžete roztřídit, filtrovat, stránkování a stahovat řádky informací. Tabulky také podporují výběr řádků a vlastní sloupce. Klikněte zde pro více informací o tom.
Hledat komponentu
Můžete kliknout na záložku INSERT v pravém panelu pro zadání seznamu součástí. Zadejte název komponenty a vyhledávejte komponentu ve výše uvedeném vstupním poli.
.png)
Použít manipulátor události ke spuštění událostí
Ukládání komponenty tlačítka jako příkladu můžete nastavit ovladač události pro komponentu pomocí obrazu zobrazeného pro spuštění akce nebo ovládání jiných komponent atd. Když kliknete na komponentu, nebo když se změní data komponenty, lze spustit odpovídající události.
.png)
Použít data komponent v akcích
Můžete použít data komponent v akcích nebo jiných komponentách. Vstupní komponenta jako příklad můžete použít {{input1.value}} k získání zadané hodnoty v komponentě. Různé složky mohou mít různé datové formáty. Prohlédněte si prosím datové formáty přes levý panel.
.png)