App Inventor學習記錄96-2-柔語音計算機第 2版,基本上的計算機功能都完成

做幾個日常生活就用的到的 app,像計算機這類的,加上加上廣告,這樣就能慢慢的賺錢的。當然,既然是計算機,當然是能夠正確的運行才是,所以改了第 2版。
記錄一下:
App Inventor學習記錄96-2-柔語音計算機第 2版,基本上的計算機功能都完成

這一次拋棄了在App Inventor學習記錄96-簡單的笨蛋柔語音計算機中的做法,重新找了一個外掛來處理數學算式的問題,照道理講原本的程式會再簡單些,但在我老婆的測試下,找出了不少問題,最後都有把它處理完成。所以這一版就已經可以正常的使用。


程式實際的使用畫面如下:

左下角的齒輪,可以開啟設定,再用複選框,來設定音效及圖示的開啟或關閉。
記錄按鈕,按下後可以看到之前計算結果。
其它的部份也都有微調過。

畫面配置的部份就像上面這樣,我就不額外截圖說明。


全部的程式碼如下:


第 1部份的程式碼說明:

音效清單這個變數,是建立一個清單,把所有的音效元件都加到這裡頭。

音效來源這個變數,是建立一個清單,把各個音效元件的 mp3檔建立一個清單存放,每一個音效元件對應 mp3檔案,都是在清單中的同一個位置。
比如說,音效 7在音效清單的第 7個位置,音效 7要使用的 7.mp3這個檔案,也是放在音效來源這個清單中的第 7個位置。這樣等一下在設定音效開啟關閉的時候,就可以用任意元件一次性的處理。


接下來再建立兩個清單。

按鈕表這個清單,要加圖片的按鈕元件,都加到這裡。

按鈕對應圖片這個清單,就是這些按鈕要使用的圖片。
跟音效元件設定 mp3來源的方式相同,在按鈕元件這裡要使用的圖片,都是在各別清單中的相對應位置。


再來還是建立變數。

答案數字對應音效這個清單中,放的都是在答案中會出現的數字,再用這些數字去找相對應的音效元件,來發出聲音,所以像加減乘除這種不會在答案中出現的符號,就不列在這個清單中。

按鈕對應文字這個清單中,放的則是按鈕上要出現的文字。
如果按鈕上沒有放數字的圖片的時候,就要讓它出現文字。這個因為我老婆說彩色的按鈕太花俏了,她比較喜歡簡單版的。按下設定按鈕之後,會出現複選框來選擇是不是要開啟按鈕的圖示。


接著還是要建立變數。

標籤顯示內容變數,是計算機上方出現,比較小的運算文字。
實際計算內容變數,是實際上運算用的算式。照道理說,實際計算內容變數,應該是要跟標籤顯示內容變數的內容相同,但這次使用的是一個數學外掛,它用運算符號加和減是相同的,但乘和除的符號不同。所以這裡拆成兩個來顯示。

音效變數,初始值設定為 1,這個值為 1的時候,就會播放音效。如果是 0就不播放。
計錄變數,初始值設定為 0,這個值為 0的時候,不顯示清單顯示器,如果等於 1的時候,就會顯示清單顯示器。而清單顯示器顯示的就是計算的歷史記錄。

答案,這個變數是拿來放計算後的結果。
要說出的答案的清單,這個變數的預設值是一個空清單,當按下等於按鈕之後,就會答案這個變數的值逐一加入這一個清單中。舉例來說,如果答案的值是 5201314的話,那麼要說出的答案的清單的值就會是 (5,2,0,1,3,1,4)。

說答案的變數,它的值是 0,當計器時啟動的時候,這個值會每次計時都加 1,然後呼叫對應的音效元件來播放聲音,也就是說一次播放一個音效,一直到唸完答案為止。

設定變數,初始值是 0,這是用來切換設定按鈕的圖片用的。
計時器 2,初始值是 0,同樣是每次計時加 1,這個值等於 10的時候,就播放廣告。

