カードの表裏に別々の画像を表示

2021年08月30日

オブジェクトに別々の画像を表示させることはできません。

クアッドを用いて別々のオブジェクトを作成し、これを合体させて、カードのようなオブジェクトを作成してみましょう。

クリックするたびに、カードを180°回転させています。

クアッドの作成

3Dオブジェクトから、クアッドを作成します。

XとYの方向に、サイズを拡げました。

新しくImageフォルダを作成し、ここに2種類の画像をインポートします。

右クリック > 新しいアセットをインポート

色違いのjpgファイルを2種類インポートしました。

Quadを複製し、名前をQuad2に変更。

Yを180°回転させました。

2つのQuadに、それぞれ別々の画像をドラッグ＆ドロップします。

カードを回転させる

Quadを回転させて動きをつけてみましょう。

まずは、2つのQuadをグループ化します。

空のオブジェクトを作成します。

GameObjectをCardという名前に変え、座標を0にします。

Cardの中に、Quad1とQuad2をドラッグ＆ドロップして、親子関係をつくります。

CardRotate.csを作成し、Cardに追加します。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class CardRotate : MonoBehaviour
{
    void Update()
    {
        if (Input.GetMouseButtonDown(0))
            StartCoroutine("RotateStart");
    }

    IEnumerator RotateStart()
    {
        for (int turn=0; turn<180; turn++)
        {
            transform.Rotate(0,1,0);
            yield return new WaitForSeconds(0.01f);
        }
    }
}

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

public class CardRotate : MonoBehaviour

{

void Update()

{

if (Input.GetMouseButtonDown(0))

StartCoroutine("RotateStart");

}

IEnumerator RotateStart()

{

for (int turn=0; turn<180; turn++)

{

transform.Rotate(0,1,0);

yield return new WaitForSeconds(0.01f);

}

ゲームプレイして、カードをクリックしてみましょう。

クリックするたびに、裏表がひっくり返り、別々の画像が表示されています。

< 前の記事次の記事 >

カードの表裏に別々の画像を表示

クアッドの作成

カードを回転させる

SCHOOL教室案内

枚方くずは校

神戸芦屋校

京都南教室

カードの表裏に別々の画像を表示

クアッドの作成

カードを回転させる

関連記事

SCHOOL教室案内

枚方くずは校

神戸芦屋校

京都南教室