Unity で2Dお絵かきアプリを作る

こんにちは、たるこすです。
今回は Unity を使って2Dお絵かきアプリを作ります。

お絵かきアプリを作ることが最終目的ではないのですが、それについては別の投稿記事で話したいと思います。

まずは実装してみる

まずは、こちらのサイトを参考に実装してみます。
Unityでテクスチャにお絵描きしよう - おもちゃラボ

2D アプリケーションとしてUnityプロジェクトを作成
Plane を作成して画面に映るサイズに調整
黒色の画像をインポートし、以下のように設定
マテリアルを作成し、上のテクスチャを設定
以下のスクリプトを作成し、Plane に追加

using UnityEngine;
using System.Collections;
using System.IO;

public class PaintManager : MonoBehaviour
{
    Texture2D drawTexture;
    Color[] buffer;
    bool touching = false;
    Vector2 prevPoint;

    public NetworkManager networkManager;

    void Start()
    {
        Texture2D mainTexture = (Texture2D)GetComponent<Renderer>().material.mainTexture;
        Color[] pixels = mainTexture.GetPixels();

        buffer = new Color[pixels.Length];
        pixels.CopyTo(buffer, 0);

        drawTexture = new Texture2D(mainTexture.width, mainTexture.height, TextureFormat.RGBA32, false);
        drawTexture.filterMode = FilterMode.Point;
    }

    public void DrawLine(Vector2 p, Vector2 q)
    {
        var lerpNum = 10;
        for(int i=0; i < lerpNum + 1; i++)
        {
            var r = Vector2.Lerp(p, q, i * (1.0f / lerpNum));
            Draw(r);
        }
    }

    public void Draw(Vector2 p)
    {
        p.x = (int)p.x;
        p.y = (int)p.y;

        var brushSize = 10;
        var color = Color.white;
        for (int x = Mathf.Max(0, (int)(p.x - brushSize-1)); x < Mathf.Min(drawTexture.width, (int)(p.x + brushSize+1)); x++)
        {
            for (int y = Mathf.Max(0, (int)(p.y - brushSize-1)); y < Mathf.Min(drawTexture.height, (int)(p.y + brushSize+1)); y++)
            {
                if (Mathf.Pow(p.x - x,2) + Mathf.Pow(p.y -y, 2) < Mathf.Pow(brushSize, 2))
                {
                    buffer.SetValue(color, x + drawTexture.width * y);
                }
            }
        }
    }

    void Update()
    {
        if (Input.GetMouseButton(0))
        {
            Ray ray = Camera.main.ScreenPointToRay(Input.mousePosition);
            RaycastHit hit;
            if (Physics.Raycast(ray, out hit, 100.0f))
            {
                var drawPoint = new Vector2(hit.textureCoord.x * drawTexture.width, hit.textureCoord.y * drawTexture.height);
                if (touching) {
                    DrawLine(prevPoint, drawPoint);
                }
                else
                {
                    Draw(drawPoint);
                }
                prevPoint = drawPoint;
                touching = true;
            }else
            {
                touching = false;
            }
            drawTexture.SetPixels(buffer);
            drawTexture.Apply();
            GetComponent<Renderer>().material.mainTexture = drawTexture;
        }else
        {
            touching = false;
        }
    }
}