150多個Flutter組件詳細介紹送給你

来源:https://www.cnblogs.com/mengqd/archive/2020/03/23/12555078.html

迷茫是什麼,迷茫就是大事幹不了,小事不想乾,能力配不上欲望,才華配不上夢想。 150+Flutter組件詳細介紹地址: "http://laomengit.com/" 前言 我在Flutter未正式發佈之前就開始學習了,因為 系統,隨著5G的發展,物聯網將會迎來爆髮式的增長,目前的市場上還沒有一款物 ...


迷茫是什麼,迷茫就是大事幹不了,小事不想乾,能力配不上欲望,才華配不上夢想。

150+Flutter組件詳細介紹地址:http://laomengit.com/

前言

我在Flutter未正式發佈之前就開始學習了,因為Fuchsia系統,隨著5G的發展,物聯網將會迎來爆髮式的增長,目前的市場上還沒有一款物聯網系統占據主導地位,雖然Google沒有說Fuchsia是為物聯網而生,但你理解Fuchsia系統的特性你就會明白此系統非常適合物聯網,因此Flutter的發展前景不可限量。

在學習Flutter的過程中,中文資料非常少,官方的文檔比較晦澀難懂,而且沒有相關demo,這就是此網站誕生的初衷,希望能夠幫助廣大Flutter初學者,這裡沒有高深的技術,有的只是一個個控制項的基礎用法。

目前已經整理了150+的組件,而且將相近的組件放在了一起,比如Button組件,系統提供了10多種Button類組件,雖然索引是按照字母排序的,但不管你看哪一個Button,都可以看到其他Button的相關用法。

Flutter官方提供的Widget超過了300,個人的精力實在有限,如果你也希望幫助到別人,歡迎投稿,將會在其底部展示作者以及作者博客地址。

歡迎大家加入Flutter交流群(微信:laomengit)或者掃描下方二維碼:

也歡迎大家關註我的公眾號【老孟程式員】,文章及相關資源(正在準備控制項的PDF以及大量相關demo)會在公眾號首發,掃描關註:

未來規劃

  1. 此網站的移動端已經在開發了,到時可以從手機上學習相關知識。
  2. 雖然Flutter是一個UI框架,但僅僅是UI是無法構成一個完整的App 的,因此下一步重點是介紹功能性的技術,比如網路載入數據、保存數據、混合開發等。
  3. 小demo的開發,我也在寫一個大而全的項目還是小而精的項目上思考了很久,最後我選擇了小而精的項目,原因是小的項目可以讓大家更快的關註到重點,適合學習,比較大的項目比較難以入手。

Flutter會不會火?

我收到了很多關於要不要學Flutter?Flutter會不會火的問題?說實在我也不知道,任何事物的發展壯大天時地利人和缺一不可,技術本身優勢僅僅是最基本的一個方面,我只能說Flutter的概率比較大而已,就像你和馬雲的兒子誰更有希望成為億萬富翁一樣,我只能說Flutter的發展前景不可限量。

其實很多東西的學習,儘快入坑學習、動手實踐遠比畏畏縮縮、進度停留瞭解階段要好得多,這是一個很簡單的道理,可是偏偏很多人不明白或者做不到。如果你可以做到這樣,不得不說這也是一種優勢。

Flutter的使用情況

我知道你一定非常關註目前各個公司使用Flutter的情況,尤其頭部互聯網公司,據我所得到的消息(當然我也在頭部互聯網公司)目前各大互聯網公司的頭部App基本很少使用,為什麼?原因很簡單,

  1. Flutter從正式發佈至今才2年,到底如何誰心裡也沒底,能不能禁得住市場的考驗都是一個未知數。
  2. Flutter目前的包體積居高不下,頭部App對包體積要求非常嚴格,都是以KB為單位的,即使一個空的Flutter項目都好幾“MB”。

雖然頭部App使用很少,但都在內部項目或者次級項目嘗試Flutter。

小公司和個人開發者目前使用Flutter技術的非常多,沒有進入過跨平臺開發的人永遠體會不到跨平臺開發的便利,跨平臺開發的人很難在回到原生開發了,除非你是為了五斗米折腰。

記住跨平臺開發是歷史趨勢,從當初的H5到React Native,在到現在的Flutter,都是為瞭解決跨平臺開發,提高開發效率,歷史的車輪不會停止,即使不是Flutter,也會出現另一個Flutter。

