Barvna shema: Temna
Trenutno dejavna stran: start » sl » Dokumentacija » Razširitve DokuWikija (WvdS) » FluentUI (knjižnica oblikovalskega sistema) » FluentUI: reference komponent » FluentUI: Toolbar – predstavitveni pregled » Toolbar: Adaptivity

Toolbar: Adaptivity

Nazaj: predstavitveni pregled


Kako se orodna vrstica vede, kadar je prostora malo: vnosi, ki ne gredo več drug ob drugem, se preselijo za gumb »Weitere Aktionen« in ostanejo dosegljivi od tam.

1. Pregled in namen

Stanje: [Live]. Referenca: vrstica ActionBar/ToolBar v katalogu gradnikov. Stanje »responsive-overflow« iz besednjaka je izvedeno kot opt-in ('overflow' => true in scripts/toolbar.js); brez te navedbe se vrstica prelomi, namesto da bi se zložila.

Izmerjeno 21. 09. 2026 na ukazni vrstici trezorja: pri 1400 px je pet gradnikov drug ob drugem in gumba za preliv ni; pri 390 px nosita obe skupini hidden, viden ostane en gumb, preostale pa zbere »Weitere Aktionen«.

2. Predpogoji

osnovna pogodba Toolbara že razumljena.

3. Pojmi

Isto načelo prelivanja kot pri Tab Control → Adaptivity, tu uporabljeno na vnosih orodne vrstice namesto na naslovih zavihkov.

4. Prvi koraki

echo $widgets->toolbar($items, ['ariaLabel' => 'Dejanja', 'overflow' => true]);

5. Uporaba

Relevantno za orodne vrstice z veliko vnosi v ozkih panelih. Izbirno prek $opts['overflow'] – obstoječe orodne vrstice (npr. vrstica množičnih dejanj) namerno ohranijo svoje vedenje prelamanja.

6. API referenca: prelivanje v kontekstni meni [Live]

Pod razpoložljivo širino (ResizeObserver, scripts/toolbar.js) najbolj desno postavljeni vnosi izginejo za gumbom »Več dejanj« (.wk-toolbar__more), ki odpre meni v videzu kontekstnega menija (role=„menu“/menuitem); vnos menija klikne pravi, skriti element – ena sama pot kode.

7. Parametri, možnosti in stanja

Ključ Tip Pomen
$opts['overflow'] bool vklopi vedenje prelivanja (privzeto izklopljeno)

Rezervni način brez JS: vsi vnosi ostanejo vidni in se prelomijo (flex-wrap), brez menija prelivanja brez JavaScripta.

8. Popolni primeri

Glej odsek 4.

9. Omejitve in robni primeri

  • Select/vnosna polja v meniju prelivanja so navedena kot kliknljivi vnosi – za zapletene kontrolnike vedenja prelivanja ne aktivirati.

10. Dostopnost in združljivost

Meni »Več dejanj« mora biti upravljiv s tipkovnico – enak vzorec kot obstoječi kontekstni meni.

11. Odpravljanje težav

Se ne uporablja.

12. Sorodne teme

sl/wiki/dwe/wkfluentui/component/toolbar/adaptivity.txt · Zadnja sprememba: uporabnika Wolfgang van der Stille