Interakce gamepadu a vzdáleného ovládání

Mnoho interakcí se sdílí mezi gamepadem, vzdáleným ovládáním a klávesnicí.

Vytvářejte prostředí interakce v aplikacích pro Windows, které zajišťují, že je vaše aplikace použitelná a přístupná prostřednictvím tradičních vstupních typů počítačů, notebooků a tabletů (myš, klávesnice, dotykové ovládání atd.), a také typů vstupů typických pro tv a Xbox 10-foot , jako je gamepad a dálkové ovládání.

Obecné pokyny k návrhu aplikací pro Windows v prostředí s 10 stopou najdete v tématu Návrh pro Xbox a TV.

Přehled

V tomto tématu probereme, co byste měli zvážit v návrhu interakce (nebo co ne, pokud platforma vypadá za vás) a poskytneme pokyny, doporučení a návrhy pro vytváření aplikací pro Windows, které se dají snadno používat bez ohledu na zařízení, typ vstupu nebo uživatelské schopnosti a předvolby.

Ve výsledku by vaše aplikace měla být stejně intuitivní a snadno použitelná v prostředí na vzdálenost 2 stopy jako v prostředí na vzdálenost 10 stop (a naopak). Podporujte preferovaná zařízení uživatele, zajistěte, aby se uživatelské rozhraní soustředilo jasně a jednoznačně, uspořádejte obsah tak, aby navigace byla konzistentní a předvídatelná, a dejte uživatelům co nejkratší cestu k tomu, co chtějí udělat.

Poznámka:

Většina fragmentů kódu v tomto tématu je v XAML/C#; principy a koncepty se však vztahují na všechny aplikace pro Windows. Pokud vyvíjíte aplikaci HTML/JavaScript pro Windows pro Xbox, podívejte se na vynikající knihovnu TVHelpers na GitHubu.

Optimalizace pro prostředí s 2 a 10 stopami

Minimálně doporučujeme otestovat aplikace, abyste měli jistotu, že budou dobře fungovat ve 2-stopových a 10-stopových scénářích a že všechny funkce jsou zjistitelné a přístupné pro herní ovladač Xbox a dálkové ovládání.

Tady jsou některé další způsoby, jak aplikaci optimalizovat pro použití v 2-stopém a 10-stopém prostředí a se všemi vstupními zařízeními (každý odkazuje na příslušnou část v tomto tématu).

Poznámka:

Vzhledem k tomu, že herní zařízení Xbox a dálkové ovládání podporují mnoho chování a prostředí klávesnice windows, jsou tato doporučení vhodná pro oba typy vstupů. Podrobnější informace o klávesnici najdete v tématu Interakce pomocí klávesnice .

Vlastnost	Description
Navigace a interakce zaměření XY	Fokus XY umožňuje uživateli procházet uživatelské rozhraní vaší aplikace. Tím se ale omezí, aby uživatel přecházel nahoru, dolů, doleva a doprava. Doporučení pro řešení tohoto a další aspekty jsou popsaná v této části.
Režim myši	Navigace fokusem XY není praktická ani možná pro některé typy aplikací, například mapy nebo aplikace na kreslení a malování. V těchto případech režim myši umožňuje uživatelům volně přecházet pomocí gamepadu nebo vzdáleného ovládání, stejně jako myš na počítači.
Fokus vizuální zobrazení	Fokus je ohraničení, které zvýrazní aktuálně zaměřený prvek uživatelského rozhraní. To pomáhá uživateli rychle identifikovat uživatelské rozhraní, se kterým prochází nebo s ním pracuje.
Zapojení fokusu	Zapojení fokusu vyžaduje, aby uživatel stiskl tlačítko A/Select na herním nebo vzdáleném ovládacím prvku, pokud má prvek uživatelského rozhraní fokus, aby s ním mohl pracovat.
Hardwarová tlačítka	Gamepad a dálkové ovládání poskytují velmi různá tlačítka a konfigurace.

Gamepad a dálkové ovládání

Stejně jako klávesnice a myš jsou pro PC a dotykové ovládání pro telefon a tablet, jsou gamepad a dálkové ovládání hlavními vstupními zařízeními pro uživatelské prostředí 10 stop. Tato část představuje, co jsou hardwarová tlačítka a co dělají. V navigaci a interakci s fokusem XY arežimu myši se dozvíte, jak optimalizovat aplikaci při používání těchto vstupních zařízení.

Kvalita herního ovladače a funkčnost dálkového ovládání, kterou obdržíte při prvotním nastavení, závisí na tom, jak dobře je klávesnice ve vaší aplikaci podporovaná. Dobrým způsobem, jak zajistit, aby vaše aplikace dobře fungovala s gamepadem nebo vzdáleným ovládáním, je zajistit, aby dobře fungovala s klávesnicí na počítači, a pak testovat pomocí gamepadu nebo vzdáleného zařízení a najít slabá místa v uživatelském rozhraní.

Hardwarová tlačítka

V tomto dokumentu budou tlačítka odkazovat na názvy uvedené v následujícím diagramu.

