iT邦幫忙

2025 iThome 鐵人賽

DAY 24
0
生成式 AI

我的 AI 學習之路:30天 Gemma 與 Gemini系列 第 24

我的 AI 學習之路:第24天 Gemma 與 Gemini - Gemini Cli 與 Android

  • 分享至 

  • xImage
  •  

Gemini Cli 與 Android

Gemini CLI 的主要功能:
 1 程式碼理解與生成
 2 偵錯與錯誤修復
 3 文件與測試
 4 檔案操作與執行
 那就來試試寫一個Android 的 BMI 專案吧
 

實作範例

prompt: 幫我寫一個android BMI 的app , 用compose

https://ithelp.ithome.com.tw/upload/images/20250925/201216435T2NYaxQgA.png

Gemini Cli

Finalizing the Plan

  I'm currently reviewing the plan. I've confirmed it directly 
  addresses the user's request and adheres to the "New Application" 
  workflow. The plan is clear, professional, and sets proper 
  expectations. I'm confident in its structure and the use of best 
  practices. I'm ready to present it to the user.

  好的,我可以為您建立一個使用 Jetpack Compose 的 Android BMI 
  計算器應用程式。

  這會是一個簡單的單一畫面應用程式,使用者可以輸入身高和體重,然後計算
  出 BMI 值以及對應的體重類別。

  在開始建立檔案之前,這是我的計畫:

  應用程式概觀

   * 類型: 原生 Android 應用程式
   * 核心功能:
       1. 提供兩個輸入框,分別用於輸入身高 (cm) 和體重 (kg)。
       2. 一個「計算」按鈕,用於觸發 BMI 計算。
       3. 顯示計算出的 BMI 數值。
       4. 根據 BMI 結果,顯示體重狀況(例如:過輕、正常、過重)。
   * 專案名稱: BmiCalculatorApp

  技術棧

   * 語言: Kotlin
   * UI 框架: Jetpack Compose
   * 架構: 基本的 MVVM (Model-View-ViewModel) 模式,將 UI 
     邏輯與業務邏輯分開,以便於維護。

  使用者介面與體驗 (UI/UX)

  我會使用 Material Design 元件來打造一個乾淨、現代的介面。整體佈局會是
  垂直的,包含標題、兩個輸入框、一個按鈕和結果顯示區域,所有內容都會置
  中對齊,確保在各種尺寸的螢幕上都有良好的可讀性。

  實作步驟

   1. 建立專案結構: 在您的工作目錄下建立一個名為 BmiCalculatorApp 
      的新資料夾,並在其中設定標準的 Android 專案結構。
   2. 設定 Gradle build 檔案: 建立 build.gradle.kts 檔案,並加入 Jetpack 
      Compose 和 ViewModel 所需的依賴項。
   3. 建立主畫面 (UI): 使用 Jetpack Compose 建立 UI,包含 TextField 
      (輸入框)、Button (按鈕) 和 Text (文字)。
   4. 實現 BMI 計算邏輯: 在 ViewModel 中建立計算 BMI 的函式,並管理 UI 
      狀態(例如身高、體重和計算結果)。
   5. 連接 UI 與邏輯: 將 Compose UI 連接到 
      ViewModel,當使用者點擊按鈕時更新狀態並顯示結果。

  如果您同意這個計畫,我將開始建立專案檔案。請問是否繼續?

 好的 
  
  好的,我將開始建立專案。首先,建立專案目錄結構。  
  ✓  Shell mkdir -p BmiCalculatorApp/app/src/main/java/com/example/bmica… │
 ╰─────────────────────────────────────────────────────────────────────────╯
✦ 好的,目錄結構已建立。接下來,我將建立資源資料夾。
 ╭─────────────────────────────────────────────────────────────────────────╮
 │ ✓  Shell mkdir -p BmiCalculatorApp/app/src/main/res/values && mkdir -p… │
 ╰─────────────────────────────────────────────────────────────────────────╯
✦ 資源資料夾已建立。現在,我將開始設定建置腳本。首先是 
  settings.gradle.kts 檔案。
  WriteFile Writing to ...BmiCalculatorApp//settings.gradle.kts  
  ....
  
  settings.gradle.kts 已建立。接下來是專案層級的 build.gradle.kts 檔案。
 ╭──────────────────────────────────────────────────────────────╮
 │ ✓  WriteFile Writing to BmiCalculatorApp/build.gradle.kts    │
 ....
 
 好的,接著是應用程式層級的 build.gradle.kts 
  檔案,這個檔案會包含所有必要的依賴項。
 ╭───────────────────────────────────────────────────────────────────╮
 │ ✓  WriteFile Writing to ...BmiCalculatorApp/app/build.gradle.kts  │
 │                                                                   
 ....
 
 建置檔案都設定好了。現在我來建立 Android 應用程式的清單檔案 
  AndroidManifest.xml。
 ╭────────────────────────────────────────────────────────────────────╮
 │ ✓  WriteFile Writing to ...orApp/app/src/main/AndroidManifest.xml  │
 ...
 
 好的,AndroidManifest.xml 
  已建立。接下來,我將建立應用程式所需的資源檔案,首先是 strings.xml。
 ╭────────────────────────────────────────────────────────────────────╮
 │ ✓  WriteFile Writing to ...torApp/src/main/res/values/strings.xml  │
 
 ...
 
 strings.xml 已建立。現在來建立 themes.xml 檔案。
 ╭────────────────────────────────────────────────────────────────────╮
 │ ✓  WriteFile Writing to ...App/app/src/main/res/values/themes.xml  │
 ...
 
 ...
 
 至此,BMI 計算器應用程式的所有必要檔案都已建立完畢。專案 
  BmiCalculatorApp 現在包含完整的結構、建置腳本、UI 程式碼和業務邏輯。

  您可以載入 Android Studio 開啟 /Users/kevin/BmiCalculatorApp 
  資料夾,然後建置並在模擬器或實體裝置上執行該應用程式。

  如果您想嘗試使用指令行建置,可以執行以下指令:

   1 cd BmiCalculatorApp
   2 ./gradlew assembleDebug

  這會產生一個可安裝的 APK 檔案。

 

