flutter 起步程序解析

flutter中的类对象不需要new 

1、导入
import 'package:flutter/material.dart';

2、main方法中调用runApp方法,参数是自定义的组件(类)

	void main(){
	  runApp(App());
	}
	
3、自定义组件需要继承StatelessWidget,并重写build方法,返回一个Widget组件
	其中
		返回组件一般设置为MaterialApp组件作为根容器,设置基本布局和顶部导航栏
			home:设置导航栏信息
			theme:设置主题,包括导航栏和屏幕边框
				其中
					导航栏和页面内容通过Scaffold设置
						appBar:设置顶部导航栏信息
						body:设置导航栏以下的内容

代码示例:

import 'package:flutter/material.dart';

void main(){
  runApp(App());
}

class App extends StatelessWidget{//继承无状态组件
  @override
  Widget build(BuildContext context) {
   
   //返回组件
    return MaterialApp(
      home:Scaffold(  //Scaffold设置当导航栏等组件   
        appBar: AppBar(  //顶部导航栏
        title:Text('flutter demo') //标题
        ),
        body:Home()   //主题  导航栏以下的内容
      ),
      theme:ThemeData(  //主题颜色,导航栏以及屏幕边框
        primarySwatch: Colors.yellow
      )
    );
  } 

}

//自定义内容组件
class Home extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    
    return Center( //居中组件
      child:Text(
        'hello world2',
        textDirection:TextDirection.ltr, //文字对齐方式
        style:TextStyle(fontSize: 40.0, //数字都是浮点类型,写整数要报错
            color:Colors.red
            //color:Color.fromRGBO(x,x,x,x)
         )
      )
    );
  }
}

效果图:
在这里插入图片描述

发布了670 篇原创文章 · 获赞 4 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/weixin_43294560/article/details/105437001