flutter 内边距组件padding、水平组件Row、垂直组件Column、自适应组件Expanded

内边距组件:
设置组件的内边距
	Padding(
		padding:EdgeInsets.all(n),
		child:组件
	)

水平组件:
子组件全都水平排列
	Row(
		mainAxisAlignment: MainAxisAlignment.spaceEvenly, 水平方向的布局方式,spaceEvenly元素与元素之间,首尾元素与父容器的距离均匀分配
        crossAxisAlignment: CrossAxisAlignment.center,  垂直方向布局方式
        children: <Widget>[...]    //Lisi<Widget>类型的容器
	)
	
垂直组件:
子组件全都垂直排列
	Column(
		mainAxisAlignment: MainAxisAlignment.spaceEvenly,  垂直方向的布局方式,spaceEvenly元素与元素之间,首尾元素与父容器的距离均匀分配
        crossAxisAlignment: CrossAxisAlignment.center,  水平方向布局方式
        children: <Widget>[...]    //Lisi<Widget>类型的容器
	)

自适应组件:
类似flex布局中设置flex的值使得元素按占比布局
	Expanded(
		flex:n,   子组件占父元素的比例
		child:组件
	)

代码示例:

import "package:flutter/material.dart";

void main()
{
  runApp(App());
}

class App extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      home:Scaffold(appBar: AppBar(title: Text("hh")),
        body:Home4()
      )
      ,);
  }
}

class Home extends StatelessWidget{
  List<Widget> _get()
{
  List<Widget> list=new List();
  for(int i=0;i<10;i++)
  {
    list.add(Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,));
  }

  return list;
}
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return GridView.count(
      crossAxisCount: 2,
      children:<Widget>[
        Padding(
          padding: EdgeInsets.fromLTRB(10,10,10,20),  
          child:Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue) ,
        ),
        Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,),
        Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,),
        Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,),
        Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,),
        Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,),
        Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,),

      ],
    );
  }
}

class Home2 extends StatelessWidget{
  List<Widget> _get()
{
  List<Widget> list=new List();
  for(int i=0;i<10;i++)
  {
    list.add(Container(height:400.0,child: Text("拉拉"),alignment: Alignment.center,color: Colors.blue,));
  }

  return list;
}
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly, //水平方向的布局方式,spaceEvenly元素与元素之前,首尾元素与父容器的距离均匀分配
        crossAxisAlignment: CrossAxisAlignment.center, //垂直方向布局方式
        children: <Widget>[
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),          
        ],
      );
  }
}

class Home3 extends StatelessWidget{

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly, //垂直方向的布局方式,spaceEvenly元素与元素之前,首尾元素与父容器的距离均匀分配
        crossAxisAlignment: CrossAxisAlignment.center, //水平方向布局方式
        children: <Widget>[
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),          
        ],
      );
  }
}

class Home4 extends StatelessWidget{

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Row(
    
        children: <Widget>[
          Expanded(
            flex:1,
            child:Container(
              height: 100.0,
              width: 100.0,
              color:Colors.blue,
              child: Icon(Icons.home,size:32,color:Colors.white),
              ),  
          ),

          Expanded(
            flex:2,
            child:Container(
              height: 100.0,
              width: 100.0,
              color:Colors.orange,
              child: Icon(Icons.home,size:32,color:Colors.white),
              ),  
          ),
          Container(
            height: 100.0,
            width: 100.0,
            color:Colors.blue,
            child: Icon(Icons.home,size:32,color:Colors.white),
          ),       
        ],
      );
  }
}