Flutter 中 如何建構自定義 Widgets

如何建構自定義 Widgets

在Android中，您通常會繼承View或已經存在的某個控件，然後覆寫其繪制方法來實作自定義View。

在Flutter中，一個自定義widget通常是通過組合其它widget來實作的，而不是繼承。

我們來看看如何建構持有一個label的CustomButton。這是通過将Text與RaisedButton組合來實作的，而不是擴充RaisedButton并重寫其繪制方法實作：

class CustomButton extends StatelessWidget {
  final String label;
  CustomButton(this.label);

  @override
  Widget build(BuildContext context) {
    return new RaisedButton(onPressed: () {}, child: new Text(label));
  }
}
           

Then you can use this CustomButton just like you would with any other Widget:

@override
  Widget build(BuildContext context) {
    return new Center(
      child: new CustomButton("Hello"),
    );
  }
}
           

您還可以看看下面的部落格文章，回顧以前和繼續學習，包含我在學習開發中遇到的難題等等

Flutter入門，學習曆程，進入開發，在安卓手機運作起來

Visual Studio code工具開發flutte總結

Flutter 跨平台開發 為什麼選擇Flutter

跨平台開發 為什麼選擇Flutter

Android 開發者 for Flutter （1）Flutter和Android中的View對比及如何更新widget

Android 開發者 for Flutter （2）如何布局？ XML layout 檔案跑哪去了？及布局中添加或删除元件

Android 開發者 for Flutter （3） flutter中動畫是如何實作的 及 如何使用Canvas draw/paint

Flutter輪播圖編寫（兩種方式）CarouselSlider和PageView（自動輪播，也可以手動左右拖拽）

flutter 中tabbar切換上下均可，banner輪播圖，listview重新整理添加更多，listview嵌套gridview

Flutter 項目編寫 第三方插件庫檔案引入，本地圖檔 json資料引入解析

flutter run 運作項目 所遇到的問題總結（Scaffold加padding及 flutter/material.dart’;爆紅問題解決；listview嵌套gridview滑動問題）

如對您有幫助，歡迎starts 謝謝。下面是我自己寫的demo 可以看看 一塊學習：

項目源碼github：https://github.com/1136346879/flutter-

感謝Flutter 中文網 ： https://flutterchina.club/technical-overview/