Responzivita aplikace znamená, že se rozložení prvků přizpůsobuje šířce displeje, na kterém aplikaci vidíme.

Typicky může jít o to, že se prvky, které jsou standardně vedle sebe, na užším displeji přesunou pod sebe.

Toto je aplikace, která obsahuje formulář a galerii. Jsou vedle sebe, ale chceme je nastavit tak, aby se na úzkém displeji srovnaly pod sebe.

Aby to tak fungovalo, musíme nastavit přizpůsobivost šířky celé aplikace, dát jednotlivé prvky do kontejneru a ten nastavit.

Nastavení celé aplikace

V možnostech aplikace vypneme možnost “Scale to fit”.

Kontejner

Vložíme “horizontal container” (Input – Horizontal Container) a přesuneme do něj galerii i formulář.

(Tím se mohou trochu rozhodit, ale to jde později doladit.)

Kontejneru nastavíme šířku odvozenou od šířky aplikace (a případně i vyšší výšku, aby se tam prvky vešly…). Současně nastavíme zarovnávání pod sebe:

Když teď aplikaci spustíme a necháme ji měnit podle velikosti okna. Můžeme okno zůžit a uvidíme, že se formulář i galerie rovnají pod sebe:

V tomhle článku je popsaný jen základní princip, je zřejmé že v praxi bude třeba další ladění – tedy třeba zarovnání v kontejneru (vertikální i horizontální) nebo nastavení mezer mezi prvky.