Quantcast
Channel: C#タグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 9509

【Unity】カレンダーの作成【Android/ios】

$
0
0

はじめに

ある日、アプリの制作にカレンダーを使用したくなりました。
「Unity カレンダー」で先生に尋ねてもあまり自分の用途に合った記事が出てこない…
あまりというかほぼ出てこない…なんで?カレンダーになんか恨みあるの?

というわけで適当にパパっと作ってみました。
意外に詰まったので同じ境遇の方がいれば参考にしていただければ幸いです。

aaa.gif

こんな感じのです。

ボタンを並べる

カレンダー自体は、GameObjectにプレハブのButtonを7*6の42個配置していてそこに数字を入れている感じなのでまずはButtonのプレハブを作成します。
作成方法はこちらなど参考にしてください。
大きさなどはGameObjectでそろえるので適当で大丈夫ですがデフォルトの画像だと集合体恐怖症さんが発狂してしまうので無地の画像を適当に作成し、使用したほうがいいと思います。
背景(白).png
作るのめんどい人はどうぞ。

そしてPanelを新規作成し好みの大きさに合わせて、その子として新規オブジェクトを配置します。
背景(白).png
このGameObjectにグリットレイアウトグループコンポーネントを追加します。背景(白).png

これをすることでこのオブジェクトに配置されたボタンがサイズを合わせて並ぶようになります。
そして、オブジェクトを配置するスクリプトを書いていきます。

