Tlačítka – MRTK2
Tlačítko umožňuje uživateli aktivovat okamžitou akci. Je to jedna z nejzákladnějších součástí hybridní reality. MRTK poskytuje různé typy prefab tlačítek.
Button prefabs in MRTK
Příklady prefab tlačítek ve MRTK/SDK/Features/UX/Interactable/Prefabs
složce
Tlačítka založená na obrázku/grafiku uživatelského rozhraní Unity
UnityUIInteractableButton.prefab
PressableButtonUnityUI.prefab
PressableButtonUnityUICircular.prefab
PressableButtonHoloLens2UnityUI.prefab
Tlačítka založená na uchytávači
PressableButtonHoloLens2
PressableButtonHoloLens2Unplated
PressableButtonHoloLens2Circular
tlačítko HoloLens 2 ve stylu shellu s zadní deskou, které podporuje různé vizuální zpětné vazby, jako je osvětlení ohraničení, bezkontaktní světlo a komprimovaná přední deska
tlačítko HoloLens 2 ve stylu shellu bez backplate
tlačítko HoloLens 2 ve stylu shellu s kruhovým tvarem
PressableButtonHoloLens2_32x96
PressableButtonHoloLens2Bar3H
PressableButtonHoloLens2Bar3V
Široké tlačítko ve stylu shellu HoloLens 2 32x96mm
Vodorovný panel tlačítek HoloLens 2 se sdílenou zadní deskou
Svislý HoloLens 2 panel tlačítek se sdílenou zadní deskou
PressableButtonHoloLens2ToggleCheckBox_32x32
PressableButtonHoloLens2ToggleSwitch_32x32
PressableButtonHoloLens2ToggleRadio_32x32
zaškrtávací políčko HoloLens 2 shell-style 32x32mm
HoloLens 2 skořepinový spínač 32x32mm
HoloLens 2 shell-style radio 32x32mm
PressableButtonHoloLens2ToggleCheckBox_32x96
PressableButtonHoloLens2ToggleSwitch_32x96
PressableButtonHoloLens2ToggleRadio_32x96
HoloLens 2 zaškrtávací políčko ve stylu shellu 32x96mm
HoloLens 2 skořepinový spínač 32x96mm
HoloLens 2 shell-style radio 32x96mm
kruhový
ToggleSwitch
Kruhové tlačítko
Zaškrtávací políčko
Přepnout přepínač
ButtonHoloLens1
PressableRoundButton
Tlačítko stylu prostředí HoloLens 1. generace
Tlačítko kolečka obrazce
Tlačítko Basic
Objekt Button
(Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/Button.prefab) je založený na koncepci Interactable , která poskytuje snadné ovládací prvky uživatelského rozhraní pro tlačítka nebo jiné typy interaktivních povrchů. Tlačítko směrného plánu podporuje všechny dostupné metody zadávání, včetně kloubového zadávání rukou pro blízké interakce a také pohledem a klepnutím vzduchem pro vzdálené interakce. K aktivaci tlačítka můžete použít také hlasový příkaz.
PressableButtonHoloLens2
(Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonHoloLens2.prefab) je tlačítko ve stylu prostředí HoloLens 2, které podporuje přesný pohyb tlačítka pro vstup přímého sledování rukou. Kombinuje Interactable
skript se skriptem PressableButton
.
Pro HoloLens 2 se doporučuje používat tlačítka s neprůspornou zadní deskou. Transparentní tlačítka se nedoporučují kvůli těmto problémům s použitelností a stabilitou:
- Ikona a text jsou obtížně čitelné ve fyzickém prostředí
- Je těžké pochopit, kdy se událost aktivuje.
- Hologramy zobrazené průhlednou rovinou můžou být nestabilní se stabilizací hloubky LSR HoloLens 2
Jak používat tlačítka stisknutelná
Tlačítka založená na uživatelském rozhraní Unity
Vytvoření plátna ve scéně (GameObject –> uživatelské rozhraní –> Plátno) Na panelu inspektoru plátna:
- Klikněte na Převést na plátno MRTK.
- Klikněte na Přidat NearInteractionTouchableUnityUI.
- Nastavte měřítko X, Y a Z komponenty Rect Transform na 0,001.
Potom přetáhněte PressableButtonUnityUI
(Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonUnityUI.prefab), PressableButtonUnityUICircular
(Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonUnityUICircular.prefab) nebo PressableButtonHoloLens2UnityUI
(Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonHoloLens2UnityUI.prefab) na plátno.
Tlačítka založená na uchytávači
Jednoduše přetáhněte PressableButtonHoloLens2
(Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonHoloLens2.prefab) nebo PressableButtonHoloLens2Unplated
(Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonHoloLens2Unplated.prefab) do scény. Tyto prefaby tlačítek jsou již nakonfigurovány tak, aby měly audiovizuální zpětnou vazbu pro různé typy vstupů, včetně artikulovaného zadávání rukou a pohledu.
Události vystavené v samotném prefabu a také interagovatelná komponenta se dají použít k aktivaci dalších akcí. Pomocí stisknutelných tlačítek ve scéně HandInteractionExample aktivují změnu barvy datové krychle událostí Interactable OnClick . Tato událost se aktivuje pro různé typy metod zadávání, jako je pohled, klepnutí vzduchem, ruční paprsek a také fyzické stisknutí tlačítka pomocí stisknutelného skriptu tlačítka.
Můžete nakonfigurovat, kdy se stisknutím tlačítka aktivuje událost OnClick prostřednictvím PhysicalPressEventRouter
tlačítka na tlačítku. Můžete například nastavit, aby se při kliknutí na tlačítko aktivovalo, když je tlačítko poprvé stisknuto, a ne aby se stisklo a uvolnilo, a to nastavením Možnosti interakce při kliknutí na při stisknutí události.
Pokud chcete využít konkrétní informace o stavu zadávání rukou, můžete použít události tlačítek, které lze stisknout – Touch Begin, Touch End, Button Pressed, Button Uvolněno. Tyto události se však neaktivují v reakci na vzduchové klepnutí, ruční paprsky nebo vstupy očí. Pro podporu blízkých i vzdálených interakcí se doporučuje použít událost OnClick v interakci.
Stavy interakce
Ve stavu nečinnosti není přední deska tlačítka viditelná. Když se prst přiblíží nebo kurzor ze vstupu pohledu cílí na povrch, bude vidět zářící okraj přední desky. Na povrchu přední desky je další zvýraznění pozice prstu. Při stisknutí prstem se přední deska pohybuje prstem. Když se prst dotkne povrchu přední desky, zobrazí se jemný impulsní efekt, který poskytuje vizuální zpětnou vazbu k dotykovému bodu.
V HoloLens 2 tlačítku ve stylu prostředí existuje mnoho vizuálních upozornění a cen, které zvyšují důvěru uživatele při interakci.
Bezkontaktní světlo | Zvýraznění fokusu | Komprimační klec | Puls na triggeru |
Efekt jemného impulsu se aktivuje stisknutím tlačítka, které hledá bezkontaktní světlo(y), které se nacházejí na aktuálně interagující ukazateli. Pokud jsou nalezena světla blízkosti, ProximityLight.Pulse
je volána metoda, která automaticky animuje parametry shaderu pro zobrazení impulsu.
Vlastnosti inspektoru
UchytávačeBox Collider
krabic pro přední desku tlačítka.
Tlačítko stisknutelné Logika pohybu tlačítka pomocí interakce stisknutou rukou
Směrovač událostí fyzického stisknutí Tento skript odesílá události z interakce pomocí ručního stisknutí do interagovatelné.
Interagovatelnýinteragovatelný zpracovává různé typy stavů a událostí interakce. Tento skript přímo zpracovává pohled, gesta a hlasový vstup HoloLensu a vstup ovladače pohybu imerzivní náhlavní soupravy.
Zdroj zvuku Zdroj zvuku Unity pro klipy zvukové zpětné vazby.
NearInteractionTouchable.cs : Vyžaduje se, aby se jakýkoli objekt dotýkal pomocí artikulovaného vstupu rukou.
Rozložení prefab
Objekt ButtonContent obsahuje přední desku, textový popisek a ikonu. FrontPlate reaguje na blízkost prstu indexu pomocí Button_Box shaderu. Zobrazuje zářící ohraničení, blízké světlo a pulsní efekt na dotykové ovládání. Textový popisek je vytvořený pomocí TextMesh Pro. Viditelnost SeeItSayItLabel se řídí motivem Interactable.
Jak změnit ikonu a text
Tlačítka MRTK používají komponentu ButtonConfigHelper
, která vám pomůže se změnou ikony, textu a popisku tlačítka. (Všimněte si, že některá pole můžou chybět, pokud na vybraném tlačítku nejsou prvky.)
Vytváření a úpravy sad ikon
Sada ikon je sdílená sada prostředků ikon, které komponenta ButtonConfigHelper
používá. Podporují se tři styly ikon.
- Ikony čtyřúhelníku se na čtyřúhelníku vykreslují 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 listu sprite nebo pokud chcete, aby se prostředky ikon sdílely s komponentami uživatelského rozhraní Unity. Pokud chcete tento styl použít, 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 raději používáte písmo ikony. Pokud chcete použít písmo ikony HoloLens, budete muset vytvořitTextMeshPro
asset písma.
Pokud chcete změnit styl, který tlačítko používá, rozbalte rozevírací seznam Ikony v nástroji ButtonConfigHelper a vyberte z rozevíracího seznamu Styl ikon .
Vytvoření nové ikony tlačítka:
V okně Project (Projekt ) klikněte pravým tlačítkem na Assets (Prostředky ), aby se otevřela místní nabídka. (Můžete také kliknout pravým tlačítkem na prázdné místo ve složce Assets nebo v jedné z jejích podsložek.)
Vyberte Vytvořit > sadu ikon sady Mixed Reality > Toolkit>.
Pokud chcete přidat ikony čtyřúhelníku a spritu, jednoduše je přetáhněte do příslušných polí. Pokud chcete přidat ikony znaku, musíte nejprve vytvořit a přiřadit prostředek písma.
V MRTK 2.4 a novějších aplikacích doporučujeme přesunout textury vlastních ikon do sady ikon. Chcete-li upgradovat prostředky na všech tlačítkách v projektu na nový doporučený formát, použijte ButtonConfigHelperMigrationHandler. (Mixed Reality Toolkit –> Nástroje –> Okno migrace –> Výběr obslužné rutiny migrace –> Microsoft.MixedReality.Toolkit.Utilities.ButtonConfigHelperMigrationHandler)
K upgradu tlačítek se vyžaduje import balíčku Microsoft.MixedRealityToolkit.Unity.Tools.
Pokud se ve výchozí sadě ikon během migrace nenajde ikona, vytvoří se vlastní sada ikon v souboru MixedRealityToolkit.Generated/CustomIconSets. Dialogové okno bude indikovat, že k tomu došlo.
Vytvoření prostředku písma ikony HoloLens
Nejdřív naimportujte písmo ikony do Unity. Na počítačích s Windows najdete výchozí písmo HoloLens v části Windows/Fonts/holomdl2.ttf. Zkopírujte a vložte tento soubor do složky Assets.
Dále otevřete TextMeshPro Font Asset Creator v okně > TextMeshPro > Font Asset Creator. Tady jsou doporučená nastavení pro generování atlasu písem HoloLens. Pokud chcete zahrnout všechny ikony, vložte do pole Pořadí 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
Po vygenerování prostředku písma ho uložte do projektu a přiřaďte ho k poli Písmo znakové ikony sady ikon. Teď se vyplní rozevírací seznam Dostupné ikony . Pokud chcete ikonu zpřístupnit pro použití tlačítkem, klikněte na ni. Přidá se do rozevíracího seznamu Vybrané ikony a zobrazí se v okně ButtonConfigHelper.
Volitelně můžete této ikoně dát značku. To umožňuje nastavit ikonu za běhu.
public void SetButtonToAdjust()
{
ButtonConfigHelper buttonConfigHelper = gameObject.GetComponent<ButtonConfigHelper>();
buttonConfigHelper.SetCharIconByName("AppBarAdjust");
}
Pokud chcete použít sadu ikon, vyberte tlačítko, rozbalte rozevírací seznam Ikony v poli ButtonConfigHelper
a přiřaďte ho k poli Sada ikon .
Jak změnit velikost tlačítka
HoloLens 2 velikost tlačítka ve stylu shellu je 32 x 32 mm. Pokud chcete přizpůsobit rozměr, změňte velikost těchto objektů v panelu prefab tlačítka:
- FrontPlate
- Čtyřúhelník pod zadní deskou
- Box Collider na kořenovém adresáři
Potom klikněte na tlačítko Fix Bounds ve skriptu NearInteractionTouchable, který je v kořenovém adresáři tlačítka.
Aktualizace velikosti frontplate 1
Aktualizace velikosti
Aktualizace velikosti přizpůsobení velikosti tlačítka uchycovače
Klikněte na Fix Bounds
Hlasový příkaz ("see-it, say-it")
Obslužná rutina vstupu řečiInteragovatelný skript v tlačítku Pressable již implementuje IMixedRealitySpeechHandler
. Tady můžete nastavit klíčové slovo hlasového příkazu.
Vstupní profil řeči Kromě toho je potřeba zaregistrovat klíčové slovo hlasového příkazu v globálním profilu hlasových příkazů.
See-it, Say-it label Prefab stisknutelného tlačítka má zástupný popisek TextMesh Pro pod objektem SeeItSayItLabel . Tento popisek můžete použít ke sdělení klíčového slova hlasového příkazu pro tlačítko uživateli.
Jak vytvořit tlačítko od nuly
Příklady těchto tlačítek najdete ve scéně PressableButtonExample .
1. Vytvoření stisknutelného tlačítka s datovou krychlí (pouze v blízkosti interakce)
- Vytvoření datové krychle Unity (GameObject > 3D Object > Cube)
- Přidání
PressableButton.cs
skriptu - Přidání
NearInteractionTouchable.cs
skriptu
Na panelu PressableButton
Inspektor přiřaďte objekt datové krychle k pohyblivým vizuálům tlačítek.
Když vyberete datovou krychli, uvidíte na objektu více barevných vrstev. Tím se vizualizují hodnoty vzdálenosti v části Stisknutí nastavení. Pomocí popisovačů můžete nakonfigurovat, kdy se má spustit stisknutí (přesunutí objektu) a kdy se má aktivovat událost.
Když stisknete tlačítko, přesune se a vygeneruje správné události vystavené ve PressableButton.cs
skriptu, jako jsou TouchBegin(), TouchEnd(), ButtonPressed(), ButtonReleased().
Poradce při potížích
Pokud vaše tlačítko provádí dvojité stisknutí, ujistěte se, že je aktivní vlastnost Vynutit front Push a že rovina Start Push Distance je umístěna před rovinu dotykového ovládání blízké interakce . Dotyková rovina blízké interakce je označená modrou rovinou umístěnou před počátek bílé šipky v následujícím obrázku:
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ňují přidávání vizuální zpětné vazby. Vytvořte materiál a vyberte shader Mixed Reality Toolkit/Standard
. Nebo můžete použít nebo duplikovat některý ze stávajících materiálů v rámci /SDK/StandardAssets/Materials/
, který používá MRTK Standard Shader.
Zkontrolujte Hover Light
a Proximity Light
v části Fluent Options (Možnosti fluentu). To umožňuje vizuální zpětnou vazbu pro interakce blízké ruky (bezkontaktní světlo) i vzdáleného ukazatele (ukazatel myši).
3. Přidání zvukové zpětné vazby k tlačítku základní datové krychle
Vzhledem k tomu, že PressableButton.cs
skript zveřejňuje události, jako jsou TouchBegin(), TouchEnd(), ButtonPressed(), ButtonReleased(), můžeme snadno přiřadit zvukovou zpětnou vazbu. Jednoduše přidejte unity do objektu datové krychle Audio Source
a pak přiřaďte zvukové klipy výběrem AudioSource.PlayOneShot(). Ve složce můžete použít MRTK_Select_Main a MRTK_Select_Secondary zvukové klipy /SDK/StandardAssets/Audio/
.
4. Přidání vizuálních stavů a zpracování událostí vzdálené interakce
Interagovatelný je skript, který usnadňuje vytvoření vizuálního stavu pro různé typy vstupních interakcí. Zpracovává také události vzdálené interakce. Přidejte Interactable.cs
objekt datové krychle a přetáhněte ho do pole Cíl v části Profily. Pak vytvořte nový motiv s typem ScaleOffsetColorTheme. V tomto motivu můžete určit barvu objektu pro konkrétní stavy interakce, například Fokus a Stisknutí. Můžete také řídit škálování a posun. Zkontrolujte uvolnění a nastavte dobu trvání, aby byl přechod vizuálu plynulý.
Uvidíte, jak objekt reaguje na vzdálené interakce (paprsky rukou nebo kurzoru pohledu) i blízko (ruka).
Příklady vlastních tlačítek
Ve scéně HandInteractionExample si prohlédněte příklady klavíru a kulatého tlačítka, které používají PressableButton
.
Každá klávesa na klavír má přiřazené PressableButton
NearInteractionTouchable
písmo a skript. Je důležité ověřit, jestli je směr místního přesměrováníNearInteractionTouchable
správný. Je reprezentována bílou šipkou v editoru. Ujistěte se, že šipka ukazuje směrem od předního obličeje tlačítka: