App Inventor學習記錄37,用下拉式選單,選擇小畫家畫線的顏色

在第 33號的記錄中,我們製作了一個有畫線、拍照、橡皮擦等功能的小畫家 app ,其中我們是按鈕功能來切換顏色,這次我們要改用下拉式選單這個元件,來切換顏色。

記錄一下:
App Inventor學習記錄37,用下拉式選單,選擇小畫家畫線的顏色


這裡我就不放畫面編排的畫面,直接放 app執行的畫面。

畫面上面是一個下拉式選單
下面就直接是一個畫布。


全部的程式碼如下:


第 1部份的程式碼說明:

我們先建立一個變數,這個變數的內容是一個清單,清單的內容我們用文字方塊來建立 5個不同的顏色。這個清單是建給下拉式選單用的。


第 2部份的程式碼說明:

當程式初始代的時候,把下拉式選單的元素的元素,設定成 global選擇顏色這個變數
補充一下,下拉式選單、清單選擇器、清單顯示器等等的,很多元件都需要使用清單。

個人覺得清單這個東西,可以說是 app inventor中最重要的元件之一。
後面我們用到的頻率會越來越高。


第 3部份的程式碼說明:

當下拉式清單選擇完成之後:
我們加入流程判斷式:
如果 selection選中項的值等於紅的話;
就把畫布的畫筆顏色設定為紅,這裡記得要拉的是顏色的方塊。

這裡因為有好幾個選項,所以我們加入否則,如果的方塊到流程判斷中。
如果 selection選中項的值等於某個顏色的話;
就把畫布的畫筆顏色設定為指定的顏色。
有幾個顏色,我們就加入幾次。


最後一個部份的程式說明:

這個部份就是畫布畫線的功能。這裡就不在多說明。


除了下拉式選單可以變幻顏色之外,也可以用滑桿,也可以再用一個一張調色盤的圖片來選擇顏色。可以達成這個目標的方式有好幾種。後面會一一的介紹。

這次的 aia檔的下載連結如下:
點我下載 NO_37_Spinner_change_color

參考書籍如下:
手機應用程式設計超簡單 App Inventor 2零基礎入門班
TQC+ 創意App程式設計認證指南
TQC+創意App程式設計認證指南解題秘笈
手機應用程式設計超簡單:App Inventor 2初學特訓班
手機應用程式設計超簡單:App Inventor 2小專題特訓班
手機應用程式設計超簡單:App Inventor 2資料庫專題特訓班

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

發佈留言