UIをまとめたパネルのフェードでの表示について

前提・実現したいこと

Unity初心者です。
ゲームのタイトル画面でこちら
https://xr-hub.com/archives/11782
とこちら
https://go.shr.lc/2MgXVQ5
を参考にパネルにUIをまとめ、そのパネルをフェードで表示、非表示にするスクリプトを書きました。
Playしてみると、たとえば１回目にLoadGameボタンを押すとちゃんとLoadGameパネルがフェードで出てきてくれるのですが
出てきたLoadGameパネルにあるBackボタンを押してもう一度LoadGameボタンを押すとフェードせずにパッとパネルが表示されてしまいます。
LoadGameボタンを押すたびにきちんとフェードでパネルを表示したいのですが、やり方がわかりません。
どのようにスクリプトを記述すればよろしいでしょうか。
回答よろしくお願い申し上げます。

該当のソースコード

C#
1using System.Collections;
2using System.Collections.Generic;
3using UnityEngine;
4using UnityEngine.UI; //パネルのイメージを操作するのに必要
5using UnityEngine.SceneManagement;
6
7public class TitleSceneManager : MonoBehaviour
8{
9    //4つのPanelを格納する変数
10    //インスペクターウィンドウからゲームオブジェクトを設定する
11    [SerializeField] GameObject titleMenuPanel;   //TitleMenuパネル
12    [SerializeField] GameObject loadGamePanel;   //LoadGameパネル
13    [SerializeField] GameObject settingPanel;    //Settingパネル
14    [SerializeField] GameObject aboutPanel;      //Aboutパネル
15
16    FadeManager fadeLoad;   //LoadGameパネルをフェードで出現させるためのオブジェクト
17    FadeManager fadeSetting;//Settingパネル用
18    FadeManager fadeAbout;  //Aboutパネル用
19
20
21
22
23
24    // Start is called before the first frame update
25    void Start()
26    {
27
28        fadeLoad = GameObject.Find("Panel_LoadGame").GetComponent<FadeManager>();  
29        fadeSetting = GameObject.Find("Panel_Setting").GetComponent<FadeManager>();
30        fadeAbout= GameObject.Find("Panel_About").GetComponent<FadeManager>();
31       
32
33        //BackToMenuメソッドを呼び出す
34        BackToMenu();
35
36    }
37
38    // Update is called once per frame
39    void Update()
40    {
41       
42
43    }
44
45    //TitleMenuパネルでLoadGameボタンが押されたときの処理
46    public void SelectLoadGameDescription()
47    {
48        titleMenuPanel.SetActive(false);
49        loadGamePanel.SetActive(true);
50
51        fadeLoad.isFadeOutHalf = true; //フェードで半透明のパネルを出現させるフラグ
52
53
54    }
55
56
57    //TitleMenuパネルでSettingボタンが押されたときの処理
58    public void SelectSettingDescription()
59    {
60        titleMenuPanel.SetActive(false);
61        settingPanel.SetActive(true);
62
63        fadeSetting.isFadeOutHalf = true; //フェードで半透明のパネルを出現させるフラグ
64    }
65
66    //TitleMenuパネルでAboutボタンが押されたときの処理
67    public void SelectAboutDescription()
68    {
69        titleMenuPanel.SetActive(false);
70        aboutPanel.SetActive(true);
71
72        fadeAbout.isFadeOutHalf = true; //フェードで半透明のパネルを出現させるフラグ
73    }
74
75
76    //TitleMenuパネル以外の３つのパネルでBackボタンが押されたときの処理
77    public void BackToMenu()
78    {
79        titleMenuPanel.SetActive(true);
80        loadGamePanel.SetActive(false);
81        settingPanel.SetActive(false);
82        aboutPanel.SetActive(false);
83    }
84}

