flutter基础（常用控件）- 四

Container控件---容器

import 'package:flutter/material.dart';

void main(){
  runApp(new MaterialApp(
    title: "flutter容器container",
    home: new ContainerDemo(),
  ));
}


class ContainerDemo extends StatelessWidget{

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new Center(
      child: new Container(
        width: 80.0,
        height: 80.0,
        decoration: new BoxDecoration(
          color: Colors.lightBlueAccent[100],
        ),
      ),
    );
  }
}

通过decoration属性创建一个BoxDecoration对象，BoxDecoration对象描述如何绘制容器（如：添加边框，颜色等）

 

Text控件 -- 文本

import 'package:flutter/material.dart';

void main(){
  runApp(new MaterialApp(
    title: "flutter控件-文本",
    home: new ContainerDemo(),
  ));
}

class ContainerDemo extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("文本控件"),
      ),
      body: new Column(
        children: [
          new Text(
            "文本控件一",
            style: new TextStyle(
              color: const Color(0xffff0000),
              decoration: TextDecoration.lineThrough,
              decorationColor: const Color(0xff000000),
              fontSize: 25.0,
            ),
          ),
          new Text(
            '橙色+下划线+24号',
            style: new TextStyle(
              color: const Color(0xffff9900),
              decoration: TextDecoration.underline,
              fontSize: 24.0,
            ),
          ),
          new Text(
            '虚线上划线+23号+倾斜',
            style: new TextStyle(
              decoration: TextDecoration.overline,
              decorationStyle: TextDecorationStyle.dashed,
              fontSize: 23.0,
              fontStyle: FontStyle.italic,
            ),
          ),
        ],
      ),
    );
  }
}

 

Image  -- 图片控件

• new Image，用于从ImageProvider获取图像。
• new Image.asset，用于使用key从AssetBundle获取图像。
• new Image.network，用于从URL地址获取图像。
• new Image.file，用于从File获取图像。

import 'package:flutter/material.dart';

void main(){
  runApp(new MaterialApp(
    title: "flutter控件-图片",
    home: new ImageDemo(),
  ));
}
class ImageDemo extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("image图片控件"),
      ),
      body: new Center(
        child: new Image.network( 'http://pic.baike.soso.com/p/20130828/20130828161137-1346445960.jpg',//网络地址
          scale: 2.0,),
      ),
    );
  }
}