關於Flutter版本

Flutter發展速度之快超乎你的想象,在查資料的時候註意版本,舊的版本在新的版本可能已經廢棄了,尤其在混合開發方面。因此本站所有的文章如無特殊說明,Flutter版本及Dart版本如下:

  • Flutter版本: 1.12.13+hotfix.5
  • Dart版本: 2.7.0

如何學習Flutter

本站雖然整理了150+的控制項基本用法,以後也會繼續完善,但並不是讓你每一個都學習一遍,任何技術基本都是掌握20%就可以解決80%的問題,因此我整理了一些常用控制項,只需學會這些基礎控制項就可以上手項目了,至於其他的控制項只需大概瀏覽一下,做項目的時候遇到一些功能能夠想起Flutter已經提供了此組件就可以了。

關於Dart語言,如果你有其他高級語言的基礎,比如Java,可以不用特意去學Dart基礎,更著別人的代碼敲,很快就可以掌握了。

最近也在整理學習Flutter的思維導圖,等整理好了分享給大家。

開發環境建議

俗話說的好“磨刀不誤砍柴工”,一款好的IDE可以極大的提高開發效率,個人建議使用mac(系統)+Android Studio。原因如下:

  • 既然使用了Flutter,那麼開發的項目應該是移動端App,Flutter的打包最終依然是原生的應用程式。
  • Flutter在Android上調試的時候會遇到各種編譯不通過的問題,這些需要一些Gradle的基本知識,因此建議使用Android Studio,理解基本編譯過程。
  • Android編譯不過一般是gradle版本、support版本和androidx的問題,這些問題在Android Studio上更好解決。

平時調試的時候可以使用Android Studio+IOS的模擬器進行調試。

開發環境的安裝最好按照Flutter官網的步驟來,網上的介紹很可能版本比較老了。

第三方庫的使用

在學習階段建議大家少用第三方庫,尤其是一些UI庫、狀態管理和路由管理的庫,這裡並不是說這些庫不好,這些庫很好,是大牛的智慧的結晶,如果你沒有經過原生的開發,不瞭解開發的痛點,你永遠無法瞭解這些庫帶給你的好處,而且如果這些庫一直有人維護那還好,一旦沒人維護,出了問題那解決起來可能更麻煩。

那是不是都不用第三方庫呢?並不是絕對的,比如網路請求庫dio,嚴格的說這不是Flutter的庫,而是Dart的庫,此庫已經非常穩定。還有涉及大量原生開發的庫,原生開發並不是你關註的重點,這些庫是可以用的,但要瞭解Flutter與原生開發的通信機制。

吐槽一下

千萬不要和別人說Flutter的UI編寫太不好維護了,為什麼?因為嵌套啊,我就想問問你你平時一個函數會寫1000行嗎?你寫代碼不會封裝嗎?平時的模塊化思想都哪去了?不管H5,還是Android、IOS的UI開發哪一個不是“樹”結構。


您的分享是我們最大的動力!

更多相關文章
  • https://www.cnblogs.com/tan-chao/p/11023181.html 簡介 MongoDB[1] 是一個基於分散式文件存儲的資料庫。由C 語言編寫。旨在為WEB應用提供可擴展的高性能數據存儲解決方案。 MongoDB[2] 是一個介於關係資料庫和非關係資料庫之間的產品,是 ...
  • 在一張表裡有多個索引 , 我們where欄位里條件有多個索引的值 , 那麼究竟使用的哪個呢? 我們可以使用explain來查看 , 其中的key_len欄位可以看得出來 比如下麵這條sql explain select * from ent_calendar_diary where email='x ...
  • 分享攢了多年的mssql腳本 腳本類別包括:備份還原表分區常用函數錯誤日誌定時自動抓取耗時SQL並歸檔發郵件腳本模塊鏡像批量腳本資料庫收縮資料庫損壞資料庫賬號統計資料庫大小性能作業 腳本數量:54個 github地址:https://github.com/xiaohuazi123/mssql-scr ...
  • SQL 包含以下 4 部分: 1 數據定義語言(DDL):DROP、CREATE、ALTER 等語句。 2 數據操作語言(DML):INSERT(插入)、UPDATE(修改)、DELETE(刪除)語句。 3 數據查詢語言(DQL):SELECT 語句。 4 數據控制語言(DCL): GRANT、RE ...
  • 第一個就是使用優化查詢的方法。這個在前期的內容中有具體說明,這裡不再做說明。 第二、這裡簡要說明一個以下幾個方法: 主從複製、讀寫分離、負載均衡 目前,大部分的主流關係型資料庫都提供了主從複製的功能,通過配置兩台(或多台)資料庫的主從關係,可以將一臺資料庫伺服器的數據更新同步到另一臺伺服器上。網站可 ...
  • 學習自《劍破冰山 Oracle開發藝術》第五章 報表開發之擴展GROUP BY對於簡單group by語句很難對複雜維度進行分析,難以達到實際生產的複雜報表需求,group by的擴展特性就需要了,union語句也可以達到需求但是sql複雜且效率低1 rollup多維彙總rollup,分組先進行常規... ...
  • [toc] mysql自動生成大量數據 為了學習驗證高性能mysql,自動生成大量的數據做測試。內容來源於網路。 創建隨機數字生成 DELIMITER $$ CREATE DEFINER= @`% random_num`( ) RETURNS int(5) BEGIN DECLARE i INT D ...
  • mysql嚴格模式下 , 不允許給blob text geomtry json列增加預設值 可以使用 select @@sql_mode 查看當前模式 , 例如下麵這樣 mysql> select @@sql_mode -> ;+ +| @@sql_mode |+ +| STRICT_TRANS_T ...
一周排行
  • 背景 習慣使用markdown的人應該都知道Typora這個神器,它非常簡潔高效。雖然博客園的線上markdown編輯器也不錯,但畢竟是網頁版,每次寫東西需要登錄系統-進後臺-找到文章-編輯-保存草稿。。。非常難受。。。 但是使用Typora來寫的話,文章圖片又是個問題,本地寫完粘貼到網站上,圖片全 ...
  • 案例:修改預設線程個數 1.NameValueCollection System.Collections.Specialized.NameValueCollection collection = new System.Collections.Specialized.NameValueCollecti ...
  • // from https://stackoverflow.com/questions/35381238/how-to-use-custom-fonts-in-emgucv string text = "塗聚文(Geovin Du)"; // 下麵定義一個矩形區域 int rectWidth = t ...
  • 場景 ASP.NET中新建Web網站並部署到IIS上(詳細圖文教程): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/107199747 前面講過將ASP.NET的項目部署到本機的IIS上。 但是如果將其部署到伺服器上Window ...
  • 在不同的區域中使用Convert.ToDouble可能會產生問題。 string str = "20.0"; double val = Convert.ToDouble(str); 比如在某些區域語言中得到的結果是200,如: Thread.CurrentThread.CurrentCulture ...
  • 1、前言 ​ 不知道你是否對.NET裡面的定時器產生過一些疑問,以下是武小棧個人的一些總結。 2、官方介紹 在.NET的框架之內定時器有四種,先看一下微軟官方對他們各自特點介紹: System.Timers.Timer,它將觸發事件,並定期在一個或多個事件接收器中執行代碼。 類旨在用作多線程環境中基 ...
  • 筆試考試系統需求分析 1. 引言 1.1編寫目的 項目需求分析目的是使用戶和軟體開發者雙方對項目開發目標有一個共同的理解,便於對軟體開發各個過程的控制與管理,通過對項目開發目標的描述,使開發人員能夠正確理解用戶需求,明確該系統應具有的功能。性能與界面要求。 需求分析作為項目開放的基礎和依據,其預期讀 ...
  • 使用Topshelf部署.net core windows服務 首先新建一個.net core的模板worker程式 過程 略 打開Program.cs namespace TopshelfDemo { public class Program { public static void Main(s ...
  • xaml裡面使用很簡單 xmlns:i="http://schemas.microsoft.com/xaml/behaviors" <i:Interaction.Behaviors> <i:MouseDragElementBehavior/> </i:Interaction.Behaviors> 後 ...
  • Application Insignhts是微軟開發的一套監控程式。他可以對線上的應用程式進行全方位的監控,比如監控每秒的請求數,失敗的請求,追蹤異常,對每個請求進行監控,從http的耗時,到SQL查詢的耗時,完完整整的被記錄下來。當對程式進行優化跟排錯時非常好使。它原來是visualstudio ...