Flutter第六节-----Flutter部分基础组件解析到自定义组件
一. 启动文件说明-runApp和Widget
runApp函数是Flutter内部提供的一个函数，启动一个Flutter应用就是从调用这个函数开始的
Widget表示控件、组件、部件的含义，Flutter中万物皆Widget
二.Flutter的默认Material库
●Material是Google公司推行的一套设计风格，有很多的设计规范，如颜色、文字排版、动画等。
●目的：Material为Android、Web、iOS、HarmonyOS多个平台提供统一的交互和视觉体验。
三.基础组件-MaterialApp
特性：整个应用被MaterialApp包裹，方便我们对整个应用的属性进行整体设计
void main(List<String> args) { runApp( MaterialApp( title: "Flutter组件初体验", theme: ThemeData(scaffoldBackgroundColor: Colors.blue), home: Scaffold(), ), ); }
常见属性：title/theme/home
ttle:用来展示窗口的标题内容（可以不设置）
theme:用来设置整个应用的主题
home:用来展示窗口的主体内容
四.基础组件-Scaffold组件
●Scaffold:用于构建Material Design风格页面的核心布局组件，提供标准、灵话配置的页面骨架
void main(List<String> args) { runApp( MaterialApp( title: "Flutter组件初体验", //theme: ThemeData(scaffoldBackgroundColor: Colors.blue), home: Scaffold( appBar: AppBar( //appbar用于给Scaffold声明顶部导航栏，Appbar用来构造顶部导航栏的具体样式内容 title: Text("头部区域"), //title:设置标题 centerTitle: true //居中标题 ), body: Container( //给body放置一个容器 child: Center( //给这个容器放置一个布局容器center child: Text("中部区域") //给这个center容器里再放一个child组件 ) ), bottomNavigationBar: Container( //声明底部导航栏，方便切换页面 height: 80, child: Center(child: Text('底部区域')), ), ), ), ); }注意：一个容器里面可以放一个child，不能放两个，但可以在child里面再放容器，容器中再放child。
五.Flutter自定义组件-无状态组件和有状态组件
1.无状态组件-statelessWidget
●定义：根据自己特定的需求创建自己的Widget
●分类：Flutter分为无状态组件和有状态组件
示例无状态组件：
首先创建类利用构造函数runApp初始化我们的MainPage类，继承statelessWidge把官方StatelessWidget里面已经写好的底层代码全部拿过来复用。继承之后，MainPage自动获得 Widget 必备的能力，然后重写build，StatelessWidget父类里规定：所有子类必须实现build方法，框架渲染页面时，会自动调用这个方法，获取你要绘制的组件。最后在MainPage类中return了一个MaterialApp。
void main(List<String> args) { runApp(MainPage()); } class MainPage extends StatelessWidget { @override Widget build(BuildContext context) { // TODO: implement build return MaterialApp( title: "Flutter组件的初体验", home: Scaffold( appBar: AppBar(title: Text("头部区域"), centerTitle: true), body: Container(child: Center(child: Text("中部区域"))), bottomNavigationBar: Container( height: 80, child: Center(child: Text("底部区域")), ), ), ); } }2.有状态组件-statefulWidget
●定义：有状态组件是构建动态交互界面的核心，能够管理变化的内部状态，当状态改变时，组件会更新显示内容
●实现1：创建两个类，第一个类继承Statefulwidget类，主要接收和定义最终参数，核心作用是创建State对象
●实现2：第二个类继承State<第一个类名>，负责管理所有可变的数据和业务逻辑，并实现ouild构建方法
●要点：build方法需要返回一个Widget
●需求：将之前骨架组件换成有状态组件
示例：
void main(List<String> args) { runApp(MainPage()); } class MainPage extends StatefulWidget { @override State<StatefulWidget> createState() { // TODO: implement createState return _MainPageState(); } } class _MainPageState extends State<MainPage> { @override Widget build(BuildContext context) { // TODO: implement build return MaterialApp( title: "Flutter组件的初体验", home: Scaffold( appBar: AppBar(title: Text("头部区域"), centerTitle: true), body: Container(child: Center(child: Text("中部区域"))), bottomNavigationBar: Container( height: 80, child: Center(child: Text("底部区域")), ), ), ); } }