App Inventor學習記錄163-命運轉盤小遊戲3~決定轉盤停止是轉到幾號

圖片要旋轉到停止的時候,我們用圖片的旋轉角度落在那一個範圍,來決定是那一個號碼。

記錄一下:
App Inventor學習記錄163-命運轉盤小遊戲3~決定轉盤停止是轉到幾號


轉盤旋轉的效果如下。

旋轉停止之後,會顯示轉到幾號,然後把對照的獎項顯示出來。


畫面編排的部份如下。


全部的程式碼如下。


第 1部份的程式碼記錄。

等一下要用計時器來決定圖片的角度,所以這裡要先建幾個變數。
初始速度,摩擦力、旋轉的速度、圖片的角度。

獎項是用來抓上一個畫面傳來的初始值。
轉到的號碼,就是用來顯示轉到的號碼。


第 2個部份的程式碼記錄。

建 2個角度清單,等一下對照使用。


這裡要先補充說明一下角度的設定問題。

當圖片的 heading落在 345~15間的話,那取得值就是 1。
heading值落在 15~45間的話,那取得值就是 2,其它以此類推。


第 3部份的程式碼記錄。

把用來顯示獎項的標籤元件建成顯示的標籤這個清單。


第 4部份的程式碼記錄。

建立設定畫布及轉輪大小及轉輪位置的程式。

顧名思意,這裡就不多說明。圖片調整位置可以參考之前介紹過的這篇。
App Inventor學習記錄35-2,調整畫布精靈的位置,讓游標正確顯示


第 5部份的程式碼記錄。

這個請對照上面那裡寫滿了角度的轉盤圖片來看。


第 6部份的程式碼記錄。

程式啟動的時候,呼叫設定畫布及轉輪大小及轉輪位置這個程式。
隱藏要隱藏的項目,顯示要顯示的項目。


第 7部份的程式碼記錄。

當開始 button 1.click,當按鈕 1(開始抽獎)按下的時候。
變數_初始速度變數_摩擦力設定成一個隨機值。

變數_旋轉速度設定成變數_初始速度
然後啟動計時器。


第 8部份的程式碼記錄。

當旋轉的速度的時候,就呼叫轉到值判斷的程式。

不然的話,就讓旋轉的速度的值每次計次都降低,把轉盤的角度設定成新的角度。


第 9部份的程式碼記錄。

這個是再轉一次按鈕,做法跟前面介紹過的地方是相同的。


第 10部份的程式碼記錄。

這個是回到首頁的按鈕。


終於完成了,真的慶幸把命運轉盤拆成三篇講,這個寫來真的太累人。
但是 aia檔的內容是完整版的,所以下載一次就可以了。

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

app inventor交流討論群組連結如下(掃描 QR code或是點擊連結皆可)
https://line.me/ti/g2/Loxwrcc2iNRS5-Qd4SFXxQ?utm_source=invitation&utm_medium=link_copy&utm_campaign=default

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

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

This Post Has One Comment

  1. Qumma

    看不清楚照片

發表迴響