變數比較多,本來是沒有這麼多,但我老婆測試完之後,改動了一些東西,就越改越多。


第 2部份的程式碼說明:

建立一個叫數字按鈕執行程式的小程式,這個程式中,加入 3個參數。按下音效清單中的那一個按鈕標籤顯示文字運算使用文字
這裡適用的按鈕有幾個,分別是按鈕 1、2、3、4、5、6、7、8、9、0 、.,這幾個。如果音效變數的值等於 1的時候,呼叫對應的音效元件來播放音效。

接下來再以答案這個變數是不是空白來條件判別。
如果答案變數是空白的時候,這代表還沒有按下過等於按鈕,所以讓按下按鈕的文字直接顯示就可以,再用文字方塊的合併文字,把文字組合起來就可以。只是前面有說明,這次用的數字外掛,用的符號和一般常看到的不同,所以會把顯示的內容,和運算的內容分開成兩個。

如果答案變數等於空白的話,就先把 3個變數的值設定成空白。然後再做下一步。

舉例來說,當答案這個變數是空白的時候,依序按下 1+2+3+4+5+6+7+8+9+10後,
標籤顯示內容的值,就會是 1+2+3+4+5+6+7+8+9+10。
實際計算內容的值,也會是 1+2+3+4+5+6+7+8+9+10。

答案這個變數不是空白的時候,假設答案的值為 100,依序按下 1+2+3+4+5+6+7+8+9+10後
當按下 1這個按鈕時候,答案變數的值,會變成空白。
然後,標籤顯示內容的值,先變成空白,再變成 1。
實際計算內容的值,也會先變成空白,再變成 1。
再接著按下去之後,就會依照答案的值是空白來做。
標籤顯示內容的值,就會是 1+2+3+4+5+6+7+8+9+10。
實際計算內容的值,也會是 1+2+3+4+5+6+7+8+9+10。


第 3部份的程式碼說明。

建立一個叫按鈕加上圖片的程式。
這個程式執行的時候,把按鈕表這個清單中所有的按鈕的圖片,都設定成按鈕對應圖片清單中的圖片,再把所有按鈕的文字設定成空白。


第 4部份的程式碼說明:

建立一個叫按鈕改用文字的程式。
這個程式執行的時候,把按鈕表這個清單中所有的按鈕的文字,都設定成按鈕對應文字清單中的文字,再把所有按鈕的圖片設定成空白。


第 5部份的程式碼說明:

建立一個叫運算符號按鈕執行程式2的小程式,這個程式中,加入 3個參數。按下音效清單中的那一個按鈕標籤顯示文字運算使用文字

如果音效變數的值等於 1的時候,就播放對應的音效。
這裡的順序,大家一邊做,一開邊模擬器模擬,很容易理解,這裡就不多解釋。


第 6部份的程式碼說明:

建立一個叫音效來源全開的小程式。
當這個程式執行的時候,把音效清單中的音效元件的音效來源,依次設定成音效來源清單中的項次。


第 7部份的程式碼說明:

建立一個叫音效來源關閉的小程式。
當這個程式執行的時候,把音效清單中的音效元件的音效來源,依次設定空白。


第 8部份的程式碼說明:

當螢幕初始化的時候,如果音效變數的值等於 1,呼叫音效來源全開這個小程式。
然後,把複選盒 1和 2的選中,都設定為真。

然後呼叫廣告元件,讓廣告出現在下方。
這個部份請參考上一篇:
App Inventor學習記錄97-怎麼用enhance在 app inventor上,加上admob廣告


第 9部份的程式碼說明。

在畫面編排的時候,就已經勾選計時器 2的啟用計時,所以當程式一啟動的時候,計時器 2就會一直的計次,每次都加 1。當計時器 2這個變數的值大於等於 10的時候,就把計時器 2變數的值,設定回 1。
然後呼叫廣告元件來下螢幕下方顯示廣告。這部份同樣請參考:
App Inventor學習記錄97-怎麼用enhance在 app inventor上,加上admob廣告


