App Inventor學習記錄107-用方向感測器做的指南針

這一次要用的方向感測器中的方位角 Azimuth來做指南針,用這個功能的時候,要記得朝北時為0度,朝東時為90度,朝南時為180度,朝西時為270度,剩下來就是設定的問題了。
記錄一下:
App Inventor學習記錄107-用方向感測器做的指南針


這個在模擬器上無法作用,在手機上才能進行動作。
實際完成畫面如下。

關於方向感測器的說明如下,請參考官網連結。
http://ai2.appinventor.mit.edu/reference/components/sensors.html#OrientationSensor


畫面編排的部份如下。

1個標籤元件,用來顯示方位。
1個畫面元件,裡頭再放了 1個圖像精靈。
最後當然就是這次的主角,方向感測器。


全部的程式像這樣。


第 1部份的程式碼說明。

建立一個變數_角度,初始值設定為 0。這個變數是用來取方向感測器的方向角。


第 2部份的程式碼說明。

程式一開始的時候,把畫布的高度和寬度設定一下。
然後也把圖像精靈_指針的寬度和高度設定一下。這裡要說明的是,由於我用的圖片是正方形的,而且中間羅盤的部份有留邊,所以我把圖像精靈的寬度和高度都設定成一樣。

接著。要畫指向北方的那一條白線,這裡就把畫布 1的畫筆顏色,設定成白色,再呼叫畫布畫線的功能,把這一條白線給畫出來。


第 3部份的程式說明。

只要我們旋轉手機的時候,方向感測器就會一直去取最新的方位角。
所以我們把變數_角度的值,設定成進位後取整數的方位角。

然後,再依照角度的範圍,去設定要顯示什麼訊出來。
這裡設定的範圍如下。
-30~30度,北方。
30~60度,東北方。
60~120度,東方。
120~150度,東南方。
150~210,南方。
210~240,西南方。
240~300,西方。
300~330,西北方。

最後再把圖像精靈_指針的指向,設定成方位角的角度就可以。
圖像精靈的指向其實就是旋轉幾度的意思。旋轉的時候,會依圖像精靈的中心點來做旋轉,所以我們一開始設定好圖像精靈的位置之後,就不用不像設定 x,y位置一樣那麼麻煩。
官網說明參見下方連結:
http://ai2.appinventor.mit.edu/reference/components/animation.html


我個人覺得覺得方向感測器可能跟手機有關係。我用我的手機測試的時候,沒有那麼準。有的時候指向北方的方向是錯的,不過手機搖個幾下,倒是會很快的修改回來。但是用別隻手機的時候,感覺就好一點,這種情形就比較少出現。

好的,這次的 apk檔的下載連結如下:
點我下載 NO_107_compass.aia

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

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

發表迴響