Ohraničující rámečky
Přehled
Automaticky detekované rámečky lze plně upravovat. Přesuňte, změňte velikost, odstraňte nebo přidejte nové rámečky a vylepšete výsledky.
Detekce jedním kliknutím
CSS
Ruční ohraničení
TEXT: Vyberte nástroj pro kreslení obdélníků
Nahrání obrázku
TEXT: Nakreslete obdélník
Nakreslete nebo automaticky detekujte ohraničující rámečky
TEXT: Změňte velikost a upravte
AI automatické ohraničování
Nasměrujte chování
Ohraničující rámečky jsou základním interakčním modelem reverzního inženýrství. Po nahrání obrázku nakreslíte obdélníkové rámečky kolem jednotlivých prvků uživatelského rozhraní, abyste je izolovali. Každý ohraničující rámeček se stává výběrovou oblastí, kterému lze přiřadit chování, převést na kód nebo exportovat jako komponentu wireframu.
AI automatické ohraničení
Selektivní opětovná detekce
Otevře modalitu
Kliknutí na prvek otevře modalitu/dialog. Určete, jaký obsah by modalita měla zobrazovat.
Přejde do sekce
Prvek funguje jako odkaz nebo tlačítko, které přejde na jinou stránku nebo sekci aplikace.
Přepíná obsah
Prvek zobrazuje nebo skrývá související obsah – rozbalovací nabídky, akordeony, rozbalovací panely.
Úprava po detekci
Spusťte automatickou detekci na konkrétní oblasti obrázku, pokud potřebujete rámečky pouze pro část rozvržení.
Odeslání formuláře
Prvek spouští ověření formuláře a logiku odeslání.
Vlastní akce
Definujte libovolný popis vlastní akce a AI vygeneruje odpovídající obslužné funkce a logiku.
Generování kódu a wireframu
Postranní panel AI asistenta
Režimy výstupu
Funkce generování kódu
Tipy
Po anotování obrázku ohraničujícími rámečky a přiřazení chování můžete generovat buď funkční kód komponent, nebo rozvržení wireframu. AI používá pozice ohraničujících rámečků, typy prvků a směry chování k vytvoření přesného výstupu.