美文网首页工作生活
【Flutter】Text Widget 的使用

【Flutter】Text Widget 的使用

作者: 阿克西亚 | 来源:发表于2019-07-01 20:12 被阅读0次

本博文为跟随【技术胖】前辈学习谷歌移动UI框架【Flutter】的笔记
前辈的个人主页网址如下:
首页 | 技术胖-胜洪宇关注web前端技术-前端免费视频第一博客
前辈的视频教程网址如下:
Flutter基础视频教程

代码示例

import 'package:flutter/material.dart';
void main()=>runApp(MyApp());
class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context){
    return MaterialApp(
      title: 'Tomato Clock',
      home:Scaffold(
        body:Center(
          child: Container(
            child: Text(
                'Tomato Clock', 
                style: TextStyle(
                    fontSize: 40.0
                )
            ),
            //container的布局定位
            alignment: Alignment.center,
            //container的长宽
            width: 500.0,
            height: 400.0,
            //container的内外边距
            padding: const EdgeInsets.all(10),
            margin: const EdgeInsets.all(10),
            //container的背景颜色
            //color:Color.fromARGB(255, 112, 112, 112),
            //设置容器的装饰
            decoration: BoxDecoration(
              //设置渐变色,与color冲突
              gradient: const LinearGradient(
                  colors: [
                    Colors.lightBlue,
                    Colors.greenAccent,
                    Colors.purple
                  ]
              ),
              //外边框
              border:Border.all(width: 5,color: Colors.red),
            ),
          ),
        ),
      ),
    );
  }
}

相关文章

网友评论

    本文标题:【Flutter】Text Widget 的使用

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