Jak vidíte v diagramu, na gamepadu jsou podporovaná některá tlačítka, která nejsou podporována na vzdáleném ovládání a naopak. I když můžete použít tlačítka, která jsou podporována pouze na jednom vstupním zařízení, abyste urychlili navigaci v uživatelském rozhraní, mějte na paměti, že jejich použití pro kritické interakce může vytvořit situaci, kdy uživatel nemůže pracovat s určitými částmi uživatelského rozhraní.

Následující tabulka uvádí všechna hardwarová tlačítka podporovaná aplikacemi pro Windows a vstupní zařízení je podporuje.

Button	Herní ovladač	Dálkové ovládání
Tlačítko A/Select	Ano	Ano
Tlačítko B/Zpět	Ano	Ano
Směrová podložka (D-pad)	Ano	Ano
Tlačítko nabídky	Ano	Ano
Tlačítko Zobrazit	Ano	Ano
Tlačítka X a Y	Ano	Ne
Levá hůl	Ano	Ne
Pravá hůl	Ano	Ne
Levý a pravý spouště	Ano	Ne
Levé a pravé nárazníky	Ano	Ne
tlačítko OneGuide	Ne	Ano
Tlačítko hlasitost	Ne	Ano
Tlačítko Kanál	Ne	Ano
Tlačítka ovládacích prvků médií	Ne	Ano
Tlačítko Ztlumit	Ne	Ano

Podpora integrovaných tlačítek

UWP automaticky mapuje stávající chování vstupu klávesnice na vstup gamepadu a dálkového ovládání. Následující tabulka obsahuje seznam těchto předdefinovaných mapování.

Keyboard	Herní ovladač/dálkový ovladač
Klávesy se šipkami	D-pad (také levá páčka na gamepadu)
Mezerník	Tlačítko A/Select
Vstoupit	Tlačítko A/Select
Útěk	Tlačítko B/Zpět*

*Pokud aplikace nezpracuje události KeyDown ani KeyUp pro tlačítko B, aktivuje se událost SystemNavigationManager.BackRequested , která by měla vést k zpětné navigaci v aplikaci. Musíte to ale implementovat sami, jako v následujícím fragmentu kódu:

// This code goes in the MainPage class

public MainPage()
{
    this.InitializeComponent();

    // Handling Page Back navigation behaviors
    SystemNavigationManager.GetForCurrentView().BackRequested +=
        SystemNavigationManager_BackRequested;
}

private void SystemNavigationManager_BackRequested(
    object sender,
    BackRequestedEventArgs e)
{
    if (!e.Handled)
    {
        e.Handled = this.BackRequested();
    }
}

public Frame AppFrame { get { return this.Frame; } }

private bool BackRequested()
{
    // Get a hold of the current frame so that we can inspect the app back stack
    if (this.AppFrame == null)
        return false;

    // Check to see if this is the top-most page on the app back stack
    if (this.AppFrame.CanGoBack)
    {
        // If not, set the event to handled and go back to the previous page in the
        // app.
        this.AppFrame.GoBack();
        return true;
    }
    return false;
}

Poznámka:

Pokud se tlačítko B používá k návratu, nezobrazujte v uživatelském rozhraní tlačítko Zpět. Pokud používáte navigační zobrazení, tlačítko Zpět se automaticky skryje. Další informace o zpětné navigaci najdete v tématu Historie navigace a zpětná navigace pro aplikace pro Windows.

Aplikace pro Windows na Xboxu One také podporují stisknutí tlačítka Menu, aby se otevřely místní nabídky. Další informace naleznete v tématu CommandBar a ContextFlyout.

Podpora akcelerátorů

Tlačítka akcelerátoru jsou tlačítka, která lze použít k urychlení navigace v uživatelském rozhraní. Tato tlačítka však mohou být jedinečná pro určité vstupní zařízení, proto mějte na paměti, že tyto funkce nebudou moct používat všichni uživatelé. Gamepad je ve skutečnosti jediným vstupním zařízením, které podporuje funkce akcelerátoru pro aplikace pro Windows na Xboxu One.

Následující tabulka uvádí podporu akcelerátoru integrovanou do UPW a také podporu, kterou můžete implementovat sami. Díky těmto chováním ve vlastním uživatelském rozhraní získáte konzistentní a přívětivé uživatelské prostředí.

Interakce	Klávesnice nebo myš	Herní ovladač	Integrovaná pro:	Doporučeno pro:
Stránka nahoru/dolů	Stránka nahoru/dolů	Spouště vlevo/vpravo	CalendarView, ListBox, ListViewBase, ListView, ScrollViewer, Selector, LoopingSelector, ComboBox, FlipView	Zobrazení, která podporují svislé posouvání
Posunout stránku vlevo/vpravo	None	Levý/pravý bumper	ListBox, ListViewBase, ListView, ScrollViewer, Selector, LoopingSelector, FlipView	Zobrazení, která podporují vodorovné posouvání
Přiblížení a oddálení	Ctrl +/-	Levá/pravá spoušť	None	ScrollViewer, zobrazení, která podporují přiblížení a oddálení
Otevření nebo zavření navigačního podokna	None	Zobrazit	None	Navigační podokna
Search	None	Tlačítko Y	None	Zástupce hlavní funkce vyhledávání v aplikaci
Otevřít místní nabídku	Pravým tlačítkem myši klikněte na	Tlačítko nabídky	ContextFlyout	Místní nabídky

