Unity-Ugui-如何製作 Dropdown Menu 彈跳視窗

使用Image Button 按鈕觸發來開啟跟關閉Dropdown Menu。彈跳下拉式選單是運用Unity Ugui 提供的Dropdown UI Component跟彈跳視窗(C Sharp Script)做結合。

Dropdown Menu彈跳視窗的結構

首先建立一個Panel名為SettingDropdown。然後在這下面建立一個Image的物件叫PanelSettings作為Image Button。

在PanelSettings建立一個Image Panel然後按右鍵把Dropdown 這個物件帶入。

Dropdown下面的Template子物件記得要到Inspector 勾選取消。主要是因為按下Label時才會把Content呼叫出來。
有關Dropdown的部分請參考 Unity-Ugui-如何製作出下拉式選單Dropdown Menu。

回到PanelSettings的Inspector裡
設定Button Highlighted Color。

為了要讓Image Button按鈕產生開啟關閉的功能這邊要產生一個Script。所以到Asset下面的Script Folder裡新增一個C Sharp Script。名為DropdownOpener.cs。

在Asset下的Script Folder裡新增一個Script

新增後在DropdownOpener.cs點兩下進入編譯程式的畫面,編寫一段程式。主要是呼叫Panel這個物件。

編寫C Sharp Script

回到PanelSettings的Inspector裡設定事件。

設定Button的事件

新增Dropdown Opener (Script)下面有個Panel的欄位,把寫好的Dropdown Opener.cs這個Script拖曳到Script裡。在Panel插槽指定為Panel這個物件。

呈現效果如下:

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *