第002例-StatelessWidget-(学习Flutter第1天)

在这里插入图片描述

1. 创建项目

使用命令创建项目

flutter create example002_statelesswidget

2. AS打开项目

3. 修改main.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget
{
  @override
  Widget build(BuildContext context) {

    return MaterialApp(
      title: "StateLessWidget基础组件",
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(title: Text("StateLessWidget基础组件"),),
        body: Container(
          decoration: BoxDecoration(
            color: Colors.white
          ),
          child: Column(
            children: <Widget>[
              Text("I'm text",),
              Icon(Icons.android,size: 50,color: Colors.red,),
              CloseButton(),
              BackButton(),
              Chip(avatar:Icon(Icons.people),label: Text("测试文本"),),
              Divider(height: 10,indent: 10,color: Colors.green,),
              Card(
                color: Colors.blue,
                elevation: 5,
                margin: EdgeInsets.all(10),
                child: Text("I'm card"),
              )

            ],
          ),
        ),
      ),
    );
  }
  
}

在这里插入图片描述

4. 调试运行

AS中先打开Android或者iOS模拟器,点运行按钮。
或在命令行中运行:

flutter run

5. 打包web

flutter build web

测试地址:
演示

猜你喜欢

转载自blog.csdn.net/qiang2080/article/details/115094549