例002-StatelessWidget-（Learning Flutter Day 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

テストアドレス：
デモ