Navigace a interakce s fokusem XY

Pokud vaše aplikace podporuje správnou navigaci fokusu pro klávesnici, přeloží se to dobře na gamepad a dálkové ovládání. Navigace pomocí kláves se šipkami se mapuje na D-pad (stejně jako levá hůl na gamepadu) a interakce s prvky uživatelského rozhraní se mapuje na klávesu Enter/Select (viz Gamepad a vzdálené ovládání).

Mnoho událostí a vlastností je používáno jak klávesnicí, tak i herním ovladačem—KeyDown a KeyUp události se spouštějí a oba budou navigovat pouze na ovládací prvky, které mají vlastnosti IsTabStop="True" a Visibility="Visible". Pokyny k návrhu klávesnice najdete v tématu Interakce pomocí klávesnice.

Pokud je správně implementována podpora klávesnice, vaše aplikace bude přiměřeně dobře fungovat; Může se však vyžadovat další práce, která by podporovala každý scénář. Zamyslete se nad konkrétními potřebami vaší aplikace, abyste zajistili co nejlepší uživatelské prostředí.

Důležité

Režim myši je ve výchozím nastavení povolený pro aplikace pro Windows spuštěné na Xboxu One. Chcete-li zakázat režim myši a povolit fokus XY navigace, nastavte Application.RequiresPointerMode=WhenRequested.

Problémy s laděním fokusu

Metoda FocusManager.GetFocusedElement vám řekne, který prvek má aktuálně fokus. To je užitečné v situacích, kdy umístění fokusu nemusí být zřejmé. Tyto informace můžete protokolovat do okna výstupu sady Visual Studio, například takto:

page.GotFocus += (object sender, RoutedEventArgs e) =>
{
    FrameworkElement focus = FocusManager.GetFocusedElement() as FrameworkElement;
    if (focus != null)
    {
        Debug.WriteLine("got focus: " + focus.Name + " (" +
            focus.GetType().ToString() + ")");
    }
};

Existují tři běžné důvody, proč navigace XY nemusí fungovat očekávaným způsobem:

• Vlastnost IsTabStop nebo Visibility je nastavena špatně.
• Ovládací prvek, který získá zaostření, je ve skutečnosti větší, než si myslíte—navigace XY zohledňuje celkovou velikost ovládacího prvku (ActualWidth a ActualHeight), nejen jeho část, která vykresluje něco zajímavého.
• Jeden fokusovatelný ovládací prvek je nad druhým – navigace XY nepodporuje ovládací prvky, které se překrývají.

Pokud navigace XY stále nefunguje očekávaným způsobem po opravě těchto problémů, můžete ručně určit prvek, na který chcete získat fokus, pomocí metody popsané v přepsání přednastavené navigace.

Pokud navigace XY funguje podle očekávání, ale nezobrazuje se žádný vizuál fokusu, může to být jedna z následujících problémů:

• Ovládací prvek jste přešablonovali a nezahrnuli jste vizuální indikátor zaměření. Nastavte UseSystemFocusVisuals="True" nebo přidejte fokusní vizuál ručně.
• Fokus jste přesunuli voláním Focus(FocusState.Pointer). Parametr FocusState řídí, co se stane s vizuálním prvkem fokusu. Obecně byste měli tuto možnost nastavit na FocusState.Programmatichodnotu , která udržuje vizuál fokusu viditelný, pokud byl předtím viditelný, a skrytý, pokud byl před tím skrytý.

Zbytek této části podrobně popisuje běžné výzvy návrhu při použití navigace XY a nabízí několik způsobů, jak je vyřešit.

Nepřístupné uživatelské rozhraní

Vzhledem k tomu, že navigace fokus XY omezuje uživatele na přechod nahoru, dolů, doleva a doprava, můžete skončit ve scénářích, kdy jsou části uživatelského rozhraní nepřístupné. Následující diagram znázorňuje příklad rozložení uživatelského rozhraní, ve kterém navigace XY fokus nefunguje. Všimněte si, že prvek uprostřed není přístupný pomocí gamepadu nebo dálkového ovládání, protože svislá a vodorovná navigace bude mít prioritu a prostřední prvek nebude nikdy dostatečně prioritní, aby získal fokus.

Prvky ve čtyřech rozích s nepřístupným prvkem uprostřed

Pokud z nějakého důvodu není možné změnit uspořádání uživatelského rozhraní, použijte jednu z technik probíraných v další části k přepsání výchozího chování fokusu.

Přepsání výchozí navigace

I když se univerzální platforma Windows snaží zajistit, aby navigace na panelu D/left dávala uživateli smysl, nemůže zaručit chování, které je optimalizované pro záměry vaší aplikace. Nejlepší způsob, jak zajistit, aby byla navigace optimalizovaná pro vaši aplikaci, je otestovat ji pomocí gamepadu a ověřit, že ke všem prvkům uživatelského rozhraní má uživatel přístup způsobem, který dává smysl pro scénáře vaší aplikace. V případě, že scénáře vaší aplikace vyžadují chování, které nelze dosáhnout prostřednictvím poskytované navigace fokusu XY, uvažte využití doporučení uvedených v následujících částech a/nebo přepsání chování, aby se fokus umístil na logickou položku.