第 10部份的程式碼說明:

這幾個按鈕的做法都相同。數字相關的按鈕,就呼叫數字按鈕執行程式,填入相關的參數值。
如果是運算符號的話,就呼叫運算符號按鈕執行程式,填入相關的參數值。

這裡大家會看到在運算符號這邊,是用文字方塊來填值。原因很簡單,因為運算符號不是數字,所以不能用數字方塊來填值。
另外呢,這次用的數學外掛,用的加減乘除的符號是 +-*/,這樣看上去不是很舒服,常見的符號是 +-x÷。所以在一開始的時候,設定的兩個變數,就是為了因應這種情形。


第 11部份的程式碼說明:


當設定按鈕被按下的時候,變更設定變數的值,同時切換相關元件的可見件,來顯示相關的元件。
按下設定按鈕,也就是左下角的齒輪,就會出現上方的兩個複選盒,用來設定音效,或是圖示的開啟。


第 12部份的程式碼說明:

當清除按鈕被點選的時候,把相關元件的值,都設成空白或是空清單。
這個最好寫了。


第 13部份的程式碼說明:


這個跟按下設定按鈕的作法是同樣的,都是變化一下記錄變數的值,同樣切換相關元件的顯示性。這裡主要是要把清單顯示器的可見性顯示出來。像下圖這樣。


第 14部份的程式碼說明:

這個部份,我們在上一篇介紹過這,這裡就不在多做說明。


第 15部份的程式碼說明:

複選盒 1用來設定是否開啟音效,複選盒 2是用來設定是否開啟按鈕圖示。
如果複選盒被選上的話,就呼叫音效來源全開按鈕加上圖片程式。
如果沒有選上,就呼叫音效來源關閉按鈕改用文字程式。


第 16部份的程式碼說明:

當等於按鈕被按下之後,就要做這一堆事情。
這裡主要的部份就是使用了 puravidaapps Math Extension的外掛元件,它有使用的範例在,這次的計算機 APP主要就是用這個外掛下去做調整的。
puravidaapps Math Extension的外掛連結

這隻外掛在無法計算出結果的時候,會出現 NaN的字樣。所以這次按下等於之後處理的事情,就針對在使用上的相關問題做處理。
比較重要的地方就是判斷算式的最後一個值是不是數字,如果是數字的話,才能計算。
以及如果答案的值不包含 NaN,才進行後續的動作。
其它像加清單什麼的,這些部份都在上一篇有介紹過。這次就不重覆了。


第 17部份的程式碼說明:

計時器 1這個部份,主要是要能依照答案,逐一的讓每一個數字對應的音效元件發出聲音。這個部份跟上次介紹的也差不多,這次也不再多說。


就如前面說過的,基本上就是圍繞著 puravidaapps Math Extension這個外掛下去做的。這次很明顯讓我覺得 APP INVENTOR跟 WORDPRESS挺像的,都有很多外掛元件可以用。
找到一個好用的外掛,就會有一種找到天堂的感覺。
我也有想辦法照原本的寫法,去修改。花了好幾天,效果真是不好。一直到上網搜尋了好一陣子之後,重新以這個外掛當核心來重寫。

再經過我老婆幫我測試了好一下,這個計算機已經可以用了,可以滿足平常我做用計算機的習慣,更好的是,一邊用計算機,還可以一邊賺錢。這感覺真好。

我看了一下 ADMOB後台的數據,幾天用下來,雖然只有賺 0.2塊左右,但這完全就是多的,挺不錯的,至於怎麼在 APP INVENTOR中加入 ADMOB的廣告,這部份請參考:
App Inventor學習記錄97-怎麼用enhance在 app inventor上,加上admob廣告

這次測試完成之後,接下來就是要把這個柔語音計算機給上架到 GOOGLE PLAY商店上,到時候,會再做儘可能詳細的說明。

這次的 apk檔的下載連結如下:
點我下載 NO_96_2_Calculator_ad-enhanced.apk

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

發表迴響