C#
1using System.Collections;
2using System.Collections.Generic;
3using UnityEngine;
4using UnityEngine.UI; //パネルのイメージを操作するのに必要
5using UnityEngine.SceneManagement;
6
7public class FadeManager : MonoBehaviour
8{
9	float fadeSpeed = 0.005f;        //透明度が変わるスピードを管理
10	float red, green, blue, alfa;   //パネルの色、不透明度を管理
11
12	public bool isFadeOut = false;  //フェードアウト処理の開始、完了を管理するフラグ
13	public bool isFadeIn = false;   //フェードイン処理の開始、完了を管理するフラグ
14
15	public bool isFadeOutHalf = false;  //半分フェードアウト処理の開始、完了を管理するフラグ
16
17
18	private float stepTime;    // 経過時間カウント用
19
20	public string sceneName = null; //シーンの名前
21
22	
23
24
25	Image fadeImage;                //透明度を変更するパネルのイメージ
26
27	void Start()
28	{
29		fadeImage = GetComponent<Image>();
30		red = fadeImage.color.r;
31		green = fadeImage.color.g;
32		blue = fadeImage.color.b;
33		alfa = fadeImage.color.a;
34
35		stepTime = 0.0f;       // 経過時間初期化
36
37		sceneName = SceneManager.GetActiveScene().name; 
38
39	}
40
41	void Update()
42	{
43
44		if (isFadeIn)
45		{
46			StartFadeIn();
47		}
48
49
50
51		
52
53
54		if (sceneName == "CasLogoScene"|| sceneName == "AttentionScene"|| sceneName == "WarningScene")
55		{
56			// 経過時間をカウント
57			stepTime += Time.deltaTime;
58
59			SetIsFadeOut();
60
61			if (isFadeOut)
62			{
63				StartFadeOut();
64
65				if (isFadeOut == false)
66				{
67					ChangeSceneName();
68
69					SceneManager.LoadScene(sceneName);
70				}
71			}
72		}
73
74
75		if (isFadeOutHalf)
76		{
77			StartFadeOutHalf();
78			
79		}
80
81		if (isFadeOut)
82		{
83			StartFadeOut();
84		}
85
86
87	}
88
89	void StartFadeIn()
90	{
91		alfa -= fadeSpeed;                //a)不透明度を徐々に下げる
92		SetAlpha();                      //b)変更した不透明度パネルに反映する
93		if (alfa <= 0)
94		{                               //c)完全に透明になったら処理を抜ける
95			isFadeIn = false;
96			fadeImage.enabled = false;    //d)パネルの表示をオフにする
97		}
98	}
99
100	public void StartFadeOut()
101	{
102		fadeImage.enabled = true;  // a)パネルの表示をオンにする
103		alfa += fadeSpeed;         // b)不透明度を徐々にあげる
104		SetAlpha();               // c)変更した透明度をパネルに反映する
105		if (alfa >= 1)
106		{             // d)完全に不透明になったら処理を抜ける
107			isFadeOut = false;
108		}
109	}
110
111	public void StartFadeOutHalf()
112	{
113		
114		fadeImage.enabled = true;  // a)パネルの表示をオンにする
115		alfa += fadeSpeed;         // b)不透明度を徐々にあげる
116		SetAlpha();               // c)変更した透明度をパネルに反映する
117		if (alfa >= 0.5f)
118		{             // d)半分不透明になったら処理を抜ける
119			isFadeOutHalf = false;
120
121			Debug.Log("fade");
122
123		}
124	}
125
126	void SetAlpha()
127	{
128		fadeImage.color = new Color(red, green, blue, alfa);
129	}
130
131
132	void SetIsFadeOut()
133	{
134
135		if (Input.GetMouseButtonDown(0) || Input.GetKeyDown("return") || stepTime >= 10.0f) //10秒経つか左クリックかエンターキー押下で変数isFadeOutをtrueにする
136		{
137			isFadeOut = true;
138		}
139		
140
141	}
142
143	void ChangeSceneName()
144	{
145		switch (sceneName)
146		{
147			case "CasLogoScene":
148				sceneName = "AttentionScene";
149				break;
150
151			case "AttentionScene":
152				sceneName = "WarningScene";
153				break;
154
155			case "WarningScene":
156				sceneName = "TitleScene";
157				break;
158
159		}
160	}
161
162
163
164
165}
166

