Tlačítka

Hlavní tlačítko

Tlačítko dá uživateli možnost aktivovat okamžitou akci. Jedná se o jednu z nejzákladných základních komponent ve smíšené realitě. MRTK poskytuje různé typy prefabs tlačítek.

Tlačítko prefabs v MRTK

Příklady tlačítka prefabs ve MRTK/SDK/Features/UX/Interactable/Prefabs složce

Obrázek a tlačítka na obrázku uživatelského rozhraní Unity

  • UnityUIInteractableButton.prefab
  • PressableButtonUnityUI.prefab
  • PressableButtonUnityUICircular.prefab
  • PressableButtonHoloLens2UnityUI.prefab

Tlačítka založená na kolizích

PressableButtonHoloLens2 PressableButtonHoloLens2

PressableButtonHoloLens2Unplated PressableButtonHoloLens2Unplated

PressableButtonHoloLens2Circular PressableButtonHoloLens2Circular

tlačítko ve stylu prostředí HoloLens 2 s přední deskou, která podporuje různé vizuální názory, jako je světlo ohraničení, světlost a komprimovaná přední deska

tlačítko stylu prostředí HoloLens 2 bez přídesek

tlačítko stylu prostředí HoloLens 2 s kruhovým obrazcem

PressableButtonHoloLens2_32x96 PressableButtonHoloLens2_32x96

PressableButtonHoloLens2Bar3H PressableButtonHoloLens2Bar3H

PressableButtonHoloLens2Bar3V PressableButtonHoloLens2Bar3V

32x96mm tlačítko ve stylu prostředí pro velké HoloLens 2

panel tlačítek vodorovně HoloLens 2 se sdílenou deskou

panel tlačítek svisle HoloLens 2 se sdílenou deskou

PressableButtonHoloLens2ToggleCheckBox_32x32 PressableButtonHoloLens2ToggleCheckBox_32x32

PressableButtonHoloLens2ToggleSwitch_32x32 PressableButtonHoloLens2ToggleSwitch_32x32

PressableButtonHoloLens2ToggleRadio_32x32 PressableButtonHoloLens2ToggleRadio_32x32

32x32mm – zaškrtávací políčko ve stylu prostředí HoloLens 2

32x32mm přepínače ve stylu prostředí HoloLens 2

32x32mm HoloLens 2 – přepínač stylu prostředí

PressableButtonHoloLens2ToggleCheckBox_32x96 PressableButtonHoloLens2ToggleCheckBox_32x96

PressableButtonHoloLens2ToggleSwitch_32x96 PressableButtonHoloLens2ToggleSwitch_32x96

PressableButtonHoloLens2ToggleRadio_32x96 PressableButtonHoloLens2ToggleRadio_32x96

32x96mm – zaškrtávací políčko ve stylu prostředí HoloLens 2

32x96mm přepínače ve stylu prostředí HoloLens 2

32x96mm HoloLens 2 – přepínač stylu prostředí

Paprskové paprsky

Zaškrtávací políčko pro zaškrtávací políčko

ToggleSwitch ToggleSwitch

Kruhové tlačítko

Zaškrtávací políčko

Přepnout přepínač

ButtonHoloLens1 ButtonHoloLens1

PressableRoundButton PressableRoundButton

Tlačítko základního tlačítka

HoloLens tlačítko se stylem 1. generace prostředí

Kulaté tlačítko s kulatým tvarem

Základní tlačítko

ButtonMožnost (assets/MRTK/SDK/Features/UX/interaktivně/Prefabs/Button. Prefab) je založena na interaktivním konceptu pro tlačítka nebo jiné typy interaktivních povrchů. Tlačítko směrného plánu podporuje všechny dostupné vstupní metody, včetně kloubového vstupu pro blízkou interakci a také pohledu + vzduchový klepnutím pro zcela nové interakce. Pomocí hlasového příkazu můžete také aktivovat tlačítko.

PressableButtonHoloLens2(assets/MRTK/SDK/features/UX/interaktivně/Prefabs/PressableButtonHoloLens2. prefab) je tlačítko stylu prostředí HoloLens 2, které podporuje přesný pohyb tlačítka pro vstup přímo na sledování. Kombinuje Interactable skript se PressableButton skriptem.

