입문

안녕하십니까, 저는 한가로운 엔지니어입니다.
인터넷 블로그, 가능하다면 보십시오.
이번에는 Unity 2019의 새로운 기능인 UIELements의 사용법을 설명해 드리겠습니다.
꼭 저랑 사귀세요.

UIELEMents란 무엇입니까?

기존 편집기 확장 시스템의 ImGui를 대체하는 새로운 GUI 시스템이 될 것입니다.또한 앞으로 실행될 UI(uGUI)도 UIELements로 대체됩니다.

개발자가 UI 레이아웃과 스타일 설정을 신속하게 만들고 편집할 수 있는 새로운 보존 모드 GUI 시스템입니다.
새 GUI 시스템은 Unity UI를 만들고 최적화하기 위해 웹 CSS, jQuery, HTML DOM 및 Events 시스템에서 개념을 빌려 사용합니다.
또한 스타일시트와 동적/컨텍스트 이벤트 처리 등 다양한 새로운 기능을 제공하여 성능을 향상시켰습니다.
성능과 확장성 측면에서 새로운 시스템을 구축했기 때문에 전통적인 전면적인 C#API가 있어 개발자가 UI를 구축, 수정, 상호작용을 할 수 있다.
익숙한 C#API, 이벤트 시스템, CSS 및 XML 가져오기 형식을 사용하여 사용자 인터페이스를 쉽게 구축할 수 있습니다.
UI Elements는 편집기 UI를 확장하고 만드는 데 사용되는 IMGUI를 대체하고 실행 중인 UI를 만드는 데 uGUI를 대체합니다.
https://blogs.unity3d.com/jp/2019/04/16/introducing-unity-2019-1/#uielements
뭐 공부 해요?
이렇게 하면 편집기를 바람으로 확장할 수 있다.(지금)

이런 일은 uGUI가 앞으로 UIELements에서 할 수 있을 것이다.(미래)

UIELements는 어떤 용도로 사용할 수 있습니까?

참조Unity: UIELements 사용 방법(Unity 2019 새로운 기능).

사용 방법

새 창

쉽게 만들 수 있습니다. 편집기 폴더를 먼저 만드십시오.
그런 다음 마우스 오른쪽 버튼을 클릭하고 편집기 창 만들기 > 를 선택합니다.

UIELements의 창 제작 마법사가 표시되므로 이번에는 TestWindows 를 입력합니다.
그런 다음 Open file ~ 을 열고 Confirm 단추를 선택합니다.

축하합니다.
새 창이 생성되었습니다!!

만들기 마법사의 도움으로 다음 세 개의 파일이 만들어졌습니다.

창을 닫는 동안 오류가 발생하면 메뉴에서 창 > UIELements > TestWindows를 선택하여 다시 표시할 수 있습니다.

소스 코드 확인해 봐.

참조Unity: UIELements 사용 방법(Unity 2019 새로운 기능).

단일 스크립트에서 UIELements 사용

마지막으로 예시입니다. 저는 단독 스크립트에서 UIELements를 사용하고 싶습니다.
상기 견본의 C#소스 코드는 다음과 같이 변경되었는데, 내용은 AAA 스크립트에 UIELements를 응용한 느낌이다.

using UnityEditor;
using UnityEngine;
using UnityEngine.UIElements;
using UnityEditor.UIElements;

[CustomEditor(typeof(AAA))]
public class TestWindows : Editor
{
    public override VisualElement CreateInspectorGUI()
    {
        var root = new VisualElement();

        // VisualElements objects can contain other VisualElement following a tree hierarchy.
        VisualElement label = new Label("Hello World! From C#");
        root.Add(label);

        // Import UXML
        var visualTree = AssetDatabase.LoadAssetAtPath<VisualTreeAsset>("Assets/Editor/TestWindows.uxml");
        VisualElement labelFromUXML = visualTree.CloneTree();
        root.Add(labelFromUXML);

        // A stylesheet can be added to a VisualElement.
        // The style will be applied to the VisualElement and all of its children.
        var styleSheet = AssetDatabase.LoadAssetAtPath<StyleSheet>("Assets/Editor/TestWindows.uss");
        VisualElement labelWithStyle = new Label("Hello World! With Style");
        labelWithStyle.styleSheets.Add(styleSheet);
        root.Add(labelWithStyle);

        return root;
    }
}

아주 간단하게 AAA 스크립트에 UIELements를 적용했습니다.
이렇게 하면 풍부한 텍스트 단추를 설정하고 이미지를 표시하는 등 다양한 일을 할 수 있다.

이전에 쓴 보도에서 나는 검사기에 이미지 표시 를 표시하는 일을 했다.
UIELements 버전이라면 더 간단하게 기술할 수 있을 것 같고, 시간이 된다면 한번 해보고 싶어요!

관심점

표현력 높음(비싼) UI 범람, UI 통일감 상실?내 생각엔

끝날 때

가능하다면 블로그'웹 페이지 정보에도 많은 기록이 있으니 꼭 참조하세요.