Calendar.cs
usingSystem.Collections;usingSystem.Collections.Generic;usingUnityEngine;usingUnityEngine.UI;usingSystem;publicclassCalender:MonoBehaviour{publicGameObjectcanvas;//エディタから指定publicGameObjectprefab;//エディタから指定voidStart(){for(inti=0;i<42;i++){GameObjectbutton=Instantiate(prefab,canvas.transform);button.GetComponent<Button>();}}}

これをGameObjectに追加し、プレハブにはボタンのプレハブをCanvasにはGameObjectを追加してください。この状態で一度再生してみます。
aaa4.gif
ボタンが白のため死ぬほど見づらいですが42個配置されました。ちゃんと確認したい場合はプレハブのボタンの画像を変更してみてください。GameObjectの幅が狭いと横に7個配置されない場合があるので適宜調整してください。

日付を入れる

このままでは白いボタンが42個配置されただけなのでここに日付を入力していきます。先ほど作ったCalender.csに以下を追加してみてください。

Calendar.cs
publicstaticDateTimeSelectDate;privateDateTimeD_Date;privateintstartday;privatevoidCalendarController(){intdays=1;intoverday=1;D_Date=newDateTime(SelectDate.Year,SelectDate.Month,1);//SelectDateの月の最初の日付intyear=SelectDate.Year;//年intmonth=SelectDate.Month;//月intday=SelectDate.Day;//日//最初の日付の曜日を取得DayOfWeekfirstDate=D_Date.DayOfWeek;//何日まであるかintmonthEnd=DateTime.DaysInMonth(year,month);//前月が何日まであるかSelectDate=SelectDate.AddMonths(-1);month=SelectDate.Month;SelectDate=SelectDate.AddMonths(1);intlastmonth=DateTime.DaysInMonth(year,month);switch(firstDate){caseDayOfWeek.Sunday:startday=0;break;caseDayOfWeek.Monday:startday=1;break;caseDayOfWeek.Tuesday:startday=2;break;caseDayOfWeek.Wednesday:startday=3;break;caseDayOfWeek.Thursday:startday=4;break;caseDayOfWeek.Friday:startday=5;break;caseDayOfWeek.Saturday:startday=6;break;}intlastmonthdays=lastmonth-startday+1;for(inti=0;i<42;i++){if(i>=startday){if(days<=monthEnd){//文字を入れるTransformDAY=GameObject.Find("GameObject").transform.GetChild(i);DateTimetmp=D_Date;//一時変数DayOfWeeknum=tmp.DayOfWeek;//土曜日青・日曜日赤switch(num){caseDayOfWeek.Sunday:DAY.GetChild(0).GetComponent<Text>().color=Color.red;break;caseDayOfWeek.Saturday:DAY.GetChild(0).GetComponent<Text>().color=Color.blue;break;default:DAY.GetChild(0).GetComponent<Text>().color=Color.black;break;}DAY.GetChild(0).GetComponent<Text>().text=D_Date.Day.ToString();D_Date=D_Date.AddDays(1);days++;}else{TransformDAY=GameObject.Find("GameObject").transform.GetChild(i);DAY.GetChild(0).GetComponent<Text>().color=Color.gray;DAY.GetChild(0).GetComponent<Text>().text=overday.ToString();GameObjectbutton=GameObject.Find("GameObject").transform.GetChild(i).gameObject;button.GetComponent<Button>().onClick.RemoveAllListeners();overday++;}}else{TransformDAY=GameObject.Find("GameObject").transform.GetChild(i);DAY.GetChild(0).GetComponent<Text>().color=Color.gray;DAY.GetChild(0).GetComponent<Text>().text=lastmonthdays.ToString();GameObjectbutton=GameObject.Find("GameObject").transform.GetChild(i).gameObject;button.GetComponent<Button>().onClick.RemoveAllListeners();lastmonthdays++;}}}

死ぬほど見づらいコードだしなんか気持ち悪い箇所もあるかと思うのですが備忘録として書いているのものなのでお手柔らかにお願いします。(白目)
そしてvoid Start()

SelectDate=DateTime.Now;CalendarController();

をさらに追記し実行してみます。
aaa44.gif

はい、日付が登録されました。SelectDateをDateTime.Nowにしているので実行した月のカレンダーができていると思います。ここを変更すれば変更した月のカレンダーが表示されます。
カレンダーを表示したいだけの方はこれにて完了になります。

ボタン押下時に値を保存する

自分はカレンダーで選択した値を使いたかったのでボタンを押した際の処理を追記していきます。
上のコードのFor分を以下に変更し、関数も追加してください。

Calendar.cs
for(inti=0;i<42;i++){if(i>=startday){if(days<=monthEnd){//文字を入れるTransformDAY=GameObject.Find("GameObject").transform.GetChild(i);DateTimetmp=D_Date;//一時変数DayOfWeeknum=tmp.DayOfWeek;//土曜日青・日曜日赤switch(num){caseDayOfWeek.Sunday:DAY.GetChild(0).GetComponent<Text>().color=Color.red;break;caseDayOfWeek.Saturday:DAY.GetChild(0).GetComponent<Text>().color=Color.blue;break;default:DAY.GetChild(0).GetComponent<Text>().color=Color.black;break;}DAY.GetChild(0).GetComponent<Text>().text=D_Date.Day.ToString();//以下3行追加GameObjectbutton=GameObject.Find("GameObject").transform.GetChild(i).gameObject;button.GetComponent<Button>().onClick.RemoveAllListeners();button.GetComponent<Button>().onClick.AddListener(()=>{set_Date(tmp);});D_Date=D_Date.AddDays(1);days++;}else{TransformDAY=GameObject.Find("GameObject").transform.GetChild(i);DAY.GetChild(0).GetComponent<Text>().color=Color.gray;DAY.GetChild(0).GetComponent<Text>().text=overday.ToString();GameObjectbutton=GameObject.Find("GameObject").transform.GetChild(i).gameObject;button.GetComponent<Button>().onClick.RemoveAllListeners();overday++;}}else{TransformDAY=GameObject.Find("GameObject").transform.GetChild(i);DAY.GetChild(0).GetComponent<Text>().color=Color.gray;DAY.GetChild(0).GetComponent<Text>().text=lastmonthdays.ToString();GameObjectbutton=GameObject.Find("GameObject").transform.GetChild(i).gameObject;button.GetComponent<Button>().onClick.RemoveAllListeners();lastmonthdays++;}}voidset_Date(DateTimedate){Debug.Log(date);//値を保存する処理など}

これで実行してみます。

aaa44k.gif

自分はわかりやすいようにテキストで表示していますが上のコードだとログで表示されるはずです。
以上になります。わかりづらいかもしれませんがお役に立てたら幸いです。


Viewing all articles
Browse latest Browse all 9509

Trending Articles