一、Flutter目录结构:
二、Flutter入口文件、入口方法:
三、Flutter Demo:
demo1:
import 'package:flutter/material.dart';//MaterialApp 和 Scaffold两个组件装饰App
void main() {runApp(MaterialApp(home: Scaffold(appBar: AppBar(title: const Text("你好Flutter")),body: const Center(child: Text("我是一个文本",textDirection: TextDirection.ltr,style: TextStyle(fontSize: 40.0,
// color: Colors.yellow,color: Color.fromRGBO(244, 233, 121, 0.5),),),),),));
}
Flutter把内容单独抽离成一个组件:
在Flutter中自定义组件其实就是一个类,这个类需要继承StatelessWidget/StatefulWidget 前期我们都继承StatelessWidget。后期讲StatefulWidget的使用。
StatelessWidget 是无状态组件,状态不可变的widget;
StatefulWidget 是有状态组件,持有的状态可能在widget生命周期改变。
demo2:
import 'package:flutter/material.dart';import 'package:flutter/material.dart';//MaterialApp 和 Scaffold两个组件装饰App
void main() {runApp(MaterialApp(home: Scaffold(appBar: AppBar(title: const Text("你好Flutter")),body:const HomeWidget(),),));
}/// 抽离组件
class HomeWidget extends StatelessWidget{const HomeWidget({Key? key}) : super(key: key);@overrideWidget build(BuildContext context) {return const Center(child: Text("我是一个文本",textDirection: TextDirection.ltr,style: TextStyle(fontSize: 40.0,
// color: Colors.yellow,color: Color.fromRGBO(244, 233, 121, 0.5),),),);}}