記錄一下:
App Inventor學習記錄40,小畫家 app,上一步和下一步的功能按鈕
首先先來講一下在 app inventor中做上一步和下一步按鈕的原理。
這裡是利用畫布存檔的功能來做。
當畫布被按下的時候,我們儲存當下的畫面,來當回覆上一步的畫面。
因為我們剛碰到畫布的時候,還沒有啟動畫線等等的功能,所以這個時候保存的畫面,就是開始畫圖之前的畫面。
當畫布被放開的時候,我們儲存當下的畫面,來當回復下一步的畫面。
這代表這個畫畫的筆觸已經結束,就是我們這一次畫好圖的狀態。
畫面編排的部份如下:
1個畫布加 3個按鈕元件。
全部的程式碼如下:
第 1段的程式碼說明:
我們先建 2個變數,一個叫上一步的圖片,一個叫這一步的圖片。
從名字就知道這兩個變數是要拿來做什麼的。
第 2段的程式碼說明:
當畫布 1被拖曳後:
把畫布的線寬設定為 20。
呼叫畫布畫線的功能。
第 3段的程式碼說明:
這裡就是重點了,我儘量講的清楚一點。
當畫布被壓下後:
把上一步的圖片這個變數的值,設定成呼叫畫布存檔的功能。
把下一步的圖片這個變數的值,設定成呼叫畫布存檔的功能。
說起來就是把上一張圖片這個變數的值,設定成呼叫畫布存檔功能之後的圖片。
第 4段程式碼說明:
當上一步的按鈕被按下之後:
為了不要留下太多的問題,所以我們先呼叫畫布清除的功能。
把畫布的背景,設定成上一步的圖片。
第 5段的程式碼說明:
當重作一次的按鈕被按下之後:
同樣的理由,呼叫畫布清除的功能。
把畫布的背景,設定成這一步的圖片。
第 6段的程式碼說明:
當清除畫面的按鈕被按下之後:
呼叫畫布清除的功能。
把畫布的背景,設定成空白。
目前這個作法就只能回復上一步的步驟,或是下一步的步驟。但在實際使用上,可能需要多記錄幾個步驟。這個部份應該就是建立一個清單,當超出指定的長度之後,就刪除最舊的記錄來取代。
這個部份晚點再來介紹。
這次的 aia檔的下載連結如下:
點我下載 NO_40_DO_UNDO
參考書籍如下:
手機應用程式設計超簡單 App Inventor 2零基礎入門班
TQC+ 創意App程式設計認證指南
TQC+創意App程式設計認證指南解題秘笈
手機應用程式設計超簡單:App Inventor 2初學特訓班
手機應用程式設計超簡單:App Inventor 2小專題特訓班
手機應用程式設計超簡單:App Inventor 2資料庫專題特訓班
之前介紹過的一些 appinventor的使用記錄,都整理在下面這個頁面上了。
APP INVENTOR學習記錄及資源整理頁面