Web Analytics

こつこつエンジニア

現役アプリ開発者によるIT系特化ブログ

UnityでC#スクリプトファイルから平行四辺形/台形/五角形/星を描画してみよう!【コード解説あり】

f:id:madai21:20210720210353j:plain

はじめに

前回はスクリプトファイルから四角形を描画しました。
madai21.hatenablog.com
スクリプトファイルのコードについてはさらっと流したので、コードからどのように四角形を描画しているのか見ていきます。
その上でさらに今回はもっと色々な図形をスクリプトファイルから描画してみたいと思います。

スクリプトからの描画について

ポリゴンメッシュ(meshクラス)を動的に作成しMeshFilterクラスに設定、および、MeshRendererクラスにマテリアルの情報を設定してあげることで青色の四角形を描画させています。
ですのでどんな図形を描画するかの肝となるのはmeshクラスです。
meshクラスは頂点の位置(vertices)三角形を構成する頂点の位置インデックス(triangles)を設定し法線を再計算(RecalculateNormals)してあげることでメッシュ情報を生成してくれます。

改めて四角形を描画するスクリプトのコードを確認

赤枠の所が先ほどのmeshクラスで設定している部分となります。
f:id:madai21:20210726231653p:plain
描画させた四角形を見てみましょう。
meshクラスに①の三角形②の三角形、および、それらを構成する頂点座標を設定してあげているだけです。
※0の点がverts[0]、1の点がverts[1]、2の点がverts[2]、3の点がverts[3]に該当します。
f:id:madai21:20210726231936p:plain
①の三角形を設定しているのは以下の赤枠部分です。
f:id:madai21:20210726232414p:plain
②の三角形を設定しているのは以下の赤枠部分です。
f:id:madai21:20210726232443p:plain
仕組みがわかれば簡単ですね^^

もっといろんな図形を描画してみる

では他の図形も三角形を構成して描画してみましょう^^
※CreateMesh.csをそれぞれのコードに差し替えることで描画できます。

平行四辺形

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
 
public class CreateMesh : MonoBehaviour
{
    public Material material;
 
    // Start is called before the first frame update
    void Start()
    {
        MeshFilter mf = GetComponent<MeshFilter>();
        MeshRenderer mr = GetComponent<MeshRenderer>();
 
        Vector3[] verts = new Vector3[4];
        int[] trinangles = { 0, 1, 3, 1, 2, 3 };
 
        verts[0] = new Vector3(-10, 5, 5);
        verts[1] = new Vector3(5, 5, 5);
        verts[2] = new Vector3(10, -5, 5);
        verts[3] = new Vector3(-5, -5, 5);
 
        Mesh mesh = new Mesh();
        mesh.vertices = verts;
        mesh.triangles = trinangles;
        mesh.RecalculateNormals();
 
        mf.sharedMesh = mesh;
        mr.sharedMaterial = material;
    }
}

以下のように描画させています。
f:id:madai21:20210726233357p:plain

台形

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
 
public class CreateMesh : MonoBehaviour
{
    public Material material;
 
    // Start is called before the first frame update
    void Start()
    {
        MeshFilter mf = GetComponent<MeshFilter>();
        MeshRenderer mr = GetComponent<MeshRenderer>();
 
        Vector3[] verts = new Vector3[4];
        int[] trinangles = { 0, 1, 3, 1, 2, 3 };
 
        verts[0] = new Vector3(-5, 5, 5);
        verts[1] = new Vector3(5, 5, 5);
        verts[2] = new Vector3(10, -5, 5);
        verts[3] = new Vector3(-10, -5, 5);
 
        Mesh mesh = new Mesh();
        mesh.vertices = verts;
        mesh.triangles = trinangles;
        mesh.RecalculateNormals();
 
        mf.sharedMesh = mesh;
        mr.sharedMaterial = material;
    }
}

以下のように描画させています。
f:id:madai21:20210726233455p:plain

五角形

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
 
public class CreateMesh : MonoBehaviour
{
    public Material material;
 
    // Start is called before the first frame update
    void Start()
    {
        MeshFilter mf = GetComponent<MeshFilter>();
        MeshRenderer mr = GetComponent<MeshRenderer>();
 
        Vector3[] verts = new Vector3[5];
        int[] trinangles = { 0, 1, 4, 1, 3, 4, 1, 2, 3 };
 
        verts[0] = new Vector3(-7, 3, 5);
        verts[1] = new Vector3(0, 7, 5);
        verts[2] = new Vector3(7, 3, 5);
        verts[3] = new Vector3(5, -5, 5);
        verts[4] = new Vector3(-5, -5, 5);
 
        Mesh mesh = new Mesh();
        mesh.vertices = verts;
        mesh.triangles = trinangles;
        mesh.RecalculateNormals();
 
        mf.sharedMesh = mesh;
        mr.sharedMaterial = material;
    }
}

以下のように描画させています。
f:id:madai21:20210726233549p:plain

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
 
public class CreateMesh : MonoBehaviour
{
    public Material material;
 
    // Start is called before the first frame update
    void Start()
    {
        MeshFilter mf = GetComponent<MeshFilter>();
        MeshRenderer mr = GetComponent<MeshRenderer>();
 
        Vector3[] verts = new Vector3[10];
        int[] trinangles = { 0, 1, 9, 1, 2, 3, 3, 4, 5, 5, 6, 7, 7, 8, 9, 1, 3, 9, 3, 7, 9, 3, 5, 7 };
 
        verts[0] = new Vector3(-8, 2, 5);
        verts[1] = new Vector3(-2, 2, 5);
        verts[2] = new Vector3(0, 7, 5);
        verts[3] = new Vector3(2, 2, 5);
        verts[4] = new Vector3(8, 2, 5);
        verts[5] = new Vector3(3, -1, 5);
        verts[6] = new Vector3(5, -7, 5);
        verts[7] = new Vector3(0, -3, 5);
        verts[8] = new Vector3(-5, -7, 5);
        verts[9] = new Vector3(-3, -1, 5);
 
        Mesh mesh = new Mesh();
        mesh.vertices = verts;
        mesh.triangles = trinangles;
        mesh.RecalculateNormals();
 
        mf.sharedMesh = mesh;
        mr.sharedMaterial = material;
    }
}

以下のように描画させています。
f:id:madai21:20210726233644p:plain
星だけ黄色に変えましたw
Create Mesh(Material)のAlbedoをR 255 G 255 B 0にするだけです。

おわりに

平面だけしか描画していませんが、もちろん立体の図形やモデルなどの描画も可能です。
メッシュを扱えることでいろいろ可能性が広がりそうですね^^