Následující fragment kódu ukazuje, jak můžete přepsat chování navigace fokusu XY:

<StackPanel>
    <Button x:Name="MyBtnLeft"
            Content="Search" />
    <Button x:Name="MyBtnRight"
            Content="Delete"/>
    <Button x:Name="MyBtnTop"
            Content="Update" />
    <Button x:Name="MyBtnDown"
            Content="Undo" />
    <Button Content="Home"  
            XYFocusLeft="{x:Bind MyBtnLeft}"
            XYFocusRight="{x:Bind MyBtnRight}"
            XYFocusDown="{x:Bind MyBtnDown}"
            XYFocusUp="{x:Bind MyBtnTop}" />
</StackPanel>

V tomto případě se fokus nachází na tlačítku Home a uživatel přejde doleva, přesune se fokus na MyBtnLeft tlačítko. Pokud uživatel přejde doprava, přesune se fokus na MyBtnRight tlačítko atd.

Pokud chcete zabránit přesunutí fokusu z ovládacího prvku v určitém směru, použijte XYFocus* vlastnost k nasměrování na stejný ovládací prvek:

<Button Name="HomeButton"  
        Content="Home"  
        XYFocusLeft ="{x:Bind HomeButton}" />

Pomocí těchto XYFocus vlastností může nadřazený ovládací prvek také vynutit navigaci podřízených položek, pokud další kandidát fokusu není ve vizuálním stromu, ledaže podřízený s fokusem použije stejnou XYFocus vlastnost.

<StackPanel Orientation="Horizontal" Margin="300,300">
    <UserControl XYFocusRight="{x:Bind ButtonThree}">
        <StackPanel>
            <Button Content="One"/>
            <Button Content="Two"/>
        </StackPanel>
    </UserControl>
    <StackPanel>
        <Button x:Name="ButtonThree" Content="Three"/>
        <Button Content="Four"/>
    </StackPanel>
</StackPanel>

Pokud je v ukázce výše fokus na Button Dvou a uživatel se pohybuje doprava, nejlepším kandidátem na fokus je Button Čtyři; fokus se ale přesune na Button Tři, protože nadřazený UserControl prvek ho vynutí, aby tam přecházel, když je mimo jeho vizuální strom.

Cesta s nejmenšími kliknutími

Pokuste se uživateli povolit provádění nejběžnějších úloh v nejmenším počtu kliknutí. V následujícím příkladu se TextBlock umístí mezi tlačítko Přehrát (které se zpočátku zaměří) a běžně používaný prvek, aby se nepotřebný prvek umístil mezi prioritní úkoly.

V následujícím příkladu je TextBlock umístěn nad tlačítkem Přehrát místo původně plánovaného umístění. Jednoduše přeuspořádejte uživatelské rozhraní tak, aby nepotřebné prvky nebyly umístěny mezi úkoly s prioritou, výrazně zlepší použitelnost vaší aplikace.

CommandBar a ContextFlyout

Při použití panelu CommandBar mějte na paměti problém posouvání seznamu, jak je uvedeno v části Problém: Prvky uživatelského rozhraní umístěné po dlouhém posouvání seznamu nebo mřížky. Následující obrázek znázorňuje rozložení uživatelského rozhraní s CommandBar umístěným ve spodní části seznamu nebo mřížky. Aby se uživatel dostal k seznamu nebo mřížce CommandBar, musí se posouvat úplně dolů.

Co když vložíte CommandBarnad seznam nebo mřížku? Uživatel, který se posouval dolů v seznamu nebo mřížce, by se musel posouvat zpátky nahoru, aby se dostal k CommandBar, což je o něco méně navigace než u předchozí konfigurace. Mějte na paměti, že pokud je počáteční fokus vaší aplikace umístěn vedle nebo nad CommandBar; tento přístup nebude fungovat stejně dobře, pokud je počáteční fokus pod seznamem nebo mřížkou. Pokud jsou tyto CommandBar položky globálními položkami akcí, ke kterým není potřeba přistupovat velmi často (například tlačítko Synchronizovat ), může být přijatelné je mít nad seznamem nebo mřížkou.

I když nemůžete skládat CommandBarpoložky svisle, umístění položek proti směru posouvání (například doleva nebo vpravo od svislého posuvného seznamu nebo horní nebo dolní části vodorovného posuvného seznamu) je další možností, kterou byste měli zvážit, pokud je vhodné pro rozložení uživatelského rozhraní.

Pokud má vaše aplikace CommandBar, jehož položky musí být snadno přístupné uživatelům, můžete zvážit umístění těchto položek do objektu ContextFlyout a jejich odebrání z CommandBar. ContextFlyout je vlastnost UIElement a je kontextová nabídka přidružená k tomuto prvku. Na PC, když kliknete pravým tlačítkem myši na prvek s ContextFlyout, zobrazí se místní nabídka. Na Xboxu One k tomu dojde, když stisknete tlačítko Nabídky , zatímco fokus je na takovém prvku.