第一階段程式完成

prompt: 幫我執行./gradlew BUILD 專案 │

Gemini Cli

好的,我將執行 ./gradlew build 來建置專案 (請注意,是 build 而非 
  BUILD)。

  首先,我需要確保 gradlew 檔案是可執行的。
 ╭─────────────────────────────────────────────────────────────────────────╮
 │ ✓  Shell chmod +x gradlew [in /Users/kevin/BmiCalculatorApp] (Make the… │
 ╰─────────────────────────────────────────────────────────────────────────╯
✦ 好的,gradlew 
  檔案權限已設定。現在開始執行建置。這可能需要一些時間,Gradle 
  會下載所需的依賴項。
 ....

 建置失敗了。錯誤訊息顯示找不到應用程式圖示資源 (mipmap/ic_launcher 和 
  mipmap/ic_launcher_round)。

  這是在 AndroidManifest.xml 中指定的,但我尚未為其建立任何圖示檔案。

  我將為您建立一組基本的預留位置圖示檔案來修正這個問題,然後再試一次建
  置。首先,我將建立圖示的背景顏色檔案。

 好的,圖示背景已建立。接下來,我將建立圖示的前景,這會是一個簡單的向量
  圖形。
  
  ...
  
  好的,第二次建置也失敗了。這次的錯誤是 Jetpack Compose 編譯器版本和 
  Kotlin 版本不相容。

  錯誤訊息指出:
   * 您使用的 Kotlin 版本是 1.9.23。
   * 但 Compose 編譯器版本 1.5.9 需要的是 Kotlin 1.9.22。

  解決方案是將 Compose 編譯器版本更新到與 Kotlin 1.9.23 
  相容的版本。根據官方的對應表,我需要將版本從 1.5.9 更新到 1.5.10。

  我將修改 app/build.gradle.kts 檔案來進行此項變更。
  
  ....
  
  建置再次失敗,且出現了相同的版本不相容錯誤。看來我上次的修正 (1.5.10) 
  仍然不正確,它也需要 Kotlin 1.9.22。

  對於這個錯誤,最直接的解決方法是遵循編譯器的明確要求,將專案的 Kotlin 
  版本從 `1.9.23` 降級到 `1.9.22`。這樣就能確保兩者版本相容。

  我將修改專案層級的 build.gradle.kts 檔案來降級 Kotlin 版本。
  
  太好了!建置成功!

  在解決了圖示和版本相容性問題後,專案已成功建置。

  您現在可以在以下路徑找到已編譯的 APK 檔案:
  BmiCalculatorApp/app/build/outputs/apk/debug/app-debug.apk

  您可以將此檔案安裝到 Android 裝置或模擬器上進行測試。

prompt: 幫我加test case

Gemini Cli

測試案例已全部加入。

  我已經為您建立了兩種類型的測試:
   1. BmiViewModelTest.kt:這是一個單元測試,用於驗證核心計算邏輯。
   2. BmiScreenTest.kt:這是一個 UI 
      測試,用於確保使用者介面能正確地與使用者互動並顯示結果。

  您可以透過 Android Studio 執行這些測試,或者使用下面的指令行指令:

   1. 執行單元測試 (在 JVM 上快速執行):
   1     cd BmiCalculatorApp
   2     ./gradlew test

   2. 執行 UI 測試 (需要在連接的 Android 裝置或模擬器上執行):

   1     cd BmiCalculatorApp
   2     ./gradlew connectedAndroidTest

https://ithelp.ithome.com.tw/upload/images/20250925/201216434rayuDPzMW.png

執行結果

https://ithelp.ithome.com.tw/upload/images/20250925/201216435nUgQasOwG.png

總結

Gemini Cli 寫 Android 的專案也沒有什麼問題,還會一直修正問題,可以在手機上成功執APP
, 真是太好了。

  在android studio 已經內建了gemini,但還是要開啟建案來修改,用Cli直接在終端機就搞定了呀。 


上一篇
我的 AI 學習之路:第23天 Gemma 與 Gemini - Gemin 在Cloud Run部署多模態助理
下一篇
我的 AI 學習之路:第25天 Gemma 與 Gemini - Gemini Cli 寫WordPress 外掛
系列文
我的 AI 學習之路:30天 Gemma 與 Gemini25
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言