你會java吧?

會java的話,dart上手只要5分鐘

不要對編程語言有什麼恐懼,像java,dart,swift,kotlin這些語言,你會其中一個,看其他都會覺得很容易

而且現在dart越做越像是java+swift,就大部分語法類似java,後續語法的發展,則從swift上借鑒


下面這個項目是我學習Flutter過程中整理的常用的Widget,組合起來可以完成一個可用的app,擼一遍可以上手了。

[項目地址](https://github.com/77Y/flutter_awesome#awesome-flutter)

https://github.com/77Y/flutter_awesome#awesome-flutter?

github.com

Flutter 項目開發中常用的 Widget 一些基礎功能,由於每個 Widget 都有很多的屬性,這裡只列出了基本也是最常用的屬性,更多的用法可以看 Widget 中每個屬性的注釋。我會持續更新這個 demo 集合,同時後續會增加更多自定義的 Widget。

DemoButton

常用的幾種 Button

RaisedButton:Material Design 風格的 Button

FlatButton:扁平化的 Button

OutlineButton:帶邊框的 Button

IconButton:帶 icon 的 Button

DemoClipRRect

使用 ClipRRect 設置圓角。給 Container 設置 BoxDecoration 如果 child 是圖片的話圓角是無效的,可以使用 ClipRRect 給圖片或者複雜的 Widget 設置圓角。

DemoColumn

列布局,繼承自 Flex 可以對主軸和交叉軸進行設置來調整 Column 內的布局方式。

DemoRow

行布局,和列布局類似,繼承自 Flex 可以對主軸和交叉軸進行設置來調整 Row 內的布局方式。

DemoExpanded

Expanded 必須方法 Flex 中,它會把 Flex 剩餘的控制項撐滿,同時還可以給 Expanded 設置撐開的比例。

DemoStack

棧布局,就像棧一樣一層一層網上疊加,類似於 Android 里的 FrameLayout。可以通過 Positioned Widget 設置子 Widget 的位置。

DemoVisibility

控制 Widget 的隱藏和顯示。

DemoOffstage

和 Visibility 類似控制 Widget 的隱藏和顯示,比 Visibility 擁有更多的屬性,可以在 Widget 隱藏之後不佔用屏幕空間。

DemoSafeArea

安全區域,加上之後會自動適配 Android 或者 iOS 的劉海屏。

DemoPopMenuButton

彈出選擇 Widget,有時候並不能完全滿足我們的需求。

DemoBottomSheet

底部彈出 Widget。

DemoBottomModalSheet

模態的底部彈出 Widget。

DemoRefreshIndicator

Android 風格的下拉刷新

DemoBottomNavigationBar

底部導航

DemoDrawer

抽屜效果。

DemoSliverAppBarBasic

SliverAppBar的基本使用

DemoSliverAppBarAdvance

SliverAppBar 和 TabBarView 一起使用

DemoCustomScrollView

自定義 CustomScrollView 支持嵌套各種布局,如 List、Grid 等

DemoScrollController

滾動控制器,可以監聽滾動過程中的位移。

DemoScrollNotification

滾動監聽,可以監聽滾動過程中的位移。

DemoRefreshLoadMore

簡單自定義的下拉刷新和載入更多

圖太大了

DemoCustomTimePicker

自定義時間選擇控制項

DemoStateProvider

使用 Provider 實現的狀態管理


跟Java差不多。


作為資深Android開發,寫過Java、JS、kotlin,我認為Dart語言是非常優美的,Google出品,吸取了Java和JS等各種語言的優點,越寫你會越加愛上他。

而flutter唯一支持的語言就是Dart,Google真的是用全部的力氣去推動Flutter的發展,非常好用,我覺得未來移動端一定有Flutter的一席之地。

作為入門,我推薦以下幾個網站:

flutter中文網:

Flutter中文網?

flutterchina.club圖標

flutter插件平台:

https://pub.dev/flutter/packages?

pub.dev

優秀的flutter學習資源:

https://github.com/AweiLoveAndroid/Flutter-learning?

github.com

除此之外,我自己也寫了一些學習flutter的項目,喜歡的拿去:

Flutter練手項目:

https://github.com/xuexiangjys/FlutterSample?

github.com

Flutter程序模版工程:

https://github.com/xuexiangjys/flutter_template?

github.com


Dart語言很簡單,花兩小時把官方教程看一遍,有問題可以用DartPad在線練習一下。

DartPad?

dartpad.cn圖標

Flutter也沒啥難的,推薦《Flutter實戰》,很快上手。

《Flutter實戰》?

book.flutterchina.club


推薦閱讀:
相关文章