v případě HoloLens 2 se doporučuje používat tlačítka s neprůhledným podtalířem. Průhledná tlačítka se nedoporučují z důvodu těchto potíží s touto použitelností a stabilitou:

  • Obtížné čtení ikony a textu s využitím fyzického prostředí
  • Je těžké pochopit, kdy se triggery událostí
  • Hologramy, které se zobrazují přes průhlednou rovinu, může být nestabilní s HoloLens 2 LSR stabilizace.

Tlačítko s deskou

Jak používat tlačítka pro tisk

Tlačítka založená na uživatelském rozhraní Unity

Vytvořte plátno ve scéně (GameObject-> uživatelské rozhraní > plátno). Na panelu inspektoru vašeho plátna:

  • Klikněte na tlačítko převést na plátno MRTK.
  • Klikněte na Přidat NearInteractionTouchableUnityUI.
  • Nastavte měřítko X, Y a Z transformační komponenty Rect na 0,001.

Pak přetáhněte PressableButtonUnityUI (assets/MRTK/SDK/Features/UX/interaktivně/Prefabs/PressableButtonUnityUI. Prefab), PressableButtonUnityUICircular (assets/MRTK/SDK/Features/UX/interaktivně/Prefabs/PressableButtonUnityUICircular. Prefab), nebo PressableButtonHoloLens2UnityUI (assets/MRTK/SDK/Features/UX/interaktivně/Prefabs/PressableButtonHoloLens2UnityUI. Prefab) na plátno.

Tlačítka založená na kolizích

Jednoduše přetáhněte PressableButtonHoloLens2 (assets/MRTK/SDK/Features/UX/interaktivně/Prefabs/PressableButtonHoloLens2. Prefab) nebo PressableButtonHoloLens2Unplated (assets/MRTK/SDK/Features/UX/interaktivně/Prefabs/PressableButtonHoloLens2Unplated. Prefab) do scény. Tato tlačítka prefabs jsou už nakonfigurovaná tak, aby měla zvukově vizuální zpětnou vazbu pro různé typy vstupů, včetně kloubového vstupu a pohledu.

Události, které jsou k dispozici v samotném Prefab, a také interaktivní komponentu lze použít k aktivaci dalších akcí. Tlačítka, která lze v HandInteractionExample scény použít k aktivaci změny v barvě datové krychle, můžete aktivovat pomocí události události události při kliknutí . Tato událost se aktivuje pro různé typy vstupních metod, jako je pohledu, vzduchový kohout, ruka-ray a fyzické tlačítko, které se stiskne přes skript pro stisknutí tlačítka.

How to Use Interactable

Můžete nakonfigurovat, kdy tlačítko po stisknutí tlačítka spustí událost po kliknutí PhysicalPressEventRouter na tlačítku. Například můžete nastavit, aby se aktivovalo tlačítko při prvním stisknutí tlačítka, a to na rozdíl od stisknutí a uvolnění, nastavením interakce po kliknutí na událost při stisknutí klávesy.

How to use events

Chcete-li využít konkrétní informace o stavu kloubového vstupu, můžete použít události tlačítek – dotykové ovládání, dotykové zakončení, stisknutí tlačítka, tlačítko vydáno. Tyto události se ale neaktivují v reakci na vstupy v ovzduší, v letadlech nebo na očí. Aby bylo možné podporovat obě interakce blízko i daleko, doporučuje se použít událost při kliknutí s možností interakce.

How to use Pressable Buttons

Stavy interakce

Ve stavu nečinnosti není přední deska tlačítka viditelná. V případě, že se k němu přiblíží nebo když je kurzor z pohledu vstupu zaměřen na povrch, bude okraj záře přední tabulky viditelný. K dispozici je další zdůraznění ruky na povrchu přední desky. Při nabízení prstem se přední deska pohybuje po ruce. Když se pohyb dotkne povrchu přední desky, zobrazuje nejemný pulsský efekt, který poskytuje vizuální zpětnou vazbu dotykového bodu.

v HoloLens 2 tlačítko ve stylu prostředí existuje mnoho vizuálních pomůcek a affordances, aby se zvýšila důvěra uživatele v interakci.

Světlo blízkosti Zvýraznění fokusu Probíhá komprimace klece. Pulse na triggeru
Světlo blízkosti Zvýraznění fokusu Probíhá komprimace klece. Pulse na triggeru

Jemný efekt Pulse se aktivuje tlačítkem stisknout, které vyhledá ProximityLighty , které jsou v aktuálně interaktivním ukazateli živé. Pokud jsou nalezeny nějaké indikátory blízkosti, ProximityLight.Pulse je volána metoda, která automaticky animuje parametry shaderu pro zobrazení Pulse.

