Flutter框架的衬垫、行、列和扩展组件

1.填充组件可以为html中的常见布局标记使用填充属性，但Flutter中的许多小部件没有填充属性。此时，我们可以使用填充组件来处理容器和子元素之间的直接间距。

通用属性：

1.填充边距值；

2.子组件；

代码示例：

import'包装：颤振/材料.飞镖'；

void main（）{

；runApp（MyApp（））；

}

//分离为单个组件

类MyApp扩展StatelessWidget{

@推翻

；小部件构建（BuildContext上下文）{

 nbsp； ；返回MaterialApp(

 nbsp； ； ； ；家：脚手架(

 nbsp； ； ； ； ； ；//导航栏

 nbsp； ； ； ； ； ；appBar:appBar（标题：文本（“Flutter App”）），

 nbsp； ； ； ； ； ；//主题

 nbsp； ； ； ； ； ；body:HomeContent（），

 nbsp； ； ； ；），

 nbsp； ； ； ；主题：主题数据（primarySwatch:Cours.yellow），

 nbsp； ；）；

}

}

//使用边距

类HomeContent扩展StatelessWidget{

@推翻

；小部件构建（BuildContext上下文）{

 nbsp； ；返回填充(

 nbsp； ； ； ；//在整个容器的右侧添加内边距

 nbsp； ； ； ；padding:边缘插入。来自LTRB（0,0,10,0），

 nbsp； ； ； ；子项：GridView.count(

 nbsp； ； ； ； ； ；//在一行中定义多个列

 nbsp； ； ； ； ； ；交叉轴计数：2，

 nbsp； ； ； ； ； ；//长宽比

 nbsp； ； ； ； ； ；childAspectRatio：1.7，

 nbsp； ； ； ； ； ；子项：[

 nbsp； ； ； ； ； ； ； ；衬垫(

 nbsp； ； ； ； ； ； ； ； ； ；//定义左上内边距

 nbsp； ； ； ； ； ； ； ； ； ；padding:EdgeInsets。来自LTRB（10，10，0，0），

 nbsp； ； ； ； ； ； ； ； ； ；//子元素

 nbsp； ； ； ； ； ； ； ； ； ；child:图像。网络（“https://www.itying.com/images/flutter/1.png" ;, 配合：盒配合盖）

 nbsp； ； ； ； ； ； ； ；），

 nbsp； ； ； ； ； ； ； ；衬垫(

 nbsp； ； ； ； ； ； ； ； ； ；padding:EdgeInsets。来自LTRB（10，10，0，0），

 nbsp； ； ； ； ； ； ； ； ； ；child:图像。网络（“https://www.itying.com/images/flutter/2.png" ;, 配合：盒配合盖）

 nbsp； ； ； ； ； ； ； ；），

 nbsp； ； ； ； ； ； ； ；衬垫(

 nbsp； ； ； ； ； ； ； &