延續前一篇的文章: 穿梭在不同的畫面中 - 固定名稱路由法 — 如前文所述,Flutter 有四種 Navigation & Routing 的方式: 我們已經學過了「N1/直接導航法」,現在來看第二種,「固定名稱路由法」。 ...
如果你照著我之前寫的安裝程式,你的 Android Studio 跟 Flutter 2 SDK 應該都已經裝好了,所以我們現在就可以開始寫 Flutter 了。 寫程式前有一個很重要的建議,就是剛開始學習時,當然可以照著書寫,但是要真學會,...
這一篇希望可以解救工程師的靈魂,因為有太多的工程師因為 UX/UI 的改來改去而氣到翻臉,哎,何必呢,除了要訓練自己的時時保持出世與正向外,儘早將 UX/UI 的控制獨立,會是最好的解決方式。相信我,老闆跟 designer 也不是故意玩你,他...
這篇文章 2021/5 月寫的,此時 Flutter 是 2.2.0 版,使用的是 Mac,OS 是 11.4。 Flutter SDK Flutter 版本隨著時間自然後一直往前,所以安裝還是要依照官方的程序為準,以下是官方網址: In...
我們才剛開始寫 Flutter,只有兩個基本上空空的畫面 Screens,可是光是這樣,main.dart 裏面就已經有 120 行了,如果再繼續寫下去,很快就會有幾千行的程式碼,程式碼太長是很麻煩的,想想看,你要修改的程式內容一個在頭、一個在...
自由的切換 UI 黑暗或是明亮模式 我們的 UI 現在會依照作業系統的預設自動切換到黑暗或是明亮模式,很棒,只是,好像,還不夠好,能不能讓使用者自由的切換呢? 要怎麼做呢?請各位先想一想!
延續我們的程式碼,如果有人現在才加入,目前階...
Flutter 提供了四種 Navigation & Routing 的方式:
前面我們已經學會「N1 直接導航」及「N2 固定名稱路由」,現在讓我們來看看: N3 動態名稱路由:
延續我們的程式碼,它已經準備好可以用來測...
如前文所述,Flutter 有四種 Navigation & Routing 的方式:
我們已經學過了「N1/直接導航法」,這種直接導航的方式,說直白的,就是把要去的 screen 包成一個 Route,好處是很直接,小缺點是如果...
這是 milestone 1 的程式碼: lib/main.dart:
lib/screens/my_home_page.dart:
lib/screens/audio_session.dart:
lib/mod...
這是 milestone 3 的程式碼: lib/main.dart:
lib/theme/style.dart:
lib/screens/audio...
這是 milestone 4 的程式碼: lib/main.dart:
lib/theme/custom_widgets.dart:
lib/screens/my_ho...
從使用情境來完整的介紹 Flutter 的 TextFormField 輸入,還包含:Controller 與 FocusNode
使用 responsive_framework 套件開發 Flutter Responsive 響應式 UX
Flutter 2.2 多國語言及切換程式碼範例。
這是 milestone 2 的程式碼: lib/main.dart:
lib/s...
通常一個 App 都會有很多個畫面,在 Flutter 中,大家好像都是用「Screen」來稱呼「畫面」,所以我們以後也統一就叫「Screen」了。 繼續我們的「happy recorder 快樂錄音機」開發,在使用者的情境中,這個 App ...
播音部分改用 BLoC v7.3.0 開發的完整程式碼
這篇加上了完整的 Flutter 的 NoSQL Hive DB 程式碼展示,快樂錄音機 App 使用 Hive 來儲存使用者喜好,也用 Hive 來儲存錄音紀錄,包含 CRUD、Key 排序、Filtered 等用法。
主要新增使用 flutter_sound 套件來建立錄放音功能的 new_audio.dart
使用 Google Drive API v3 開發的完整 Google 硬碟檔案上傳與下載程式碼
分享播音功能與 UI
Flutter 在大約在三個禮拜前,發佈了 2.5 版的更新(我目前用的是 2.2.3),我對這種比較大的更新,都憂喜參半,喜的是一定有新功能或是 Bug 被移除了,憂的是通常會帶來新的問題,有時,甚至目前的程式還要做 Migration 搬遷...
我們簡介了 Flutter 中的幾個流行的資料庫(SQLite, idb shim, Hive, Sembast, Moor, ObjectBox, Cloud Firebase),也說明了 SQL 與 NoSQL 的主要不同與選擇方法,最後決...
使用 CustomPaint() 及 isolate() / compuate() 畫出 PCM 音檔的波形圖,使用者可選擇顯示區間,及優化使用者體驗
「快樂錄音機 App」一路從零開始開發,目前到 0.6 版,已經可以錄音、播放、存檔與使用資料庫紀錄了,為了讓讀者能更好的比對自己開發的結果,我把剛剛使用 BLoC 來做的播放音 refactor 部分做成了一個 GIF 動畫,可惜 GIF 沒...
處理錯誤一直是件很重要的事,這裡我們簡介了 Dart 及 Flutter 的錯誤處理方式:除了將 try-catch-finally 做了介紹,也對非同步及 runZonedGuarded 做了簡介,應該很夠用了。
很多 App 都需要支援多國語言,如果是,開發階段一定要儘早寫入,不然以後加入會改到吐血。本文深入淺出的介紹了 Flutter 的 I18n 及 L10n,學會怎麼設定多國語言,怎麼切換語言,以及中文 numberFormat 及 date 的...
本篇詳細的介紹了怎麼在 Flutter 中分享一個功能,這也是 refactor 的一個很重要部分,我們把播音功能與介面獨立出來,現在可以很簡單的在不同的畫面分享共用。
Flutter 的 StatefulWidget 從出生到死亡,會有一系列的 methods 通知你它目前的狀態,本文介紹了它的用處。另外也介紹了 FutureBuilder,它可以依照非同步的資料來建立一個「活」的 Widget。
在 Android 中使用 flutter_sound 必須要修改 Manifest 及 Gradle,它們是什麼?我們針對使用 flutter 的開發人,做了份簡單易懂的介紹。