标签:debug pre vsc xtend 项目 界面 center bar material
在你的电脑上找一个喜欢的位置,建立一个文件夹。
flutter create 项目名
注意: flutter
建议使用下划线的这种命名方式。
当看到ALL Done
字样的时候,就说明项目建立好了。然后进入VSCode
,打开项目文件夹,可以看到项目的结构了。
然后进入lib
目录下,可以看到一个main.dart
文件,打开这个文件,清空原有代码,写入下面的代码,
import ‘package:flutter/material.dart‘; void main()=>runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return Container( child: MaterialApp( title:‘百姓生活+‘, debugShowCheckedModeBanner: false, theme: ThemeData( primaryColor:Colors.pink ), home:IndexPage() ), ); } }
在lib
目录下建立一个pages
目录,这个目录主要放置项目所用的所有UI界面的文件,在page目录下,建立index_page.dart
文件。
import ‘package:flutter/material.dart‘; class IndexPage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text(‘百姓生活+‘),), body: Center( child:Text(‘ 百姓生活+‘) ), ); } }
代码写完后,记得在main.dart
(入口文件),用impoart
引入index_page.dart
文件。
import ‘./pages/index_page.dart‘;
这时候在终端里运行Flutter run
就可以看到效果了,
标签:debug pre vsc xtend 项目 界面 center bar material
原文地址:https://www.cnblogs.com/joe235/p/11495363.html