Problémy s rozložením uživatelského rozhraní

Některá rozložení uživatelského rozhraní jsou náročnější z důvodu povahy navigace fokusu XY a měla by se vyhodnotit podle jednotlivých případů. I když neexistuje jediný "správný" způsob a které řešení, které zvolíte, je až do konkrétních potřeb vaší aplikace, existují některé techniky, které můžete použít k vytvoření skvělého televizního prostředí.

Abychom to lépe pochopili, podívejme se na imaginární aplikaci, která ilustruje některé z těchto problémů a technik k jejich překonání.

Poznámka:

Tato falešná aplikace je určená k ilustraci problémů s uživatelským rozhraním a potenciálním řešením a není určená k zobrazení nejlepšího uživatelského prostředí pro vaši konkrétní aplikaci.

Následuje imaginární realitní aplikace, která zobrazuje seznam domů, které jsou k dispozici k prodeji, mapu, popis nemovitosti a další informace. Tato aplikace představuje tři výzvy, které můžete překonat pomocí následujících technik:

• Změna uspořádání uživatelského rozhraní
• Zapojení fokusu
• Režim myši

Problém: Prvky uživatelského rozhraní umístěné po dlouhém posouvání seznamu nebo mřížky

ListView vlastností zobrazených na následujícím obrázku je velmi dlouhý seznam, který se posouvá. Pokud se zapojenínevyžaduje, když uživatel přejde na ListView seznam, zaměření se umístí na první položku v seznamu. Aby se uživatel dostal na tlačítko Předchozí nebo Další , musí procházet všechny položky v seznamu. V takových případech, kdy je pro uživatele bolestivé procházet celý seznam – to znamená, pokud seznam není tak krátký, aby byl tento zážitek přijatelný – je možné, že budete chtít zvážit další možnosti.

Aplikace nemovitostí: Pro seznam s 50 položkami je zapotřebí 51 kliknutí, aby bylo možné dosáhnout na tlačítka níže.

Solutions

Změna uspořádání uživatelského rozhraní

Pokud není počáteční fokus umístěn na spodní části stránky, jsou prvky uživatelského rozhraní umístěné nad dlouhým seznamem pro posouvání obvykle snáze přístupné než ty umístěné pod ním. Pokud toto nové rozložení funguje pro jiná zařízení, může být změna rozložení pro všechny rodiny zařízení místo provádění speciálních změn uživatelského rozhraní jenom pro Xbox One levnějším přístupem. Umístění prvků uživatelského rozhraní proti směru posouvání (tj. vodorovně na svisle posouvající se seznam nebo svisle na vodorovně posouvající se seznam) zajistí ještě lepší přístupnost.

Zapojení fokusu

Když je vyžadováno zapojení, celý ListView se stane jediným cílem soustředění. Uživatel bude moct obejít obsah seznamu, aby se dostal k dalšímu fokusovatelnému prvku. Přečtěte si další informace o tom, co řídí interakci a její podporu a jak používat tyto ovládací prvky v Focus Engagement.

Problém: ScrollViewer bez jakýchkoli fokusovatelných prvků

Vzhledem k tomu, že navigace fokusu XY spoléhá na přechod k jednomu prvku uživatelského rozhraní najednou, může scrollViewer , který neobsahuje žádné fokusovatelné prvky (například jeden s pouze textem, jako v tomto příkladu), způsobit scénář, kdy uživatel nemůže zobrazit veškerý obsah v objektu ScrollViewer. Řešení pro tento a další související scénáře najdete v tématu Zapojení fokusu.

Problém: Uživatelské rozhraní pro volné posouvání

Pokud vaše aplikace vyžaduje volně scrollovatelné uživatelské rozhraní, jako je třeba plocha výkresu nebo v tomto příkladu mapa, navigace fokus XY zkrátka nefunguje. V takových případech můžete zapnout režim myši , aby uživatel mohl volně přecházet uvnitř prvku uživatelského rozhraní.

Režim myši

Na Xboxu One, jak je popsáno v navigaci a interakci fokusu XY, se fokus přesouvá pomocí navigačního systému XY, což uživateli umožňuje posunout fokus z jednoho ovládacího prvku na druhý pohybem nahoru, dolů, doleva a doprava. Některé ovládací prvky, například WebView a MapControl, však vyžadují interakci podobná myši, kde uživatelé mohou volně přesouvat ukazatel uvnitř hranic ovládacího prvku. Existují také některé aplikace, ve kterých je vhodné, aby uživatel mohl přesunout ukazatel po celé stránce a mít zážitek s gamepadem či dálkovým ovládáním podobný tomu, co uživatelé znají z počítače s myší.

V těchto scénářích byste měli požádat o ukazatel (režim myši) pro celou stránku nebo na ovládací prvek uvnitř stránky. Vaše aplikace může mít například stránku s ovládacím prvkem WebView, který používá režim myši pouze v rámci tohoto prvku, zatímco navigace pomocí XY zaměření se používá všude jinde. Pokud chcete požádat o ukazatel, můžete určit, zda ho chcete když je ovládací prvek nebo stránka aktivována nebo když má stránka fokus.

Poznámka:

