美文网首页
Flutter笔记2-Container组件

Flutter笔记2-Container组件

作者: 叶小七的真命天子 | 来源:发表于2019-01-17 10:15 被阅读10次
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'WELCOME',
        home: Scaffold(
            appBar: AppBar(
              title: Text('welcome to Flutter'),
            ),
            body: Center(
              child: Container(
                child: Text('我是XXX',style: TextStyle(fontSize: 40.0),),
                width: 500.0,
                height: 400.0,
                alignment: Alignment.topLeft, // child内容对齐方式
                padding: const EdgeInsets.fromLTRB(10.0, 20.0, 10.0, 30.0), // padding 左上右下的顺序
                margin: const EdgeInsets.all(10.0), // 所有的4个方向
                decoration: new BoxDecoration( 
                  gradient: LinearGradient(  // 设置线性渐变
                    colors: [Colors.lightBlue,Colors.greenAccent,Colors.pink]
                  ),
                  border: Border.all(width: 12.0,color: Colors.yellow), //设置边框
                ),
              )
            ),
        ),
    );
  }
}

效果如下:

image.png

相关文章

网友评论

      本文标题:Flutter笔记2-Container组件

      本文链接:https://www.haomeiwen.com/subject/ypvbdqtx.html