2015年7月31日 星期五

最低門檻的手機開發途徑: kivy

我一直有點想學 android 手機開發, 但每次嘗試都覺得步驟好繁瑣, 最後都放棄。 然後我遇見了 Kivy, 整個世界就改觀了! 你只需要準備四樣東西:

  1. 用 adb 傳檔案
  2. 略懂略懂 python 語言。
  3. 學一點點 「設定使用者界面用的 kv 語法」。
  4. 在手機或平板上面安裝 kivy launcher

假設你已俱備 (1) 與 (2), 本文要在十分鐘之內讓你開始在自己的手機上面實驗修改 android 程式。 事實上 kivy 是一個跨平臺的環境, 它所開發的 apps 也可以在 linux/windows/mac OS/raspberry pi 等等平臺上面執行。 一次工, 到處享受, 這才符合資訊人 「懶惰」 的美德啊!

一、 快速上手

首先在你的 linux 電腦上安裝 kivy 套件及一堆範例: apt-get install python-kivy python-kivy-examples。 然後進入 /usr/share/kivy-examples 隨便挑一個子目錄進去玩。 比方說 widgets 目錄裡面有各種 GUI 元件的範例, 像是 carousel_buttons.py、 settings.py、 spinner.py 等等。 直接下 python spinner.py 就可以執行。

我們對於內含 「android.txt」 的資料夾特別有興趣。 請這樣搜尋: find /usr/share/kivy-examples -iname 'android.txt' 請在家目錄裡建一個空目錄, 比方叫做 kivy-ex 好了, 然後把 android.txt 所在的每個目錄都拷貝出來, 通通放到 kivy-ex 底下: cp -a $(find /usr/share/kivy-examples -iname 'android.txt' | sed 's#/android.txt##') ~/kivy-ex/ 你會發現每個子目錄裡面都有 main.py 跟 android.txt 這兩個檔案。 這是 android 版 kivy 程式必備的基本要件。 另外可能還會有一個 .kv 檔, 用來設定使用者介面。

其次在你的手機上安裝 kivy launcher。 你可以 從 google play 安裝, 也可以在 官網下載頁面 找到 Kivy Launcher 1.9.0 (或某版本), 點選後面括弧內的 APK 連結。 安裝並啟動。 顧名思意, Kivy Launcher 就是用來啟動 kivy 程式的平臺。 它會告訴你: 你必須把程式放在 /storage/sdcard0/kivy 底下, 它才會啟動。 意思就是: 你不必打包 apk 檔, 直接把 (符合 kivy 規格的) python 原始碼搬到這裡就可以執行啦!

所以我們回到電腦上用 adb 連線、 建立 /storage/sdcard0/kivy , 然後退回電腦, 把剛剛的好幾個程式一起拷貝過去: adb push ~/kivy-ex/ /storage/sdcard0/kivy 以我目前版本的 python-kivy-examples 所看到的, 在我手機的 /storage/sdcard0/kivy 底下出現了 Compass、 Pictures、 main、 Showcase、 TakePicture、 Touchtracer 幾個子目錄。 在手機上重新啟動 Kivy Launcher, 隨便點一個進去玩。 例如 Pictures 這個程式會展示三張相片, 可以縮放旋轉。

所以第 (4) 步也完成了。 我看我們省略第 (3) 步好了。 先不必認真學, 直接在 ~/kivy-ex 裡面找一個 .kv 檔亂改一下 rgb 顏色的數值, 或是圖片檔的路徑, 總之裡面有很多 「不必學, 一看就懂」 的語法。 改完之後再用 adb 把它 push 到正確的位置、 重新啟動 Kivy Launcher, 第一個經過你修改的 android 程式就成功執行啦! 更狠一點, 就直接 adb shell 連進去用 vi 改 main.py 或 *.kv、 立刻存檔 & 重新執行, 立刻就看到效果!

如果喜歡從零開始, 可以從 hello world 最短的 kivy 程式著手, 只有一個十行左右的 .py 程式, 連 .kv 檔都省下來了。

二、 中文

顯示中文 ok。 請把 這個範例程式 放到手機的 /storage/sdcard0/kivy/zh_TW_test/ 底下, 並且改名為 main.py。 再把程式中提到的中文字型檔 ukai.ttc (或你自選的中文 *.ttf 檔) 也用 adb 傳到同一目錄下。 然後用手機上的 kivy launcher 開啟 zh_TW_test, 就會看到中文了。 這是從 Chui-Wen Chiu's Note 那邊學來的。

也可以不需要自備字型。 如果把 font_name = kivy.resources.resource_find('ukai.ttc') 改成 font_name = kivy.resources.resource_find('DroidSansFallback.ttf') 即可直接用系統內建的中文字型 /system/fonts/DroidSansFallback.ttf 。 事實上, 此時可以把 kivy.resources.resource_add_path('.') 那整句省略掉, 因為 /system/fonts/ 看起來就是系統在搜尋字型時的預設路徑。

如果想讓所有元件都預設採用中文字型, 可以參考 這篇

目前中文輸入好像還很困難: 請見 這篇

三、 除錯

在 kivy 下除錯, 看來很挑戰。 我都開一個視窗下: adb logcat | grep -i kivy 並且每到一段落就按幾個 Enter, 方便分辨出最新的錯誤訊息。

比方說, 如果路徑設定錯誤/檔案擺錯地方, 那麼程式會直接結束; 但從 logcat 的訊息卻完全看不出是什麼原因。 同樣的錯誤, 在 linux 下執行時, 會出現 「None is not allowed for Button.font_name」 這樣的訊息, 略有提示作用。 所以開發程式時, 也許我們應該在 linux 底下除錯? 但很不幸地是: 在 linux 底下執行正確的程式時, 卻看不到中文! 你會一直以為你做錯了, 卡在那邊; 其實在 android 上已可成功顯示中文。

此外, android-x86 模擬器 好像無法執行 kivy 程式。 從 logcat 看不出到底是何原因。

四、 實驗及爬文心得與建議

如果要畫圖的話, 就要學 canvas。 但 Kivy 的 canvas 的概念並非一般的 「畫布」。 比方說:已經畫了一個圓, 之後要如何動態地改變它的顏色呢? 原來 要用 Kivy Property 來實作。 這不太符合直覺啊! 大推 10 things you should know about the Kivy canvas。 另外想到的一個可能性是 svg; 但 kivy 的 svg 支援才剛起步

你的 kivy 程式也可以編譯成獨立執行的 apk 檔。 比較簡單的方法是 採用 buildozer, 但是它會幫你的每個不同的 project 都下載一次 android sdk 跟 android ndk, 很不經濟。 比較理想的做法是 全副武裝採用 python-for-android

結論: kivy launcher 很適合讓那些原本根本沒機會在 android 上面寫程式的人可以享受快速上手的成就感。 如果能克服除錯問題, 也許適合拿來快速開發 prototype 實證一些觀念, 或拿來寫一些自己用的小程式。 但以目前的狀況來看, 恐怕還不適用於撰寫比較完整的 app。 所以我正在改學 cordova

沒有留言:

張貼留言