【Unityメモ書き3】スクロール&ボタン処理

クロ

Unityメモ書き第三弾は
もっと基本的なことかもしれません
冬月が躓いた場所って……

とはいえ
意外とスクロール処理の説明って無い気がするわ
冬月が最新の参考書を買っていないからかもしれないけどね

霊夢
魔理沙

仕様なのかバグなのかわからない
動きもあったしな……
その部分さえ抑えてしまえば楽にスクロール処理を作ることができるな

同じように
迷っている人の助けになればと思います
詳しくは続きを読むからどうぞ

妖夢

1.GameObjectのScrollbarを配置する

クロ

これはUnityに備わっている
UIの機能なので迷うことはないですよね
Unityのメニューから探すだけです

2.スクロールさせたい項目を配置する

HierarchyにScrollbarが配置されているわ
これだけでは何もできないので
リストの中身を作っていくわ

霊夢
魔理沙

スクロールするコンテンツはScrollbarの
ScrollView → Viewport → Contentに配置すると表示領域外にあった分だけ
スクロール処理をしてくれるぞ

3.スクロールさせる量に合わせて、contentのサイズを変更する

ただ、配置するだけじゃスクロールの処理をしてくれないです
ContentのWidthとHeightの数値を表示させたい全体の大きさに合わせないと
スクロールしてくれません

妖夢

クロ

スクロールの全体領域を変更したい場合は
ScrollViewのWidthとHeightの数値を変更してください
スクロールの表示領域が合わせて拡縮します

ポイントはスクロールをさせたい
リストオブジェクトの配置位置が
Contentになることと

霊夢
魔理沙

スクロールさせる場合は
contentの大きさも合わせて
変更する必要がある、っていことだな

あと、スクロールの設定も行うこともでき
縦、もしくは横スクロールのみなど
スクロールバーのデザイン変更等できます

妖夢
Vertical	縦のスクロール処理を制限する
Horizontal	縦のスクロール処理を制限する
Vertical Scroll bar	縦のスクロールバーの画像を設定する
Horizontall Scroll bar	縦のスクロールバーの画像を設定する

1.ボタンを配置する

クロ

次にボタンを配置します
スクロールするコンテンテンツをクリックすると
それがボタンになっていて操作できる、といったことができます

これで、スクロールのときのように
Hierarchyにボタンが配置されているわ
一つ注意なのが、Canvas以下に配置しないと表示されない点ね

霊夢
魔理沙

ボタン処理は画面タッチ処理と同じだな
スプリクトでボタンを押したときの処理を書いて
それをOnClickに登録すれば動くぞ

Buttonの設定を変えれば
任意のボタン画像に変更したり
ボタンを押したときの演出を変更できます

妖夢
クロ

Buttonの画像を変更する場合は
TransactionのTargetGraphicを任意の画像となっている
GameObjectに変更すれば良いです

ボタンを押したときの色の変更もやってくれるわ
自分で変更したいときは
○○○ Colorの設定を変更すればOKよ

霊夢
Normal Color: 初期の色
Highlighted Color: マウスが上に乗った時の色
Pressed Color: ボタンを押した時の色
Disabled Color: ボタン無効化時の色

魔理沙

Transactionの設定をColor Tintから
Sprite Swapに変更すると着色から
画像の変更に切り替えることができるぞ

UnityのUIは簡単に機能を実装できますが
説明がないと少々とっつきにくいものになっていると思います
もうちょっとメモしたいことがありますので、もう少々お付き合いください

妖夢

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください