StudyFlutter——我的第一個APP

蘇燦烤魚發表於2019-05-19

一個菜鳥的第一個Flutter APP,本文大部分設計摘抄自一週時間編寫你的第二個 Flutter APP.由於對於DartFlutter缺乏基本的熟悉,基本上算是以實戰來作為學習方法,因此部分程式碼可能不是很規範,大家有發現的部分歡迎提出來一起交流。 該專案實際寫作時間可能低於作者的時間,因為我大部分時間都是學習作者的原始碼,然後自己手動敲一遍,遇到不能理解的程式碼就百度,因此只有少部分的程式碼是自主開發的。效果如下:

歡迎頁

首頁

更多選單

分享(IOS未實現

時間篩選

收藏列表

刪除列表

空列表

flutter沒有clean project等快捷鍵(或許是我還沒有發現),但是這些都是可以通過命令列來實現的,以下是常用命令的列表:

常用命令 含義
--version 檢視Flutter版本
-h或者--help 列印所有命令列用法資訊
analyze 分析專案的Dart程式碼
build
channel 列表或開關Flutter通道
clean 刪除構建/目錄
config 配置Flutter設定
create 建立一個新的Flutter專案
devices 列出所有連線的裝置
doctor 展示了有關安裝工具的資訊
drive 為當前專案執行Flutter驅動程式測試
format 格式一個或多個Dart檔案
fuchsia_reload 在Fuchsia上進行熱過載
install 在附加裝置上安裝Flutter應用程式
logs 顯示用於執行Flutter應用程式的日誌輸出
packages 命令用於管理Flutter包
precache 填充了Flutter工具的二進位制工件快取
run 在附加裝置上執行你的Flutter應用程式
screenshot 從一個連線的裝置截圖
stop 停止在附加裝置上的Flutter應用
test 對當前專案的Flutter單元測試
trace 開始並停止跟蹤執行的Flutter應用程式
upgrade 升級你的Flutter SDK

支援國際化

名字挺高大上的,其實我就只是想避免字串的硬編碼,結果看文件、看部落格、看嗶哩嗶哩的視訊教程,到最後才大概明白是怎麼一回事,這裡我就不做文字的搬運工了,大家可以看看我學習的幾個部落格:(內容有重複,各自側重點不一樣)

localizationsDelegates: [
        S.delegate,
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
      ],
      supportedLocales: [
        const Locale('en', 'US'), // 美國英語
        const Locale('zh', 'CN'), // 中文簡體
        //其它Locales
      ],
複製程式碼

其實在App內完成上面國際化的配置後,Materia的元件就可以實現各個語言的切換(預設是僅有英),接下來說一說我遇到的問題:安裝flutter_i18n外掛以後,自動生成了相應的程式碼,但是,注意但是來了。LocaleListResolutionCallback物件無法找到對應的class(undefined class).檢視issuse的時候,作者提示更新flutter,我老老實實的更新SDK:flutter upgrade,結果還是失敗:

fatal: unable to access 'https://github.com/flutter/flutter.git/': transfer closed with outstanding read data remaining
複製程式碼

百度谷歌都沒有找到解決方案,最後有一位微信大佬南無大乘妙法蓮華經給我出了一個主意——直接下載SDK,下載解壓後複製到安裝目錄,給他來一個替換資料夾。結果果然搞定啦! 最後還是要吐一下槽,flutter設計的字串資源確實相比於Android還是複雜太多啦!

待完成

  • 完成主體顏色手動修改
  • 利用玩安卓的api實現TODO清單功能

參考:一週時間編寫你的第二個 Flutter APP

參考:Flutter 分享到第三方應用

參考:Flutter 原生平臺互動

原始碼:https://github.com/Vicent9920/study_flutter

相關文章