Vyžádání ukazatele, když ovládací prvek získá fokus, není podporováno.

U webových aplikací XAML i hostovaných na Xboxu One je režim myši ve výchozím nastavení zapnutý pro celou aplikaci. Důrazně doporučujeme tuto možnost vypnout a optimalizovat aplikaci pro navigaci v XY. Chcete-li to provést, nastavte Application.RequiresPointerMode vlastnost tak WhenRequested , abyste povolili režim myši pouze při volání ovládacího prvku nebo stránky.

Pokud to chcete udělat v aplikaci XAML, použijte ve své App třídě následující kód:

public App()
{
    this.InitializeComponent();
    this.RequiresPointerMode =
        Windows.UI.Xaml.ApplicationRequiresPointerMode.WhenRequested;
    this.Suspending += OnSuspending;
}

Další informace, včetně ukázkového kódu pro HTML/JavaScript, naleznete v tématu Jak zakázat režim myši.

Následující diagram znázorňuje mapování tlačítek pro gamepad/remote v režimu myši.

Poznámka:

Režim myši se podporuje jenom na Xboxu One s gamepadem nebo vzdáleným ovládáním. U jiných rodin zařízení a typů vstupu je tiše ignorováno.

K aktivaci režimu myši na ovládacím prvku nebo stránce použijte vlastnost RequiresPointer . Tato vlastnost má tři možné hodnoty: Never (výchozí hodnota), WhenEngageda WhenFocused.

Aktivace režimu myši na ovládacím prvku

Když uživatel zapojí ovládací prvek RequiresPointer="WhenEngaged", režim myši se aktivuje na ovládacím prvku, dokud ho uživatel neodpojí. Následující fragment kódu ukazuje jednoduchý MapControl , který aktivuje režim myši při zapojení:

<Page>
    <Grid>
        <MapControl IsEngagementRequired="true"
                    RequiresPointer="WhenEngaged"/>
    </Grid>
</Page>

Poznámka:

Pokud ovládací prvek aktivuje režim myši při zapojení, musí také vyžadovat zapojení s IsEngagementRequired="true"; jinak režim myši nebude nikdy aktivován.

Pokud je ovládací prvek v režimu myši, budou jeho vnořené ovládací prvky také v režimu myši. Požadovaný režim podřízených položek bude ignorován – není možné, aby nadřazený objekt byl v režimu myši, ale dítě ne.

Režim požadovaný u ovládacího prvku se navíc kontroluje jenom v případě, když získá fokus, proto se režim dynamicky nezmění, když má fokus.

Aktivace režimu myši na stránce

Pokud má stránka vlastnost RequiresPointer="WhenFocused", režim myši se aktivuje pro celou stránku, jakmile stránka získá fokus. Následující fragment kódu ukazuje poskytnutí této vlastnosti stránky:

<Page RequiresPointer="WhenFocused">
    ...
</Page>

Poznámka:

Hodnota WhenFocused je podporována pouze u objektů Page . Pokud se pokusíte nastavit tuto hodnotu ovládacího prvku, vyvolá se výjimka.

Zakázání režimu myši pro obsah na celé obrazovce

Obvykle při zobrazení videa nebo jiných typů obsahu na celé obrazovce budete chtít skrýt kurzor, protože může uživatele rušit. K tomuto scénáři dochází, když zbytek aplikace používá režim myši, ale chcete ho vypnout při zobrazení obsahu na celé obrazovce. Chcete-li toho dosáhnout, umístěte obsah na celou obrazovku samostatně Pagea postupujte podle následujících kroků.

1. V objektu App nastavte RequiresPointerMode="WhenRequested".
2. V každém Page objektu s výjimkou celé obrazovky Page, nastavte RequiresPointer="WhenFocused".
3. Pro celou obrazovku Pagenastavte RequiresPointer="Never".

Tímto způsobem se kurzor při zobrazení obsahu na celé obrazovce nezobrazí.

Zaměření na vizuál

Vizuál fokusu je ohraničení kolem prvku uživatelského rozhraní, který má aktuálně fokus. To pomáhá orientovat uživatele, aby mohl snadno procházet uživatelské rozhraní bez ztráty.

Díky vizuální aktualizaci a mnoha možnostem přizpůsobení přidaným do fokusu můžou vývojáři důvěřovat tomu, že vizuál s jedním fokusem bude dobře fungovat na počítačích pc a Xboxu One a na všech ostatních zařízeních s Windows, která podporují klávesnici a/nebo gamepad/remote.

I když se stejný fokus dá použít na různých platformách, kontext, ve kterém se s ním uživatel setká, se pro 10-stop prostředí mírně liší. Měli byste předpokládat, že uživatel nevěná plnou pozornost na celou televizní obrazovku, a proto je důležité, aby aktuálně zaměřený prvek byl uživateli jasně viditelný, aby se zabránilo frustraci při hledání vizuálu.

Je také důležité mít na paměti, že vizuální zvýraznění se ve výchozím nastavení zobrazuje při použití gamepadu nebo dálkového ovládání, ale ne klávesnice. I když ji tedy neimplementujete, zobrazí se při spuštění aplikace na Xboxu One.

Počáteční vizuální umístění zaostření

