按下按鈕後，跳出下一級選單的外掛~Popup。

這個功能比較常在按下設定按鈕的時候看的到。

這一次範例的完成品如下。

按下按鈕後，會跳出另一個選單。
按鈕顏色的切換是另外再做的，不包含在這個外掛中。
但，大家應該有注意到，在按鈕 1按下的時候，跳出選單中第 3項的文字，它的顏色是不一樣的，這個則是這個外掛提供的功能。

畫面編排的部份如下。

就是一個水平配置裡頭放 4個按鈕。
下方一個標籤用來顯示次選單選擇後的效果。

全部的程式碼如下。

第 1部份使用到的程式方塊說明。

when screen 1.initialize，當程式初始化的時候。
call popup 1.create，呼叫外掛程式中建立次選單的程式方塊。
component，這個地方，就放按鈕元件。

call popup 1.add，呼叫外掛程式中，增加次選單項目的程式方塊。
name，這個要放的是文字方塊，內容則是次選單中要顯示的內容。
看我們要加入幾個項次，就重覆這個動作幾次。

call popup1.set text color，呼叫外掛程式中，設定次選單文字顏色的程式方塊。
hex color，這裡只能用文字方塊，填入顏色代碼，不能直接用內建的顏色方塊。
index，放要變顏色的項次。這個要特別的說明一下，這裡的 index跟 app inventor的用法稍有不同，app inventor是從 1開始。而這個外掛則是從 0開始。
以按鈕 1的次選單為例，次選單的內容依序是 1，2，3，4。以 app inventor的用法來說的話，3的 index值應該是 3，但是在這個外掛中，第 3項的 index值則是 2。

按鈕 2的次選單作法也是相同的，這裡就不列出來了。

第 2部份使用到的方塊說明。

when button 1.click，當按鈕 1被點擊的時候。
call popup 1.show，呼叫外掛程式中，顯示次選單的程式方塊。要做這個動作，次選單才會出現。
set button 1.background color to，設定標籤 1的背景顏色為黃色。
其它按鈕的背景顏色為灰色。

按鈕 2~4的做法也是相同，只差別在按下按鈕的顏色設定成黃色，其它按鈕設定成灰色。
這是為了凸顯出在那個選單上。

第 3部份使用到的方塊說明。

when popup 1.onclick，當次選單被點擊的時候。這是外掛提供的事件方塊。

if get name = 1，當 name這個參數的值是 1的時候。
set label 1.text to，把標籤 1的文字設定成 1111。

在這裡我們用 name這個參數，來判斷點擊到的次選單是那一個。然後再看要做什麼事就可以了。

這次的 aia檔的下載連結如下:
NO_153_Pop_menu.aia

APP INVENTOR外掛
名稱：Popup
外掛來源：community.appinventor.mit.edu
外掛載點：
https://community.appinventor.mit.edu/t/free-popup-extension-an-extension-to-create-popup-menu/39163/32

參考書籍請見博客來書籍介紹頁面：
手機應用程式設計超簡單 App Inventor 2零基礎入門班
TQC+ 創意App程式設計認證指南
TQC＋創意App程式設計認證指南解題秘笈
手機應用程式設計超簡單：App Inventor 2初學特訓班
手機應用程式設計超簡單：App Inventor 2小專題特訓班
手機應用程式設計超簡單：App Inventor 2資料庫專題特訓班

之前介紹過的一些 appinventor的使用記錄，都整理在下面這個頁面上了。
APP INVENTOR學習記錄及資源整理頁面