Flutter 目录结构介绍
|
文件夹 |
作用 |
|
android |
android 平台相关代码 |
|
ios |
ios 平台相关代码 |
|
lib |
flutter 相关代码，我们主要编写的代 码就在这个文件夹 |
|
test |
用于存放测试代码 |
pubspec.yaml |
配置文件，一般存放一些第三方库的依 赖。 |
Flutter 入口文件、入口方法
每一个 flutter 项目的 lib 目录里面都有一个 main.dart 这个文件就是 flutter 的入口文件
main.dart 里面的
void main(){ runApp(MyApp());
}
也可以简写
void main()=>runApp(MyApp());
其中的 main 方法是 dart 的入口方法。runApp 方法是 flutter 的入口方法。 MyApp 是自定义的一个组件
Flutter 把内容单独抽离成一个组件
在 Flutter 中自定义组件其实就是一个类，这个类需要继承 StatelessWidget/StatefulWidget 前期我们都继承 StatelessWidget。后期给大家讲 StatefulWidget 的使用。 StatelessWidget 是无状态组件，状态不可变的 widget
StatefulWidget 是有状态组件，持有的状态可能在 widget 生命周期改变
用MaterialApp 和 Scaffold两个组件 装饰 App、
1、MaterialApp
MaterialApp 是一个方便的 Widget，它封装了应用程序实现 Material Design 所需要的 一些 Widget。一般作为顶层 widget 使用。
常用的属性:
home(主页)
title(标题)
color(颜色)
theme(主题)
routes(路由)
...
2、Scaffold
Scaffold 是 Material Design 布局结构的基本实现。此类提供了用于显示 drawer、
snackbar 和底部 sheet 的 API。
Scaffold 有下面几个主要属性:
appBar - 显示在界面顶部的一个 AppBar。
body - 当前界面所显示的主要内容 Widget。
drawer - 抽屉菜单控件。
...
示例代码：
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "我是一个标题",
home: Scaffold(
appBar: AppBar(
title: Text('Loaderman'),
elevation: 15.0,
),
//设置标题阴影
body: MyHome(),
),
theme: ThemeData(
//设置主题颜色
primarySwatch: Colors.yellow),
);
}
}
class MyHome extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Center(
child: Text(
"我是 loaderman",
textDirection: TextDirection.ltr,
style: TextStyle(
fontSize: 15, fontWeight: FontWeight.bold, color: Colors.black),
),
);
;
}
}
