Unity Editor Window에서 썸네일이 있는 버튼을 타일로 정렬

8042 단어 Unity

컨디션


Unity 2018.1.0f2

개시하다


여러 디자이너를 위한 UnityEditor 도구를 제작할 수 있는 기회가 있습니다.
기능의 일부는 캐릭터의 자세를 전환해야 하는데, 자세를 문언화해도 공통적으로 인식하기 어려워요...따라서 축소판으로 표시하기로 결정했습니다.
또 자세의 수가 많아 앞으로도 추가될 것으로 예상되는 만큼 일람표를 타일 모양으로 배열해 확인하는 게 좋을 것으로 본다.
설치할 때 아래의 내용을 모르기 때문에 먼저 잘라서 정리한다.
버튼에 미리 보기 그림을 어떻게 표시합니까?
• 어떻게 버튼을 타일로 배열합니까?

선취합



▽github - unityEditorTileArrangement
https://github.com/panti310/unityEditorTileArrangement
자유롭게 만져주세요!

해설


창 생성 및 배치 정보


저는 원래 편집기 윈도 만드는 법을 몰라서 아래 내용을 참고했습니다.
▲ keshi wear - [편집기 확장 철저한 해설] 초급편 ①: 창을 직접 만들어 보세요 [Unity]
https://caitsithware.com/wordpress/archives/1377
윈도 제작부터 Layout까지 모두 세밀한 해설이 있다.

버튼에 축소판 그림 붙이기


미리 보기 그림 불러오기


축소판 그림 이미지는 Assets/Editor Default Resources, Editor GUIUtility로 구성됩니다.Load를 사용하여 읽습니다.
▲ 확장 시작 편집 - 1장 확장에 사용되는 폴더 편집
https://anchan828.github.io/editor-manual/web/part2-beginner.html#h1-2
Editor에서 사용하는 리소스를 참조했습니다.
모든 프레임이 읽히지 않도록 초기화할 때 캐시를 하는 것이 좋습니다.
    void Preload ()
    {
        m_default_tex = EditorGUIUtility.Load (Default_Icon_Path) as Texture2D;
        SetTexCacheDict (Sample_Icon_Root_Path, Sample_Icon_Extension, Button_Num);
    }

버튼에 붙이다


GUILayout.Buton에 위의 Texture를 설정하면 OK입니다.
▽Unity - GUILayout.Button
https://docs.unity3d.com/ja/current/ScriptReference/GUILayout.Button.html

타일에 따라 배열하다


일단 가로로 이렇게.

EditorGUILayout.BeginHorizontal ();
// この間に記載した要素が横に並ぶ
EditorGUILayout.EndHorizontal ();

이어서 수직으로 배열하다

EditorGUILayout.BeginVertical ();
// この間に記載した要素が縦に並ぶ
EditorGUILayout.EndVertical ();

창 너비에서 가로 요소 수 계산하기


window 너비를 초과하지 않는 몇 분 단추를 그렸고, Editor GUIlayout의 Horizontal로 이 단추를 둘러싸는 처리를 만들었습니다.

이하 발췌 처리.
    void DrawThumbnailButtons (int itemNum, System.Action<int> onClick, string rootPath, string extension)
    {
        // 横の要素数求める
        float windowWidth = position.width;
        int horizontalMaxNumber = Mathf.FloorToInt (windowWidth / (m_buttonSize + Button_Margin));

        bool inHorizontalLayout = false;
        for (int i = 0; i < itemNum; i++) {
            if (i % horizontalMaxNumber == 0) {
                // 横レイアウト開始
                EditorGUILayout.BeginHorizontal ();
                inHorizontalLayout = true;
            }

            // ボタン作る処理とか

            if (i % horizontalMaxNumber == horizontalMaxNumber - 1) {
                // 横レイアウト終了
                EditorGUILayout.EndHorizontal ();
                inHorizontalLayout = false;
            }
        }

        if (inHorizontalLayout) {
            // horizontalMaxNumber ちょうどの数以外だと横レイアウト開きっぱなしになる
            // その際はここで横レイアウト終了
            EditorGUILayout.EndHorizontal ();
        }
    }

최후


말로 표현하기 어려운 것을 대량으로 버튼화할 때는 반드시 사용하세요.
타일판식처럼 묵인하면 돼...
▲ 아이콘 소재 - FLAT ICON DESIGN
http://flat-icon-design.com/
샘플에 맞는 아이콘이 많습니다.

좋은 웹페이지 즐겨찾기