回答編集履歴

Painterのコードを省略なしで追記

2020/01/15 17:05

投稿

Bongo

スコア10807

test CHANGED Viewed

@@ -181,3 +181,559 @@
 すみませんがすぐに試せるモバイル環境を持っていないため、実機上だとどうなるか未確認です。意図と異なる動きをするようでしたら、異常の様子を詳しくコメントいただければ可能であれば直してみようと思います。
+**追記**
+「[UNITY LineRendererで線を描く事はできるのですが,canvasの下のimageに描く事は出来ないでしょうか?](https://teratail.com/questions/232888)」の時の`Painter`と折衷させたバージョン
+```C#
+using System;
+using System.Collections.Generic;
+using UnityEngine;
+using UnityEngine.EventSystems;
+using UnityEngine.SceneManagement;
+using UnityEngine.UI;
+/// <summary>
+///		お絵描き
+/// </summary>
+[RequireComponent(typeof(RectTransform), typeof(Image))]
+public class Painter : MonoBehaviour, IPointerDownHandler, IPointerUpHandler
+{
+	// ペンの半径...0で1ピクセルの線になる
+	[Range(0, 5)] public int penRadius;
+	// 前景色（ペンの色）
+	public Color foregroundColor = Color.red;
+	// 背景色
+	// ただし、現状は以前のご質問で製作した「元々セットされているテクスチャを下絵にする」
+	// という方式になっているため、この背景色はスクリプト中で使用されていない
+	[SerializeField] private Color backgroundColor = Color.white;
+	private RectTransform rectTransform;
+	private Image image;
+	private Texture2D texture;
+	private Vector2Int textureSize;
+	private Vector2Int previousPixelPosition;
+	private Vector2Int cachedPixelPosition;
+	// 線引き中であることを示すフラグ
+	private bool isPainting;
+	private readonly Stack<Texture2D> undoStack = new Stack<Texture2D>();
+	private readonly Stack<Texture2D> redoStack = new Stack<Texture2D>();
+	public bool CanUndo => this.undoStack.Count > 0;
+	public bool CanRedo => this.redoStack.Count > 0;
+	// タイトルシーンに移動するメソッド
+	// ボタンのインスペクターの「On Click ()」でこのメソッドを実行するよう設定しておく
+	// 個人的な好みでは、「タイトルシーンに移動する」という機能は「Image上にお絵かきする」という機能と
+	// 直接的な関係があるようには感じられないので、別のスクリプトに役割分担させた方がいい気もしますが...
+	public void OnButtonClick()
+	{
+		SceneManager.LoadScene("Title");
+	}
+	public void OnPointerDown(PointerEventData eventData)
+	{
+		this.isPainting = true;
+	}
+	public void OnPointerUp(PointerEventData eventData)
+	{
+		this.isPainting = false;
+	}
+	public void Undo()
+	{
+		if (!this.CanUndo)
+		{
+			return;
+		}
+		var previousTexture = this.texture;
+		var poppedTexture = this.undoStack.Pop();
+		this.texture = poppedTexture;
+		this.redoStack.Push(previousTexture);
+		this.UpdateSprite();
+		Debug.Log($"Undo! UndoStack : {this.undoStack.Count} RedoStack : {this.redoStack.Count}");
+	}
+	public void Redo()
+	{
+		if (!this.CanRedo)
+		{
+			return;
+		}
+		var previousTexture = this.texture;
+		var poppedTexture = this.redoStack.Pop();
+		this.texture = poppedTexture;
+		this.undoStack.Push(previousTexture);
+		this.UpdateSprite();
+		Debug.Log($"Redo! UndoStack : {this.undoStack.Count} RedoStack : {this.redoStack.Count}");
+	}
+	private void Record()
+	{
+		this.undoStack.Push(Instantiate(this.texture));
+		foreach (var textureInRedoStack in this.redoStack)
+		{
+			Destroy(textureInRedoStack);
+		}
+		this.redoStack.Clear();
+		Debug.Log($"Record! UndoStack : {this.undoStack.Count} RedoStack : {this.redoStack.Count}");
+	}
+	private void UpdateSprite()
+	{
+		var previousSprite = this.image.sprite;
+		this.image.sprite = Sprite.Create(
+			this.texture,
+			new Rect(0, 0, this.texture.width, this.texture.height),
+			Vector2.zero);
+		Destroy(previousSprite);
+	}
+	private Vector2Int GetPixelPosition()
+	{
+		if (!RectTransformUtility.ScreenPointToLocalPointInRectangle(
+			this.rectTransform,
+			Input.mousePosition,
+			null,
+			out var pixelPositionFloat))
+		{
+			return this.cachedPixelPosition;
+		}
+		var sizeDelta = this.rectTransform.sizeDelta;
+		pixelPositionFloat += sizeDelta * this.rectTransform.pivot;
+		var pixelPosition = new Vector2Int(
+			Mathf.Clamp((int)pixelPositionFloat.x, 0, this.textureSize.x - 1),
+			Mathf.Clamp((int)pixelPositionFloat.y, 0, this.textureSize.y - 1));
+		Debug.Log($"Pixel Position: {pixelPosition}");
+		this.cachedPixelPosition = pixelPosition;
+		return this.cachedPixelPosition;
+	}
+	private bool PositionIsWithinTexture(Vector2Int position)
+	{
+		return (position.x >= 0) && (position.y >= 0) &&
+			   (position.x < this.textureSize.x) && (position.y < this.textureSize.y);
+	}
+	private void PaintAt(Vector2Int position, Color32 color, int radius)
+	{
+		var sqrRadius = radius * radius;
+		for (var i = -radius; i <= radius; i++)
+		{
+			for (var j = -radius; j <= radius; j++)
+			{
+				var p = new Vector2Int(position.x + i, position.y + j);
+				var dot = (i * i) + (j * j);
+				if ((dot <= sqrRadius) && this.PositionIsWithinTexture(p))
+				{
+					this.texture.SetPixel(p.x, p.y, color);
+				}
+			}
+		}
+		this.texture.Apply();
+	}
+	private void LineTo(Vector2Int from, Vector2Int to, Color32 color, int radius)
+	{
+		var penPosition = from;
+		var x = (float)penPosition.x;
+		var y = (float)penPosition.y;
+		var fromTo = to - from;
+		var fromToSign = new Vector2Int((int)Mathf.Sign(fromTo.x), (int)Mathf.Sign(fromTo.y));
+		var fromToXIsZero = fromToSign.x == 0;
+		var fromToYIsZero = fromToSign.y == 0;
+		fromToSign.x = fromToXIsZero ? 1 : fromToSign.x;
+		fromToSign.y = fromToYIsZero ? 1 : fromToSign.y;
+		var absFromTo = fromToSign * fromTo;
+		var dominantDirection = 0;
+		var delta = Vector2.zero;
+		if (absFromTo.x >= absFromTo.y)
+		{
+			var tangent = fromToXIsZero ? 0 : (float)fromTo.y / fromTo.x;
+			delta.x = fromToSign.x;
+			delta.y = tangent * delta.x;
+		}
+		else
+		{
+			var tangent = fromToYIsZero ? 0 : (float)fromTo.x / fromTo.y;
+			delta.y = fromToSign.y;
+			delta.x = tangent * delta.y;
+			dominantDirection = 1;
+		}
+		while (this.PositionIsWithinTexture(penPosition))
+		{
+			try
+			{
+				this.PaintAt(penPosition, color, radius);
+				x += delta.x;
+				y += delta.y;
+				penPosition.x = (int)x;
+				penPosition.y = (int)y;
+				if (fromToSign[dominantDirection] > 0)
+				{
+					if (penPosition[dominantDirection] >= to[dominantDirection])
+					{
+						break;
+					}
+				}
+				else
+				{
+					if (penPosition[dominantDirection] <= to[dominantDirection])
+					{
+						break;
+					}
+				}
+			}
+			catch (Exception e)
+			{
+				Debug.LogException(e);
+				break;
+			}
+		}
+	}
+	private void Start()
+	{
+		this.rectTransform = this.transform as RectTransform;
+		this.image = this.GetComponent<Image>();
+		var sizeDelta = this.rectTransform.sizeDelta;
+		var width = (int)sizeDelta.x;
+		var height = (int)sizeDelta.y;
+		var backgroundPixels = (this.image.mainTexture as Texture2D).GetPixels32();
+		this.image.sprite = null;
+		this.texture = new Texture2D(width, height, TextureFormat.ARGB32, false) {filterMode = FilterMode.Bilinear};
+		this.texture.SetPixels32(backgroundPixels);
+		this.texture.Apply();
+		this.textureSize = new Vector2Int(width, height);
+		this.UpdateSprite();
+	}
+	private void Update()
+	{
+		if (Input.GetKeyDown(KeyCode.U))
+		{
+			this.Undo();
+		}
+		if (Input.GetKeyDown(KeyCode.R))
+		{
+			this.Redo();
+		}
+		// 線引き中かどうかに関係なく動作させたいコードはここよりも上に記述する
+		if (!this.isPainting)
+		{
+			// 線引き中に動作されると困るコードがあればこの辺に記述する
+			return;
+		}
+		// 線引き中のみ動作させたいコードはここよりも下に記述する
+		if (Input.GetMouseButtonDown(0))
+		{
+			this.Record();
+			this.previousPixelPosition = this.GetPixelPosition();
+		}
+		else if (Input.GetMouseButton(0))
+		{
+			var currentPixelPosition = this.GetPixelPosition();
+			this.LineTo(this.previousPixelPosition, currentPixelPosition, this.foregroundColor, this.penRadius);
+			this.previousPixelPosition = currentPixelPosition;
+		}
+		// 右クリックによるUndo
+		if (Input.GetMouseButtonDown(1))
+		{
+			this.Undo();
+		}
+	}
+}
+```