Při spuštění aplikace nebo přechodu na stránku umístěte fokus na prvek uživatelského rozhraní, který dává smysl jako první prvek, na kterém by uživatel podnikl akci. Aplikace pro fotky může například zaostřit na první položku v galerii, a hudební aplikace, která přešla na podrobné zobrazení skladby, může zaostřit na tlačítko přehrát pro snadné přehrávání hudby.

Pokuste se umístit počáteční fokus do levé horní oblasti aplikace (nebo vpravo nahoře pro tok zprava doleva). Většina uživatelů se nejprve zaměřuje na ten roh, protože tok obsahu aplikací obvykle začíná tam.

Zviditelnění fokusu

Jeden vizuál fokusu by měl být vždy viditelný na obrazovce, aby uživatel mohl vybrat místo, kde skončil, aniž by hledal fokus. Podobně by měla být vždy na obrazovce fokuselná položka – nepoužívejte například automaticky otevíraná okna s pouze textem a žádnými prvky s fokusem.

Výjimkou tohoto pravidla by bylo zobrazení na celé obrazovce, například při sledování videí nebo prohlížení obrázků, v těchto případech by nebylo vhodné zobrazit vizuální zaměření.

Zobrazení fokusu

Zobrazit fokus je světelný efekt, který animuje ohraničení fokusu, například tlačítka, když na ně uživatel přesune gamepad nebo fokus klávesnice. Animace záře kolem okraje zaměřených prvků poskytuje uživatelům lepší přehled o tom, kde je fokus a kam se pohybuje.

