입문

이 글의 독자로서 목표는 아래의 사람이다.
・Unity 2019에 들어가는 UIELEMENT를 터치하고 싶은데 어떤 파일을 생성해야 할지 전혀 모르겠어요.
도대체 어디서부터 만지는 게 좋을까?
이런 사람
개발 환경
・Unity 2019.1.0f2
・VisualStudio2017 Comunity
사전에 지식이 있다면 이해하기 쉬워질 수 있을까?
· UIELement 이전 편집기 확장(화면 표시 가능)
CSS 작성
・ XML 지식?

도대체 UIELEMENT가 뭐예요?

셀에서 UI를 구성하는 요소 중 하나를 선택합니다.UIELement, UnityUI(UGUI), IMGUI 중 하나입니다.
현재 상태는 편집기를 CSS화된 느낌으로 확장하여 UI를 만드는 방법입니다.
현재 공식 문서에 따르면 게임 측의 UI 설치는 미정이다
그 중에서 편집 확장뿐만 아니라 게임 방면의 UI로도 사용될 가능성이 있는가?
현황의 공식 미정의 처리

나타나는 파일

C# 파일 편집기를 표시하는 화면
UXML 파일... XML과 거의 동등한 Unityver 같은 것?
USS 파일/스타일시트 같은 거?

샘플 제작 방법

1. 리소스 편집기 파일에서 마우스 오른쪽 버튼으로 클릭한 다음 메뉴의 편집기 만들기/사용 창에서 마우스 오른쪽 버튼으로 클릭
에서 설명한 대로 해당 매개변수의 값을 수정합니다.
2.1 에서 파일 이름을 입력하고 Confilm 키를 누른 다음 화면이 나타납니다.

참고로 어떤 칸에 넣으면 다른 것도 똑같이 만들어집니다.
파일 이름을 입력하면 Enter도 작성할 수 있습니다.
파일 자체가 생성 중인 곳에서 생성된 것 같습니다.
3. 다음 화면이 나타납니다.

모든 파일의 의미와 용도.

USS 파일

특정 UI에 대한 발색
견본으로 말하면 다음과 같다.
sample.uss

Label {
    font-size: 10;
    font-weight: bold;
    text-color: rgb(68, 138, 255);
}

이 스타일을 C#측면 파일의 이 섹션에 적용
sample.cs

30行目
//スタイルシートの取得
var styleSheet = AssetDatabase.LoadAssetAtPath<StyleSheet>("Assets/Editor/Resources/samples.uss");
//ラベルの作成
VisualElement labelWithStyle = new Label("Hello World! With Style");
//作成したラベルに対して、スタイルシートを適用する。
labelWithStyle.styleSheets.Add(styleSheet);
//描画部分に対して適用する。
root.Add(labelWithStyle);

태그 요소의 표시 속성을 수정합니다.

UXML 파일

특정 UI의 경우 이 테이블에서만 다양한 작업을 수행할 수 있습니까?이것이 바로 지금의 인식이다
이 인식의 이유는 아래의 견본이다
다음은 문자열 한 줄만 변경되었습니다.
추가
samples.umxl

<?xml version="1.0" encoding="utf-8"?>
<engine:UXML
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:engine="UnityEngine.UIElements"
    xmlns:editor="UnityEditor.UIElements"
    xmlns:upm="UnityEditor.PackageManager.UI"

xsi:noNamespaceSchemaLocation="../../../UIElementsSchema/UIElements.xsd"
xsi:schemaLocation="
                        UnityEngine.UIElements ../../../UIElementsSchema/UnityEngine.UIElements.xsd
                        UnityEditor.UIElements ../../../UIElementsSchema/UnityEditor.UIElements.xsd
                        UnityEditor.PackageManager.UI ../../../UIElementsSchema/UnityEditor.PackageManager.UI.xsd
"
>
    <engine:Label text="Hello World! From UXML" />
</engine:UXML>

UXML의 C#을 적용하는 부분은 다음과 같습니다.
samples.cs

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

사용자 인터페이스 구성 방법

다음은 한 시간 정도 만진 느낌으로 절대적인 사용법은 아니다
틀렸나봐요.항상 느끼는 정도의 인식으로 잘 부탁드립니다.

1. 예전의 C#옆, 엉망진창으로 쓴 완결 스타일.

가장 간단하지만 이렇게 하면 이전의 편집기 확장과 큰 차이가 없기 때문에 UIELement를 사용할 이유가 거의 없다.
익숙한 부분에서 Editow Window를 계승하는 곳에서 진행하는 것이 좋습니다.

2.UIElement(C#)　+　USS

특정 UI 형식에 스타일 추가
이 좋은 점은 다른 UI에서도 같은 스타일을 사용할 수 있다는 것이다.
제목 등에서 이 라벨을 사용할 수 있기 때문에 포장류로 만들면 그 라벨만 호출하면 그 스타일의 라벨을 호출할 수 있죠?
그러나 이런 것을 응용한 상황에서 응용되었지만 하위 요소에도 영향을 미친다
이 부분의 디자인 부분을 주의해야 할 것 같습니다.
3.UIElement(C#) + UXML
C# 측면에서 UI를 지정하지 않고 UMXL 측면에서 지정한 형식의 패턴
그래서 C# 측에서 UI에 들어갔는데 그때 준비한 UI는 이렇게 좋은 형식으로 바뀌었다.
이 좋은 곳, UI의 설정 전부, 이 파일, UI가 집약할 수 있는 일.C#에서 참고한 것만 알면
그걸 다 볼 수 있는 UI의 구성, 화면 관리도 쉽고 간단하니까.
다른 한편, 너무 많이 넣으면 사용하기 어려워서 이 부근의 분할은 어려울 것 같다

앞으로

현재 샘플에는 라벨만 존재하기 때문에 버튼 등 좀 더 상세한 것도 처리한다
나는 다음 보도에서 일의 시작을 기술하고 싶다.

참고 자료

유니티 공식 안내서
https://docs.unity3d.com/Manual/UIElements.html
인터넷 블로그
http://baba-s.hatenablog.com/entry/2017/12/27/100000