기사의 버전: Unity 5.5.0f3(win64)

카탈로그

개요

성과물

사용 방법 및 설명

공을 들인 곳

마지막

1. 개요

이 보도를 목표로 하는 독자

유니티로 도트 게임을 만든 사람

Unity에 객체를 배치할 때 테이퍼가 좋은 위치에 배치하려는 사람

타일 편집기를 사용하기 어려운 사람

안개가 잘 낀 곳에 상대를 두는 게 귀찮은 유닛.
특히 점화 게임을 만들 때 디지털 픽셀의 편차가 세계관을 파괴할 수 있다.
그럼에도 불구하고 대상을 대량으로 배치할 때 한 명씩 대상을 클릭해 Transform을 가지고 노는 것은 힘들다.
그래서 이번에는 드래그 동작으로만 대상을 예쁘게 설정할 수 있는 편집기 확장을 했습니다.

참조

이번 내용은 이쪽의 아주 좋은 보도를 크게 참고하였다.
아니면 여기 기사 내용을 살짝 수정해서...
http://qiita.com/r-ngtm/items/bc0843e2f8a7c610353a

2.성과물

여기서 다운로드하면 바로 사용할 수 있다.
https://github.com/john95206/GridDrawer

3. 사용 방법 및 코드

사용법

프로젝트에서 "Editor"라는 폴더를 만들고 준비된 코드를 배치합니다.편집기에서 확장한 코드는 모두 이 폴더에 넣어야 합니다.

UnityEditor의 탭에서 GridWindow 탭을 선택하여 창 표시

창에서 원하는 시작 위치와 영역을 확인하고 확인란에 선택

3. 원하는 객체 드래그

코드

기본적으로 모두 원래 보도된 대로 다른 것은 그리 대단한 것이 아니다.
Scene 뷰에서 메쉬의 스크립트를 그려 Editor 폴더에 넣습니다.
DrawGrid.cs

using UnityEngine;
using UnityEditor;
using System.Collections;

/// <summary>
/// UnityEditorでグリッドを描画しオブジェクトをスナップさせるクラス
/// </summary>
[CustomEditor(typeof(Transform))]
public class DrawGrid : Editor {

    // グリッドの間隔
    public const float gridDistance = 0.1f;

    void OnSceneGUI()
    {
        // グリッドを非表示にする場合は処理を止める
        if (!GridEditWindow.isGridEnabled)
        {
            return;
        }

        // グリッドの色。
        Color color;

        // グリッド描画の開始地点をGridEditWindowから参照
        Vector3 originPos = GridEditWindow.originPos;

        // グリッドの本数　＝　面積÷間隔
        float numX = GridEditWindow.gridAreaX / gridDistance;
        float numY = GridEditWindow.gridAreaY / gridDistance;

        // 縦線を描画。開始位置から1本ずつ右に描画していく。
        for(int x = 0; x <= numX; x++)
        {
            // 線の開始位置を計算。
            Vector3 pos = originPos + Vector3.right * x * gridDistance;

            // 5の倍数は白にして目立たせる
            if (x % 5 == 0)
            {
                // 0.7をかけて色を落ち着かせる
                color = Color.white * 0.7f;
            }
            // それ以外は水色
            else
            {
                color = Color.cyan * 0.7f;
            }

            // 線を描画
            Debug.DrawLine(pos, pos + Vector3.up * GridEditWindow.gridAreaY, color);
        }

        // 横線を描画。開始位置から1本ずつ上に描画していく。
        for (int y = 0; y <= numY; y++)
        {
            Vector3 pos = originPos + Vector3.up * y * gridDistance;

            if (y % 5 == 0)
            {
                color = Color.white * 0.7f;
            }
            else
            {
                color = Color.cyan * 0.7f;
            }

            Debug.DrawLine(pos, pos + Vector3.right * GridEditWindow.gridAreaX, color);
        }

        // グリッドにぴったりと合わせるオブジェクトのトランスフォームを取得
        Transform objectTransform = target as Transform;

        // オブジェクトをスナップさせる処理
        Vector3 objectPosition = objectTransform.transform.position;
        objectPosition.x = Mathf.Floor(objectPosition.x / gridDistance) * gridDistance;
        objectPosition.y = Mathf.Floor(objectPosition.y / gridDistance) * gridDistance;
        objectTransform.transform.position = objectPosition;

        // 再描画
        EditorUtility.SetDirty(target);
    }

