✨✨✨✨✨ 魏什么_多喝水 Flutter 之路

语雀地址

import 'package:flutter/material.dart';  //安卓风格widget
import 'package:flutter/cupertino.dart'; //苹果风格widget

void main() => runApp(MyApp());  //指定入口为 MyApp


//入口
class MyApp extends StatelessWidget {
  //MaterialApp 为root widget
  @override
  Widget build(BuildContext context) {
    
    //MaterialApp 表示当前应用的风格是 Material Design。
    //为了使用其他已经封装好的 Material Design 风格的 Widget，就必须使用 MaterialApp。
    //因此 MaterialApp 经常是 Flutter Widget 树里的第一个元素，就是 Root Widget。
    
    return MaterialApp( 
      title: 'Flutter Demo',//目前不知道干啥用的.应该是显示在导航栏上的,但是没有作用,感觉是被Scaffold覆盖掉了
      theme: ThemeData( //ThemeData 设置 Flutter App 的主题，比如颜色、字体等。
        primarySwatch: Colors.blue, //导航栏的背景色
      ),
      //home 必须要赋值,因为是进入app的第一个页面. 一般都是 Scaffold
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

//这里才是正在的根视图
class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
     
    //Scaffold 是实现 Material Design 基本视觉布局结构的 Widget,
    //它被设计为 MaterialApp 的顶级容器，会自动填满屏幕，而且会自动适配不同的屏幕，例如刘海屏等。
    return Scaffold(
      appBar: AppBar( //顶部的导航栏，不设置的话就不会显示。
        
        title: Text(widget.title), //设置标题取的是上面homePage的title
        backgroundColor: Colors.deepOrange, //设置导航栏的背景颜色
        
      ),
      
      //body 是 Widget 类型，是 Scaffold 的最重要的属性，也是实际要显示的 UI
      body: Center( //Center、Container
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
    );
  }
}