Pokyny pro křížový posuv

důležitá rozhraní API

• CrossSliding
• CrossSlideThresholds
• Windows.UI.Input

Pomocí funkce cross-slide můžete podporovat výběr gestem přejetí prstem a interakce přetažením (přesunutím) gestem posunutí.

Co dělat a nedělat

• Použijte funkci cross-slide pro seznamy nebo kolekce, které se posunují jedním směrem.
• Použijte křížové posunutí k výběru položek, když se interakce klepnutím použije pro jiný účel.
• Nepoužívejte funkci přetažení křížem pro přidávání položek do fronty.

Další pokyny k použití

Výběr a přetažení jsou možné pouze v oblasti obsahu, která je posunnutá jedním směrem (svisle nebo vodorovně). U každé interakce musí být jeden směr posouvání uzamčen a gesto musí být provedeno ve směru kolmém ke směru posouvání.

Zde předvedeme výběr a přetažení objektu pomocí křížového posunu. Obrázek vlevo ukazuje, jak se vybere položka, pokud gesto potáhnutí prstem nepřekročí prahovou vzdálenost před odstraněním kontaktu a uvolněním objektu. Obrázek na pravé straně ukazuje posuvné gesto, které překročí prahovou hodnotu vzdálenosti a vede k přetahování objektu.

Prahové vzdálenosti používané interakcí mezi snímky jsou znázorněny v následujícím diagramu.

Aby se zachovala funkčnost posouvání, musí být před aktivací interakce výběru nebo přetažení překročena malá prahová hodnota 2,7 mm (přibližně 10 pixelů v cílovém rozlišení). Tato malá prahová hodnota pomáhá systému rozlišovat přesun napříč od posouvání a také pomáhá zajistit, aby gesto klepnutí bylo odlišeno od přesunu napříč i posouvání.

Tento obrázek ukazuje, jak se uživatel dotkne prvku v uživatelském rozhraní, ale posouvá prst poněkud dolů při kontaktu. Bez prahové hodnoty by interakce byla interpretována jako křížový pohyb z důvodu počátečního vertikálního pohybu. Při prahové hodnotě se pohyb správně interpretuje jako vodorovné posouvání.

Tady je několik pokynů, které byste měli zvážit, když do aplikace zahrnete funkce přetahování prstem.

Použijte funkci cross-slide pro seznamy nebo kolekce, které se posunují jedním směrem. Další informace naleznete v tématu Přidání ovládacích prvků ListView.

Poznámka V případech, kdy je možné oblast obsahu posouvat dvěma směry, jako jsou webové prohlížeče nebo elektronické čtečky, by se měla použít interakce stisknutí a podržení k vyvolání kontextové nabídky pro objekty, jako jsou obrázky a hypertextové odkazy.

Vybírání

Výběr je označení bez spuštění nebo aktivace jednoho nebo více objektů. Tato akce je podobná jednomu kliknutí myší nebo klávese Shift a kliknutí myší na jeden nebo více objektů.

Výběr mezi snímky se dosahuje tak, že se dotknete prvku a uvolníte ho po krátké interakci přetažením. Tato metoda výběru se obejde bez vyhrazeného režimu výběru a bez časovaného stisknutí a přidržení vyžadovaného jinými dotykovými rozhraními a není v rozporu s interakcí klepnutím pro aktivaci.

Kromě prahové hodnoty vzdálenosti je výběr přejetím omezen na 90° prahovou oblast, jak je znázorněno v následujícím diagramu. Pokud je objekt přetažen mimo tuto oblast, není vybrán.

Interakce mezi snímky je doplněna o interakci s časovým limitem stisknutí a přidržení, která se označuje také jako "samoodhalující" interakce. Tato doplňková interakce aktivuje animaci, která označuje, jakou akci lze u objektu provést. Další informace o nejednoznačném uživatelském rozhraní najdete v pokynech pro vizuální zpětnou vazbu.

Následující snímky obrazovky ukazují, jak funguje animace odhalující sebe sama.

1. Stisknutím a podržením zahájíte animaci pro interakci s vlastním zobrazením. Vybraný stav položky ovlivňuje, co animace odhalí: zaškrtnutí, pokud není vybráno, a žádné zaškrtnutí, pokud je vybráno.

   

2. Vyberte položku pomocí gesta potáhnutí prstem (nahoru nebo dolů).

   

3. Položka je teď vybraná. Přepište chování výběru pomocí gesta snímku a přesuňte položku.

   

Použití jediného klepnutí pro výběr v aplikacích, kde se jedná o jedinou primární akci. Animace se zobrazí, aby objasnila tuto funkci a odlišila ji od standardní interakce klepnutím.

Výběrový koš

Košík výběru je vizuálně odlišné a dynamické znázornění položek vybraných z primárního seznamu nebo kolekce v aplikaci. Tato funkce je užitečná pro sledování vybraných položek a měla by ji používat aplikace, ve kterých:

• Položky lze vybrat z více umístění.
• Lze vybrat mnoho položek.
• Akce nebo příkaz závisí na seznamu výběru.

Obsah košíku výběru se zachová napříč akcemi a příkazy. Pokud například vyberete řadu fotografií z galerie, použijete u každé fotografie opravu barev a fotky nasdílíte nějakým způsobem, položky zůstanou vybrané.

Pokud se v aplikaci nepoužívá žádný koš výběru, aktuální výběr by měl být po akci nebo příkazu vymazán. Pokud například vyberete skladbu z playlistu a ji ohodnotíte, výběr by měl být zrušen.

Aktuální výběr by měl být také vymazán, pokud není použit žádný koš výběru a je aktivována jiná položka v seznamu nebo kolekci. Pokud například vyberete zprávu doručené pošty, podokno náhledu se aktualizuje. Pokud pak vyberete druhou zprávu doručené pošty, zruší se výběr předchozí zprávy a podokno náhledu se aktualizuje.

Queues

Fronta není ekvivalentní seznamu výběrových košíků a neměla by být takto považována. Mezi hlavní rozdíly patří:

• Seznam položek v košíku výběru je pouze vizuální reprezentace; položky ve frontě se sestavují s ohledem na konkrétní akci.
• Položky mohou být reprezentovány pouze jednou v košíku výběru, ale vícekrát ve frontě.
• Pořadí položek v košíku výběru představuje pořadí výběru. Pořadí položek ve frontě přímo souvisí s funkčností.

Z těchto důvodů by se výběrová interakce mezi snímky neměla použít k přidání položek do fronty. Místo toho by se položky měly přidat do fronty prostřednictvím akce přetažení.

Drag

Přetažením můžete přesunout jeden nebo více objektů z jednoho umístění do jiného.

Pokud je potřeba přesunout více objektů, nechte uživatele vybrat více položek a přetáhnout všechny najednou.

Související články

Samples

• Základní vstupní vzorek
• Ukázka vstupu s nízkou latencí
• Ukázka režimu interakce uživatele
• Ukázka vizuálů Focus

Archivní ukázky

• Vstup: Ukázka událostí uživatelského vstupu XAML
• Vstup: Ukázka schopností zařízení
• Vstup: Ukázka testování dotykového ovládání
• Ukázkový příklad posouvání, posunu a přiblížení v XAML
• Vstup: Zjednodušená ukázka rukopisu
• Vstup: Ukázka manipulace a gest
• Ukázka vstupu dotykového ovládání DirectX