Flutter開發(fā)中的Tips

1、Container 默認是居中,可以設(shè)置方向

alignment: Alignment.centerLeft,

3、ListView 外面嵌套Expand

4、在Row 中 添加

Expanded(
child: SizedBox.shrink(),
),
可以使 后面的Widget 放在最后,相當(dāng)于Android 的 右對齊


mainAxisAlignment: MainAxisAlignment.spaceBetween,
 可以讓 Row 中的兩個子布局 分別排布在兩頭

5、判斷List 是否為空

List list=List();
list.isEmpty() 判斷集合為空
list.isNotEmopty()判斷集合不為空

6、Colum 垂直布局

水平方向 靠左對齊===》CrossAxisAligment.start

7.Dart 動態(tài)解析key-value

1. 原始數(shù)據(jù)為Map<String,dynamic> 類型
2.原始數(shù)據(jù)就是json字符串,需要轉(zhuǎn)化為1的類型
下面貼出來要解析的數(shù)據(jù):

8、GestureDetector 點擊空白區(qū)域 沒有點擊效果;

解決辦法:GestureDetector(
    behavior: HitTestBehavior.opaque,
    onTap: (){
      NavigatorUtils.gotoObjectDetail(context, data.objKey);
  }
 );

9.Colum 豎直布局 對齊方式

crossAxisAlignment: CrossAxisAlignment.start,

10.CustomScrollView 嵌套 ListView 如何讓ListView區(qū)域不滾動?

    physics: NeverScrollableScrollPhysics()==> 不滾動
    BouncingScrollPhysics() ==>IOS 效果
    ClampingScrollPhysics() ==>Android 效果
    FixedExtentScrollPhysics () ==>固定范圍內(nèi)的滾動效果

11、字符串中要加空格,怎么加?

  String string ='哈哈\t你好啊'
  String name='${property.name+'\t'+男生}'

12、時間戳格式化?

第三方視頻播放器

chewie: ^0.9.10

14、記錄報錯:

Cleartext HTTP traffic to 192.168.12.18 not permitted
原因:
Android P(9.0)及以上要求App內(nèi)鏈接全部加密(https),使用明文鏈接會報以下錯誤:
Cleartext HTTP traffic to 192.168.12.18 not permitted
辦法:
在安卓的清單文件中,添加如下一行:
android:usesCleartextTraffic="true"

15、TabBarView 每次切換都會重新走initState()

解決辦法:
with AutomatickeepAliveClientMixin 
重寫方法:
@override
bool get wantKeepAlive => true
也用在保持頁面狀態(tài),當(dāng)新開頁面返回時,頁面會刷新,也可用此方法

16.字符串比較

1、Comparable.compare(str1,str2)==0  表明相等
2、str1==str2 

17.用戶點擊展示“水波紋”效果 InkWell

18.Container 添加外部描邊 和 圓角 ShapeDecration

Container(
  height: 30,
  decoration: ShapeDecoration(
  color: MyColors.color_1246FF,
  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(7),)),
  margin: EdgeInsets.only(left: 10, right: 10, bottom: 10),
  child: Center(
    child: Text(
      '復(fù)制到剪切板',
      style: TextStyle(color: MyColors.white, fontSize: 16),
     ),
  ),
)

19.粘貼板操作

 1、復(fù)制內(nèi)容到粘貼板
Clipboard.setData(ClipboardData(text: 'templateString'));

2、獲取粘貼板的內(nèi)容 (異步調(diào)用)
onTap: () async {
  print('獲取粘貼板的數(shù)據(jù)');
  ClipboardData data =
    await Clipboard.getData(Clipboard.kTextPlain);
  if (data != null) {
        setState(() {
          this.barcode = data.text;
    });
  }
},

3、清除粘貼板的內(nèi)容

因為不像Android那樣,有clear 方法,所以只能賦值空字符串:
Clipboard.setData(ClipboardData(text: ''));

20、限制輸入框為數(shù)字

TextField(
      inputFormatters: [
                       WhitelistingTextInputFormatter(RegExp("[a-zA-Z]")),//只允許輸入字母
      ],
 ),
 TextField(
      inputFormatters:[WhitelistingTextInputFormatter.digitsOnly],//只允許輸入數(shù)字
 ),
TextField(
      inputFormatters: [
                        WhitelistingTextInputFormatter(RegExp("[0-9.]")),//只允許輸入小數(shù)
                      ],
)
  keyboardType: TextInputType.number,/// 數(shù)字   結(jié)合上面 
  /// 不顯示下面的橫線
 decoration: InputDecoration(border: InputBorder.none),

21、as is

as  類型轉(zhuǎn)換
is  當(dāng)對象是相應(yīng)類型時返回true;  相當(dāng)于java => instance of 
is! 當(dāng)對象不是相應(yīng)類型時返回true

示例:
if(user is User){
    user.name='Flutter'
 }
/// 如果確定user 是User的實例,則可以通過as 直接簡化代碼
(user as User).name='Flutter';、

注意:上面兩段代碼并不相等,當(dāng)user的值為null 或者不是User 對象,
第一段不會做任何事情,但第二段會報錯;

22、退出棧中的多個路由

PopUtil

23、Eventbus 的應(yīng)用 相互傳值

24、控制顯示的控件

bool isVisibily=true;
Offstage(
  offstage:isVisibily,
  child:Widget()
)
* 默認是不顯示

26、GridView 圖文上下排列 寬高的問題?
暫時還沒解決辦法,都是寫死的寬高比例,不能像Android 那樣,wrap_content ,高度自適應(yīng)

28、調(diào)用相機 IOS 需要添加權(quán)限 勿忘

29、Future<int> 轉(zhuǎn)化為 int

Future<int> Function()' can't be assigned to the parameter type 'num'
比如:Future<int> length =file.length;
num size = await length; 

30、上傳文件,二進制傳輸

一般: 'application/x-www-form-urlencoded' 
要變?yōu)椋盒枰褂胢ultipart/form-data格式來上傳文件
結(jié)論:已實現(xiàn),后續(xù)補充Demo

32、解決SmartRefresher +ListView / GridView 圖片閃爍的問題

1、首先 需要在主頁面 繼承 AutomaticKeepAliveClientMixin,
 復(fù)寫: @override
bool get wantKeepAlive => true;
2、將Item 作為一個單獨組件封裝起來,并 重復(fù)上面的步驟 
3、展示圖片的控件需要用 Cache的NetworkImage 

完成上面3步,在列表滾動的時候,可見item再次可見的時候圖片不會重新加載,
打開新頁面返回的時候圖片也能保持住狀態(tài),不會重新加載了!

33、Hero 動畫 包裹的組件不能是整個列表的Item,

1、如果全部包裹,返回當(dāng)前頁面會報頁面越界的報錯
2、正確的做法是 只包裹需要動畫的組件,比如說只包裹圖片

34、Flex 布局 中 Expand 如何添加間距(Margin)?

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容