Vlastnosti inspektoru

Struktura tlačítek

Box Coll urychlovač Box Collider pro přední desku tlačítka.

Stlačitelné tlačítko Logika pro pohyb tlačítka pomocí interakce stisknutí rukou.

Směrovač událostí fyzického stisknutí Tento skript odesílá události z interakce ručního stisknutí do interactable.

S interakcemi Interagovatelné zpracování různých typů stavů a událostí interakce. HoloLens tento skript přímo zpracovává pohled, gesto a hlasový vstup a vstup imerzivního ovladače pohybu náhlavní soupravy.

Zdroj zvuku Zvukový zdroj Unity pro zvukové klipy pro zpětnou vazbu.

NearInteractionTouchable.cs Vyžaduje se k ovládání jakéhokoli objektu pomocí articulovaného vstupu rukou.

Rozložení předfab

Objekt ButtonContent obsahuje přední desku, textový popisek a ikonu. FrontPlate reaguje na blízkost konečky prstů pomocí Button_Box shaderu. Ukazuje zářící hranice, bezkontaktní světlo a impulzní efekt na dotek. Textový popisek je tvořen textem TextMesh Pro. Viditelnost popisku SeeItLabel řídí motiv Interactable.

Rozložení tlačítka

Jak změnit ikonu a text

Tlačítka MRTK používají komponentu, která vám pomůže se změnou ikony, textu a popisku ButtonConfigHelper tlačítka. (Všimněte si, že některá pole nemusí chybět, pokud na vybraném tlačítku nejsou prvky.)

Pomocník pro konfiguraci tlačítek

Vytváření a úpravy sad ikon

Sada ikon je sdílená sada prostředků ikon používaných ButtonConfigHelper komponentou. Podporují se tři styly ikon.

  • Čtyřúhelníkové ikony se vykreslují na čtyřúhelníku pomocí MeshRenderer . Toto je výchozí styl ikony.
  • Ikony sprite se vykreslují pomocí SpriteRenderer . To je užitečné, pokud dáváte přednost importu ikon jako sprite sheet nebo pokud chcete, aby se prostředky ikon sdílely s komponentami uživatelského rozhraní Unity. Pokud chcete použít tento styl, budete muset nainstalovat balíček Sprite Editor (Windows -> Správce balíčků -> 2D Sprite).
  • Ikony znaků se vykreslují pomocí TextMeshPro komponenty. To je užitečné, pokud dáváte přednost použití písma ikony. Pokud chcete použít HoloLens ikonu písma, musíte vytvořit TextMeshPro asset písma.

Pokud chcete změnit styl, který tlačítko používá, rozbalte rozevírací seznam Ikony v buttonConfigHelper a vyberte ho z rozevíracího seznamu Styl ikony.

Novou sadu ikon tlačítka můžete vytvořit pomocí nabídky assetu: Create > Mixed Reality Toolkit > Icon Set (Vytvořit sadu ikon). Pokud chcete přidat ikony čtyřúhelníku a sprite, jednoduše je přetáhněte do příslušných polí. Pokud chcete přidat ikony znaků, musíte nejprve vytvořit a přiřadit asset písma.

V MRTK 2.4 a dalších doporučujeme přesunout textury vlastních ikon do sady ikon. Pokud chcete upgradovat prostředky u všech tlačítek v projektu na nový doporučený formát, použijte ButtonConfigHelperMigrationHandler. (Mixed Reality Toolkit -> Utilities -> Migration Window -> Migration Handler Selection -> Microsoft.MixedReality. Toolkit. Utilities.ButtonConfigHelperMigrationHandler)

Import balíčku Microsoft.MixedRealityToolkit.Unity.Tools potřebného k upgradu tlačítek

Dialogové okno Upgradovat

Pokud se ve výchozí ikoně nastavené během migrace nenachová ikona, vytvoří se v MixedRealityToolkit.Generated/CustomIconSets vlastní sada ikon. V dialogovém okně se zobrazí informace o tom, že k tomu došlo.

Oznámení o vlastní ikoně

Vytvoření assetu HoloLens ikony písma

Nejprve naimportujte písmo ikony do Unity. Na Windows počítačích najdete výchozí písmo HoloLens v souboru Windows/Fonts/holomdl2.ttf. Zkopírujte a vložte tento soubor do složky Assets.

