Flutter 01 目录结构入门-Toy模板网

这篇具有很好参考价值的文章主要介绍了Flutter 01 目录结构入门。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

一、Flutter目录结构：

Flutter 01 目录结构入门,flutter,flutter

二、Flutter入口文件、入口方法：

三、Flutter Demo：

Flutter 01 目录结构入门,flutter,flutter

demo1：

import 'package:flutter/material.dart';

//MaterialApp 和 Scaﬀold两个组件装饰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生命周期改变。文章来源地址https://www.toymoban.com/news/detail-739352.html

demo2：

import 'package:flutter/material.dart';

import 'package:flutter/material.dart';

//MaterialApp 和 Scaﬀold两个组件装饰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);

  @override
  Widget 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),
        ),
      ),
    );
  }

}

到了这里，关于Flutter 01 目录结构入门的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！