    private void OnDisable()
    {
        // 再描画
        EditorUtility.SetDirty(target);
    }
}

이렇게 하면 Scene 뷰에 메쉬를 그릴 수 있습니다.
이렇게 해도 이 반에서 초기 위치 등 파라미터를 정의해서 사용할 수 있지만 하나하나 다시 써서 조정해야 하기 때문에 좀 불편하다.
그리드 매개 변수를 관리하는 창을 만듭니다.
이것도 EDITOr 폴더에 저장됩니다.
GridEditWindow.cs

using UnityEngine;
using UnityEditor;
using System.Collections;

/// <summary>
/// グリッドのパラメータを制御するウィンドウ
/// </summary>
[CustomEditor(typeof(Transform))]
public class GridEditWindow : EditorWindow
{
    // NOTE: 
    // 各変数はDrawGrid.csで参照するためstaticにする
    // グリッドを表示するかどうか
    public static bool isGridEnabled = false;
    // グリッドの開始地点
    public static Vector2 originPos = Vector2.zero;
    // グリッドの面積の横の長さ
    public static int gridAreaX = 0;
    // グリッドの面積の縦の長さ
    public static int gridAreaY = 0;

    // エディタの上のメニュータブからウィンドウを呼び出せるようにする
    [MenuItem("GridEditorWindow/GridEditor")]
    static void Open()
    {
        EditorWindow.GetWindow<GridEditWindow>("GridEditor");
    }

    private void OnGUI()
    {
        // グリッドの開始地点を編集できるようにする
        originPos = EditorGUILayout.Vector2Field("Position", originPos);
        // グリッドの横の長さを編集できるようにする
        gridAreaX = EditorGUILayout.IntField("描画するX座標の範囲", gridAreaX);
        // グリッドの縦の長さを編集できるようにする
        gridAreaY = EditorGUILayout.IntField("描画するY座標の範囲", gridAreaY);

        // 間をあける
        EditorGUILayout.Space();
        EditorGUILayout.Space();
        EditorGUILayout.Space();

        // グリッドを描画するかどうかをチェックボックスで変更できるようにする
        isGridEnabled = EditorGUILayout.Toggle("Grid描画", isGridEnabled);
    }
}

그게 다야.
gridDistance도 GrideditWindow입니다.cs로 관리하면 선의 간격도 자유롭게 변경할 수 있습니다.

4. 신경 쓰는 곳

창이 연결되었습니다.

참고로 글에서 격자의 범위와 중심 지점을 바꾸려면 반드시 스크립트를 편집해야 하기 때문에 디자이너의 배치가 좀 어렵다.
따라서 이번에는 이 매개 변수를 관리하는 창을 다시 만들어 편집기에서만 편집을 끝냈다.

면적을 자유롭게 바꿀 수 있게 하다

범위가 너무 넓으면 전체가 잘 보이지 않기 때문에 격자를 설치하고 싶은 곳을 자유롭게 결정할 수 있다.

5. 끝말

유니티 2D가 조금씩 알차게 채워지고 있지만, 아직 편집이 2D 게임을 만드는 데 편하다고 할 수는 없다.
대부분의 경우 외부 도구를 사용하는 지도 편집기이지만, 지도 칩을 사용하지 않는 점게임 개발에서는 사용하기 어려워 언티 편집기에서만 배치할 수 있다.
원래 보도된 선생을 만나 길이 마침내 열렸다.앞에서 말한 바와 같이 특정 대상에만 적용되는 격자 조작도 가능하며 이 확장은 맞춤형 가치가 있다고 생각합니다.
나는 이 보도가 나처럼 약간의 고민을 가진 게임 개발자들의 힘이 되기를 바란다.