行動規範の内容に同意します

回答1件

ベストアンサー

スクリプトを見る範囲ではフェードイン処理が呼び出されていないように見えますが別のスクリプトからメソッドを呼び出していますか?
(もしかしたらインスペクターから操作しているかもしれませんが……)

フェード処理を何度も呼び出していると途中で思ったとおりの表示にならない場合はフェードカラーの設定がどこかで残っていることが多いです。
デバッガを使ってFadeManagerのメンバ変数を確かめてみてください。

FadeManagerクラスに以下のメソッドを追加します。

C#
1public void ResetAlpha ()
2{
3    alfa = 0;
4    SetAlpha();
5}

TitleSceneManagerクラスのBackToMenuメソッドを以下の様に変更します。

C#
1public void BackToMenu ()
2{
3    titleMenuPanel.SetActive(true);
4    loadGamePanel.SetActive(false);
5    settingPanel.SetActive(false);
6    aboutPanel.SetActive(false);
7
8    // 処理を追加
9    fadeLoad.ResetAlpha();
10    fadeSetting.ResetAlpha();
11    fadeAbout.ResetAlpha();
12}

おそらくこれで思った通りの処理になると思います。

以下はフェード処理を画面全体に適応したいと勘違いしていたときに書いたものなので不必要かもしれませんが一応残しておきます。

フェード処理はシーンの切り替えなどでUIが切り替わる瞬間を見せたくないときに用いられることが多いと思います。
今のスクリプトの書き方だとパネルの切り替えと同時にフェード処理を始めているので、切り替わる瞬間が画面に映ってしまいます。
この場合はフェードアウト処理が終わって画面が真っ暗になっている間にパネルを切り替えるとUIが切り替わる瞬間を隠すことができます。
フェードアウトが終わってパネルが隠れたらパネルを切り替える処理を実行するには以下のように書くことになると思います。

シーン構成の変更

各パネルの下にFadeManagerを配置するのではなく、各パネルと同じ階層にFadeManagerを追加したGameObjectを配置する。

TitleSceneManager

3つあったFadeManagerを1つに統合

C#
1FadeManager fadeManager;

メソッドの処理を変更

C#
1void Start()
2{
3    fadeManager.currentActivePanel = titleMenuPanel;
4}

C#
1public void SelectLoadGameDescription()
2{
3    fadeManager.nextActivePanel = loadGamePanel;
4
5    fadeManager.isFadeOut = true;
6}

FadeManager

以下のメンバーをクラスに追加

C#
1public GameObject currentActivePanel;
2public GameObject nextActivePanel;

メソッドの処理を変更

C#
1public void StartFadeOut()
2{
3    // 一部ソースコードを省略
4    if (alfa >= 1)
5    {
6        isFadeOut = false;
7
8        currentActivePanel.SetActive(false);
9        nextActivePanel.SetActive(true);
10
11        currentActivePanel = nextActivePanel;
12    }
13}

投稿2020/02/28 23:33

編集2020/02/29 10:52

kawa0x0A

総合スコア271

haru325

2020/02/29 07:57

申し訳ありません、おっしゃる通りフェードカラーの設定が残ってしまっているようなのですがそれをどうやってリセットするか、どこでリセットしたらいいかがわかりません。 FadeManagerのUpdate部分に if (isFadeOutHalf) { 　　　　　　　　alfa=0.0f; StartFadeOutHalf(); } と書けばいいかと思ったのですがこれだと１回もフェードしてくれずパネルが透明なままでした。また、TitleSceneManagerのBackToMenu内に fadeLoad.isFadeIn = true; と記述すると、２回目にLoadGameボタンを押すとパネルがフェードで消えてしまい３回目にLoadGameボタンを押すと１回目と同じように正常にパネルがフェードで現れます。もう少しだけお力添えをいただけないでしょうか…。何卒よろしくお願い申し上げます。