Zobrazení fokusu je ve výchozím nastavení vypnuté. Pro 10-footové zážitky byste se měli rozhodnout odhalit fokus nastavením vlastnosti Application.FocusVisualKind v konstruktoru vaší aplikace.

    if(AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Xbox")
    {
        this.FocusVisualKind = FocusVisualKind.Reveal;
    }

Další informace naleznete v pokynech pro odhalení fokusu.

Přizpůsobení zobrazení zaostření

Pokud chcete přizpůsobit fokusový vizuál, můžete to udělat úpravou vlastností souvisejících s vizuálem fokusu pro každý ovládací prvek. Existuje několik takových vlastností, které můžete využít k přizpůsobení aplikace.

Můžete se dokonce odhlásit ze systémově poskytovaných vizuálních indikátorů zaměření nakreslením vlastních pomocí vizuálních stavů. Další informace najdete v tématu VisualState.

Světlé zavření překrytí

Aby upozornil uživatele na prvky uživatelského rozhraní, které uživatel právě manipuluje pomocí herního ovladače nebo dálkového ovládání, UWP automaticky přidá "kouřovou" vrstvu, která pokrývá oblasti mimo vyskakovací uživatelské rozhraní, když aplikace běží na Xboxu One. To nevyžaduje žádnou další práci, ale při návrhu uživatelského rozhraní je potřeba mít na paměti. Vlastnost můžete nastavit LightDismissOverlayMode na libovolném FlyoutBase místě, aby se povolila nebo zakázala kouřová vrstva. Výchozí hodnota je Auto, což znamená, že je povolená na Xboxu a zakázaná jinde. Další informace naleznete v tématu Modal vs light dismiss.

Zapojení fokusu

Zapojení fokusu je určené k usnadnění práce s aplikací pomocí herního panelu nebo vzdáleného ovládání.

Poznámka:

Nastavení zapojení fokusu nemá vliv na klávesnici ani jiná vstupní zařízení.

Pokud je vlastnost IsFocusEngagementEnabled u objektu FrameworkElement nastavena na True, označí ovládací prvek jako vyžadování zapojení fokusu. To znamená, že uživatel musí stisknout tlačítko A/Select a "zapojit" ovládací prvek a pracovat s ním. Po dokončení můžou stisknutím tlačítka B/Back ovládací prvek zrušit a přejít z něj.

Poznámka:

IsFocusEngagementEnabled je nové rozhraní API, které ještě není zdokumentované.

Zachycení fokusu

Zachycení fokusu je to, co se stane, když se uživatel pokusí procházet uživatelské rozhraní aplikace, ale stane se "zachyceným" v rámci ovládacího prvku, což ztěžuje nebo dokonce znesnadňuje pohyb mimo tento ovládací prvek.

Následující příklad ukazuje uživatelské rozhraní, které zachytává fokus.

Pokud chce uživatel přejít od levého tlačítka k pravému tlačítku, bylo by logické předpokládat, že vše, co by museli udělat, je dvakrát stisknout tlačítko doprava na D-padu nebo levé páčce. Pokud posuvník ale nevyžaduje zapojení, nastalo by následující chování: Když uživatel poprvé stiskne klávesu vpravo, zaměření se přesune na Slider, a když stiskne vpravo znovu, posuvník Slider se přesune doprava. Uživatel by stále posouval popisovač doprava a nedokázal by se dostat k tlačítku.

Tento problém je možné obejít několika způsoby. Jedním z nich je navrhnout jiné rozložení, podobně jako v příkladu aplikace pro nemovitosti v navigaci a interakci ve fokusu XY, kde jsme přemístili tlačítka Předchozí a Další nad ListView. Problém by vyřešilo svislé naskládání ovládacích prvků místo vodorovného, jak je znázorněno na následujícím obrázku.

Teď může uživatel přejít na každý z ovládacích prvků tak, že na D-pad/levé páčce stiskne směrem nahoru a dolů, a když má Slider fokus, může stisknutím levého a pravého tlačítka posunout Slider úchyt, jak se očekává.

Dalším přístupem k řešení tohoto problému je vyžadovat zapojení do Slidersystému . Pokud nastavíte IsFocusEngagementEnabled="True", výsledkem bude následující chování.

Slider Když vyžaduje zapojení fokusu, uživatel se může dostat k tlačítku vpravo jednoduše tak, že dvakrát stiskne vpravo na D-padu nebo levé páčce. Toto řešení je skvělé, protože nevyžaduje žádné úpravy uživatelského rozhraní a vytváří očekávané chování.

Ovládací prvky pro položky

Kromě posuvníku existují další ovládací prvky, které mohou vyžadovat interakci, například:

• ListBox
• ListView
• GridView
• FlipView (Převrátit)

Slider Na rozdíl od ovládacího prvku tyto ovládací prvky neuvězňují fokus uvnitř sebe; avšak mohou způsobovat problémy s použitelností, když obsahují velké objemy dat. Následuje příklad ListView , který obsahuje velké množství dat.

Podobně jako v příkladu Slider se pokusíme přejít z tlačítka v horní části na tlačítko v dolní části pomocí gamepadu nebo vzdáleného ovladače. Počínaje fokusem na horním tlačítku, se po stisknutí směrového ovladače/sticku, fokus přesune na první položku v ListView ("Položka 1"). Když uživatel znovu stiskne dolů, další položka v seznamu se zaměří, nikoli na tlačítko dole. Aby se uživatel dostal k tlačítku, musí nejprve procházet každou položku v ListView. ListView Pokud obsahuje velké množství dat, může to být nevhodné a ne optimální uživatelské prostředí.

Pokud chcete tento problém vyřešit, nastavte vlastnost IsFocusEngagementEnabled="True" na ListView, tak aby byla vyžadována interakce. Uživatel tak může rychle přeskočit přes ListView jednoduše tím, že stiskne tlačítko. Nebudou moci seznam procházet ani vybírat položku, pokud ji neaktivují stisknutím tlačítka A/Select, když je na ni zaměřený fokus, a poté stisknutím tlačítka B/Zpět aby fokus uvolnili.

Prohlížeč ScrollViewer

Mírně se liší od těchto ovládacích prvků scrollViewer, který má své vlastní vychytáky, které je potřeba vzít v úvahu. Pokud máte ScrollViewer se zaměřitelným obsahem, ve výchozím nastavení vám přechod na ScrollViewer umožní procházet jeho prvky, které lze zaměřit. Stejně jako v případě ListView, musíte pro navigaci mimo ScrollViewer procházet jednotlivé položky.

Pokud ScrollViewer nemá žádný fokusovatelný obsah - například pokud obsahuje jenom text - můžete nastavit IsFocusEngagementEnabled="True" tak, aby uživatel mohl interagovat s ScrollViewer pomocí tlačítka A/Select. Jakmile se zapojí, mohou se posouvat přes text pomocí D-pad/left stick, a poté, co skončí, se mohou odpojit stisknutím tlačítka B/Zpět.

Dalším přístupem by bylo nastavit IsTabStop="True" na ScrollViewer tak, aby uživatel nemusel používat ovládací prvek – může na něj jednoduše zaměřit fokus a pak se posouvat pomocí D-padu/levé páčky, pokud v ScrollViewer nejsou žádné fokusovatelné prvky.

Výchozí nastavení zapojení fokusu

Některé ovládací prvky způsobují zachytávání fokusu tak často, že jejich výchozí nastavení vyžaduje aktivaci fokusu, zatímco u jiných je tato funkce ve výchozím nastavení vypnuta, ale může být užitečné ji zapnout. Následující tabulka uvádí tyto ovládací prvky a jejich výchozí chování zapojení fokusu.

Řízení	Výchozí nastavení zapojení fokusu
Výběr data v kalendáři	On
FlipView	Off
Mřížkový pohled	Off
ListBox	Off
Zobrazení seznamu	Off
Prohlížeč ScrollViewer	Off
SémanticZoom	Off
Posuvník	On

Všechny ostatní ovládací prvky Windows nezpůsobí žádné změny v chování nebo vzhledu, když IsFocusEngagementEnabled="True".

Shrnutí

Můžete vytvářet aplikace pro Windows, které jsou optimalizované pro konkrétní zařízení nebo prostředí, ale univerzální platforma Windows také umožňuje vytvářet aplikace, které se dají úspěšně používat na různých zařízeních, v prostředích s 2 a 10 stopami a bez ohledu na vstupní zařízení nebo uživatelskou schopnost. Pomocí doporučení v tomto článku můžete zajistit, aby vaše aplikace byla stejně dobrá, jako by byla na televizoru i počítači.

Související články

• Navrhování pro Xbox a TV
• Úvod do zařízení pro aplikace pro Windows