Flutter基础—常用控件之容器

概述Container控件即容器，是一个常用的控件，基础容器的实例： import 'package:flutter/material.dart';class ContainerDemo extends StatelessWidget { @override Widget build(BuildContext context) { return new Center( c

Container控件即容器，是一个常用的控件，基础容器的实例：

import 'package:Flutter/material.dart';class ContainerDemo extends StatelessWidget {  @overrIDe  Widget build(BuildContext context) {    return new Center(      child: new Container(        wIDth: 128.0,height: 128.0,decoration: new Boxdecoration(          color: colors.lightBlueAccent[100],),);  }}voID main() {  runApp(    new MaterialApp(      Title: 'Flutter教程',home: new ContainerDemo(),);}

ContainerDemo是一个无状态控件。Center控件使子控件在其内部水平和垂直居中，在上面实例中，Center控件使Container控件在其内部水平和垂直居中。Container控件通过wIDth属性设置宽度为128，通过height属性设置高度为128。又通过decoration属性创建一个Boxdecoration对象，Boxdecoration对象描述如何绘制容器，在上面实例中，Boxdecoration对象通过backgroundcolor属性为容器设置背景颜色。

class ContainerDemo extends StatelessWidget {  @overrIDe  Widget build(BuildContext context) {    return new Center(      child: new Container(        wIDth: 300.0,height: 400.0,decoration: new Boxdecoration(          color: const color(0xfffce5cd),border: new border.all(            color: const color(0xff6d9eeb),wIDth: 8.0,child: new Text('容器演示'),);  }}

修改ContainerDemo控件的代码，设置border属性给容器添加边框。并创建border对象，通过color属性为边框添加颜色，通过wIDth属性为边框设置宽度。上面实例中的颜色”0xff“+”6d9eeb“，相当于#6d9eeb。最后还在容器内添加了一个Text控件，即文本控件。

总结

以上是内存溢出为你收集整理的Flutter基础—常用控件之容器全部内容，希望文章能够帮你解决Flutter基础—常用控件之容器所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。