Tina Tang's Blog

在哪裡跌倒了,就在哪裡躺下來

0%

作品集-天氣:威特App

天氣:威特 App 使用氣象局 API 即時更新天氣資訊,並透過 GPS 定位您的所在位置,顯示使用者所在區域之天氣狀況。


App 簡介

  • 起始畫面
    開啟「天氣:威特 App」時會先出現如下圖的起始畫面。
  • 目前位置
  1. 出現起始畫面後,會進入到目前位置頁面。
  2. 首次開啟時,會向使用者要求位置權限,當權限通過後,即開始嘗試定位使用者的所在位置。
  3. 當取得使用者的所在位置,且確認使用者的所在國家為台灣時,便會抓取該地區的天氣資料,並呈現在畫面中。
  • 現在天氣
    進入現在天氣頁面後,使用者可點選右上角的下拉選單,選取欲查詢的地區及縣市,畫面中便會呈現該縣市即時的天氣狀況。
  • 天氣預報
    進入天氣預報頁面後,使用者可點選右上角的下拉選單,選取欲查詢的地區,畫面中便會呈現該地區今明 36 小時的天氣預報。

天氣資料簡介

「天氣:威特 App」中使用的天氣資料皆為中央氣象署/中央氣象局提供的 API 資料

  • 現在天氣:使用「預報」的「現在天氣觀測報告」(O-A0003-001)
  • 天氣預報:使用「觀測」的「臺灣各縣市天氣預報資料」(F-C0032-001)

使用的方法

以下將「天氣:威特 App」中使用到的一些重要方法/架構/工具等整理成表格來呈現。

架構/功能
工具/套件 說明
App 架構 MVVM 使用 LiveData+ViewModel 實現 MVVM 架構
抓取資料 Retrofit、Moshi 使用 Retrofit 抓取氣象局 API 資料,並使用 Moshi 將 JSON 資料解析成 data object
App 畫面 RyclcerView、Data Binding 使用 RyclcerView 呈現天氣資料,並透過 Data Binding 更新 UI
切換畫面 Fragment、Bottom Navigation 使用 Fragment 搭配 Bottom Navigation 切換 App 畫面
GPS 定位 LocationManager、Fused Location Provider 使用 LocationManager API 和 Fused Location Provider API 實現定位功能

Demo

以下為「天氣:威特 App」的 Demo 影片:

下載 App