【超初心者】一から始めるアプリ開発

2019/03/06更新

カレンダーができたので、
日ごとに内容を入力できるようにしてみます。

カレンダーの日枠をタップすると入力フォームが開いて、
対戦カード・放送ch・開始時間が選択できるような感じです。

まず前回のカレンダーに日ごとにTextを配置します。

空のオブジェクトを作ってScheduleparentとリネームします。
この中にTextを作成しSchedule0～36とリネームします。

テキストが準備できたらテキストの文字を削除して、
空白にしておきます。



日枠をタップすると入力フォームが開くようにしたいのですが、
操作系のオブジェクトをカレンダーとは切り分けたいので、
新しくCanvasを用意します。


もとのCanvasをCanvasCalendar、
新しく作ったCanvasをCanvasUIとリネームします。
CanvasUIもScreenSpaceCameraを選択してMaineCameraをアタッチします。
CanvasUIはカレンダーより上に表示したいので、OrderInLayerは1にします。

操作系は、CanvasUIにまとめておいて、
カレンダーの切り替え時などは、CanvasCalendarを切り替えるようにします。

準備ができたので、CanvasUIの中に空のオブジェクトを作って、
DayButtonParentとして、日ごとのButtonをまとめます。

準備ができた所でDayButtonParentの中にButtonを作成します。
ButtonのTextは要らないので削除です。

ボタンは透明度が無いので、
通常時とハイライト時の透明度をいじります。

ノーマルの透明度を0にして、常時は透明にしておきます。


ハイライトはマウスが上に来た時や選択中の色なので、
これを100くらいにして半透明にします。
薄いと感じたら、もう少し（150くらい）濃いめにしても良いかもです。

これでButtonの準備ができたのでDuplicateして37個作ります。


Buttonを押すと入力フォームが開いて、
それぞれの選択ができるようにしていきます。
CanvasUIの中にImageオブジェクトを作成してImageFoamとします。

ImageFoamは入力が終わると閉じる必要があるので、
３つの選択ボタンと閉じるボタンを配置します。




お待たせしました。
ここからいよいよScrollViewを設置していきます。


ScrollViewは
・ViewPort
・ScrollBar　Horizontal（横）
・ScrollBar　Vertical（縦）

３つで構成されています。

この内二つのScrollBarを削除します。
ScrollViewのフィールドはバーが無くてもスライドするので、
あまりバーの意味がないんですよ～
なんで付けてるんだろう(´｀;) ？

このままでは、フィールドが縦にも横にも動くので、

ScrollViewのInspectorからHorizontalのチェックを外します。
これでScrollViewは縦にしか動かなくなります。

準備ができたので、ScrollViewに選択肢のButtonを配置します。

ViewPortを開くとContentがあります。
この中にButtonを配置していきます。

各ボタン上にScrollViewを配置して、
選択肢用のボタンを設置したのがこちら


これでオブジェクトの準備ができたのでスクリプトを作成します。
スクリプト名はInputFoamManagerとでもしておきます。

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

public class InputFoamManager : MonoBehaviour {

    public GameObject ImageFome;             //入力フォーム取得
    public GameObject CARDView;              //対戦カードView取得
    public GameObject ChView;                //放送ChView取得
    public GameObject TimeView;              //放送時間View取得
   

	// Use this for initialization
	void Start () {
		
	}
	
	// Update is called once per frame
	void Update () {
		
	}

    //各ScrollView呼び出し
    public void ScrollViewCall(int Bt)
    {
        //いずれかのViewが開いてる時は他のViewは開かない
        if (CARDView.activeSelf || ChView.activeSelf || TimeView.activeSelf)
        {
            return;
        }

        switch (Bt)
        {
            case 1:
                CARDView.SetActive(true);
                break;

            case 2:
                ChView.SetActive(true);
                break;

            case 3:
                TimeView.SetActive(true);
                break;
        }

    }



    //入力フォームを閉じる
    public void Pushclose()
    {
        //いずれかのViewが開いている時はフォームを閉じない
        if (CARDView.activeSelf || ChView.activeSelf || TimeView.activeSelf)
        {
            return;
        }
        ImageFome.SetActive(false);
    }
}

このスクリプトをImageFoamにアタッチして、
新しくInputFoamManagerオブジェクトを作ってアタッチして、
各変数にオブジェクトを割り当てます。

選択肢用のボタンは引数を使用しているので、
対戦カードは1、Chは2、時間は3　をInspectorで入力します。

最後に各ScrollViewのチェックを外して消しておけば準備完了！
あとはプレイでっす。


各ボタンを押せばScrollViewが開くようになりました。

簡易的な入力フォームができたので、
次回はテキストの反映を作って行こうと思います。


しかし、誤作動防止のif(){Return;}便利です。
どんなスクリプトにも流用できるので誤作動防止には持ってこいでっす。(´ー｀)

って！ScrollViewの記事が保々ちがう内容やないか…
(;^o^) ＼(ToT )あんたほんとにそれでいいの



追記
スクリプト作成後、ImageFoamにスクリプトをアタッチしていましたが、
データの保存の為、SaveManagerスクリプトを追加した時に、
ImageFoamが消えてるとInputFoamManagerが見つからなくなり、
エラーが出るので修正しました。