Unity UIElements: erste Eindrücke in der Produktion

Heute werden wir unsere Eindrücke von der Arbeit mit dem anerkannten Framework von Unity - UIToolkit, auch bekannt als UIElements, teilen. Wir werden die Hauptfunktionen durchgehen, ohne tief in den Code einzutauchen. Es sollte klargestellt werden, dass das Team noch keine Erfahrung mit dem Weblayout hatte und dass Dinge, die für Fachleute in diesem Bereich offensichtlich sind, für uns möglicherweise nicht offensichtlich sind.

Anmerkung des Partners des MAI IT-Centers und des Veranstalters des Masterstudiengangs „ VR / AR & AI “ - PHYGITALISM .

Hintergrund

Unity IMGUI , . , , : , . IMGUI UGUI , . UI (Canvas, Image, Button .). IMGUI, : ( ), , , ..

, UGUI, Unity Asset Store. , DoozyUI , , — Procedural UI Image.

Unity 2019.1 — UIElements ( UIToolkit, ) — Unity. , Editor, Runtime roadmap.

Building UI for games with the new UI Builder — Unite Copenhagen.

HTML/XAML/XML CSS . UIElements : UXML , USS , .. , , . , , , USS ( ).

Building UI for games with the new UI Builder — Unite Copenhagen.

UIElements

: preview . , ?

, , 3D 2D , . , GUI . Unity UGUI Canvas, CanvasGroup, LayoutGroup. , . .

, UIElements.

-, runtime. . runtime Unite 2018 .

-, UI. , UGUI .

-, 2D GUI . UI ? .

-, UI . , , . UGUI , .

, Unity , — , Unity . — UGUI.

UIElements . 2019.4, 2020.1 .

runtime , , . - , , runtime. .

. UIElements UGUI. Unity , , UI , . . , UIElements .

Flexbox , , Unity , . , USS CSS , UIElements. , , , , UIBuilder — . UIElements , UGUI, .. UGUI . . , — . .

best practices . , ? . ? , . ? , , , . : - . , -- best practices , , — . .

UIElements UI, IMGUI , , . , , , UIElements , — UIElements . , , .

, , . UGUI, . . Figma, Unity, . , Figma flexbox, CSS , . USS CSS , , . Unity UIBuilder. UIElements inlined styles, UXML. , . . . , , . , , , UGUI.

, . DOTween Pro , , 2D , DOTween.

2020.1 , DOTween’, c . UIToolkitUnityRoyaleRuntimeDemo:

public void AnimatedScale(float endScale, float tweenDuration)
        {
            experimental.animation
               .Scale(endScale, Mathf.RoundToInt(tweenDuration * 1000))  
               .Ease(Easing.OutQuad);
        }

       public void MoveTo(Vector2 screenPosition)
        {
            transform.position = 
              new Vector3(
                 screenPosition.x, 
                 screenPosition.y, 
                 transform.position.z);
        }

       public void AnimatedMoveTo(Vector2 endPosition, float tweenDuration)
        {
            experimental.animation
                .Position(
                    new Vector3(
                        endPosition.x, 
                        endPosition.y, 
                        transform.position.z),
            Mathf.RoundToInt(tweenDuration * 1000)).Ease(Easing.OutQuad);
        }

Listview UIElements — , . UGUI “ ” , EnhancedScroller, . , .

. , . , EventSystem Event Generation: Read Input ( ) IMGUI Events.

Read Input Listview , .. ProcessMouseEvents() UIElementsEventSystem . IMGUI Events . , . , Unity Technologies.

. -. , CSS , . . VisualElement , UIBuilder. , , inlined , , — . , . , . . UIElements , .

, — , . , , Unity UIElements.

, , Unity. , . Windows WebGL, , . - UIElements . , . , , .

, UIElements , .. , Google, , Unity .

, , ?

Unity Forum.

, UIElements PC , , UIElements. “” , , UGUI.