Dále otevřete Tvůrce assetu písem TextMeshPro prostřednictvím okna > TextMeshPro a > assetu písma. Tady jsou doporučená nastavení pro vygenerování písma atlasu HoloLens písma. Pokud chcete zahrnout všechny ikony, vložte do pole Sekvence znaků následující rozsah Unicode:

E700-E702,E706,E70D-E70E,E710-E714,E718,E71A,E71D-E71E,E720,E722,E728,E72A-E72E,E736,E738,E73F,E74A-E74B,E74D,E74F-E752,E760-E761,E765,E767-E769,E76B-E76C,E770,E772,E774,E777,E779-E77B,E782-E783,E785-E786,E799,E7A9-E7AB,E7AF-E7B1,E7B4,E7C8,E7E8-E7E9,E7FC,E80F,E821,E83F,E850-E859,E872-E874,E894-E895,E8A7,E8B2,E8B7,E8B9,E8D5,E8EC,E8FB,E909,E91B,E92C,E942,E95B,E992-E995,E9E9-E9EA,EA37,EA40,EA4A,EA55,EA96,EB51-EB52,EB65,EB9D-EBB5,EBCB-EBCC,EBCF-EBD3,EC03,EC19,EC3F,EC7A,EC8E-EC98,ECA2,ECD8-ECDA,ECE0,ECE7-ECEB,ED17,EE93,EFA9,F114-F120,F132,F181,F183-F186

Vytvoření tlačítka 1

Jakmile je asset písma vygenerován, uložte ho do projektu a přiřaďte ho k poli Písmo ikony ikony sady ikon. Teď se naplní rozevírací seznam Dostupné ikony. Pokud chcete ikonu zobrazit pro použití tlačítkem, klikněte na něj. Přidá se do rozevíracího seznamu Vybrané ikony a zobrazí se v části Volitelně můžete ikonu ButtonConfigHelper. označit. To umožňuje nastavení ikony za běhu.

Vytvoření tlačítka 3

Vytvoření tlačítka 2

public void SetButtonToAdjust()
{
    ButtonConfigHelper buttonConfigHelper = gameObject.GetComponent<ButtonConfigHelper>();
    buttonConfigHelper.SetCharIconByName("AppBarAdjust");
}

Pokud chcete použít tlačítko Pro výběr sady ikon, rozbalte rozevírací seznam Ikony v poli a přiřaďte ho k ButtonConfigHelper poli Sada ikon.

Sada ikon tlačítka

Jak změnit velikost tlačítka

HoloLens velikost tlačítka ve stylu prostředí 2 je 32 × 32mm. Pokud chcete přizpůsobit dimenzi, změňte velikost těchto objektů v předběžném nastavení tlačítka:

  1. FrontPlate
  2. Čtyřúhelník v části BackPlate
  3. Box Collider v kořenovém adresáři

Potom ve skriptu NearInteractionTouchable, který je v kořenovém adresáři tlačítka, klikněte na tlačítko Fix Bounds (Opravit meze).

Aktualizace velikosti přizpůsobení velikosti tlačítka FrontPlate  1

Aktualizace velikosti přizpůsobení  Čtyřúhelníku velikosti tlačítka 2

Aktualizace velikosti přizpůsobení velikosti tlačítka u kolace  boxu 3

Kliknutí na Přizpůsobení velikosti tlačítka Fix Bounds  (Opravit meze) 4

Hlasový příkaz (see-it, say-it)

Obslužná rutina vstupu řeči Interaktivní skript v pressable button už implementuje IMixedRealitySpeechHandler . Tady můžete nastavit klíčové slovo hlasového příkazu.

Buttons Speech

Profil vstupu řeči Kromě toho je potřeba zaregistrovat klíčové slovo hlasového příkazu v globálním profilu příkazů řeči.

Button speech 2

See-it, Say-it label Předfab stlačitelného tlačítka má zástupný symbol TextMesh Pro pod objektem SeeItLabelItLabel. Tento popisek můžete použít ke sdělování klíčového slova hlasového příkazu pro tlačítko uživateli.

Button Speech 3

Vytvoření tlačítka od začátku

Příklady těchto tlačítek najdete ve scéně PressableButtonExample.

Pressable button cube 0

1. Vytvoření stlačitelného tlačítka s datovou krychlí (pouze bez interakce)

  1. Vytvoření datové krychle Unity (GameObject > 3D objektu > datové krychli)
  2. Přidání PressableButton.cs skriptu
  3. Přidání NearInteractionTouchable.cs skriptu

Na panelu PressableButton inspektoru přiřaďte objekt datové krychle vizuálům moving button visuals (Přesunutí vizuálů tlačítek).

pressable button cube 3

Když vyberete datovou krychli, uvidíte v objektu několik barevných vrstev. Vizualizovat hodnoty vzdálenosti v části Press Nastavení. Pomocí popisovačů můžete nakonfigurovat, kdy se má spustit stisknutí (přesunutí objektu) a kdy aktivovat událost.

Pressable Buton cube 1 Pressable button cube 2

Když stisknete tlačítko, přesune se a vygeneruje správné události vystavené ve skriptu, jako jsou PressableButton.cs TouchBegin(), TouchEnd(), ButtonPressed(), ButtonReleased().

Pressable button cube run 1

Řešení potíží

Pokud vaše tlačítko provádí dvojité stisknutí, ujistěte se, že je vlastnost Vynutit nabízení front-in aktivní a že je rovina počáteční nabízené vzdálenosti umístěná před rovinu Touchable s blízkou interakcí. Rovina Near Interaction Touchable je označená modrou rovinou umístěnou před počátkem bílé šipky na obrázku GIF níže:

Komponenta skriptu s tlačítkem pro stisknutí se zvýrazněnou vlastností Vynutit nabízení front-to-push

Animovaný příklad posunu počáteční nabízené vzdálenosti před blízkou interakci dotykovou rovinou

2. Přidání vizuální zpětné vazby k tlačítku základní datové krychle

MRTK Standard Shader poskytuje různé funkce, které usnadňuje přidání vizuální zpětné vazby. Vytvořte materiál a vyberte shader Mixed Reality Toolkit/Standard . Nebo můžete použít nebo duplikovat jeden ze stávajících materiálů v souboru , /SDK/StandardAssets/Materials/ který používá MRTK Standard Shader.

Pressable button cube 4

Zaškrtněte Hover Light a v části Fluent Proximity Light možnosti. To umožňuje vizuální zpětnou vazbu pro interakce bezkontaktní komunikace (bezkontaktní světlo) i interakci ukazatele na vzdálenost (najetí myší na světlo).

pressable button cube 5 pressable button cube run 2

3. Přidání zvukové zpětné vazby k tlačítku základní datové krychle

Vzhledem k tomu, že skript zveřejňuje události, jako PressableButton.cs je TouchBegin(), TouchEnd(), ButtonPressed(), ButtonReleased(), můžeme snadno přiřadit zpětnou vazbu ke zvuku. Jednoduše přidejte Unity do objektu datové krychle a Audio Source pak přiřaďte zvukové klipy výběrem audioSource.PlayOneShot(). V části Složka můžete použít MRTK_Select_Main a MRTK_Select_Secondary zvukové klipy /SDK/StandardAssets/Audio/ .

pressable button cube 7 Pressable Button Cube 6

4. přidání vizuálních stavů a zpracování událostí daleko souvisejících interakcí

Interaktivní je skript, který usnadňuje vytvoření vizuálního stavu pro různé typy vstupních interakcí. Také zpracovává mnohem události interakce. Přidejte Interactable.cs a přetáhněte objekt datové krychle do cílového pole v části profily. Pak vytvořte nový motiv s typem ScaleOffsetColorTheme. V rámci tohoto motivu můžete zadat barvu objektu pro konkrétní stavy interakce, jako je například fokus a stisknutí. Můžete také řídit škálování a posunutí. Zkontrolujte náběh a nastavte dobu trvání, aby bylo možné vizuální přechod plynule.

Vybrat motiv profilu

Uvidíte, že objekt reaguje na oboustranný (rukaový nebo pohledu kurzor) i na blízko (ruky) interakcí.

Pressable Button Cube Run 3 Pressable Button Cube Run 4

Příklady vlastních tlačítek

Ve scéně HandInteractionExamplese podívejte na příklady tlačítek klavír a round, které používají PressableButton .

Pressable Custom1 Pressable Custom2

Každý klíč klavír má PressableButton NearInteractionTouchable přiřazený skript a. Je důležité ověřit, zda je místní směr směrování v NearInteractionTouchable pořádku. Je reprezentovaná bílou šipkou v editoru. Ujistěte se, že šipka směřuje na přední stranu tlačítka:

Pressable Custom3

Viz také