美文网首页工作生活
flutter-布局-position

flutter-布局-position

作者: iPhone | 来源:发表于2019-07-03 16:32 被阅读0次

    控件对齐 Padding Align Center

    import 'package:flutter/material.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
     // This widget is the root of your application.
     @override
     Widget build(BuildContext context) {
       return MaterialApp(
         title: 'Flutter Demo',
         theme: ThemeData(
           primarySwatch: Colors.blue,
         ),
         home: Scaffold(
           appBar: AppBar(
             title: Text('布局控件 - Container'),
           ),
           body: Container(
    //          color: Colors.yellow,
             width: 300,
             height: 300,
             margin: EdgeInsets.fromLTRB(30, 30, 0, 0),
             decoration: BoxDecoration(
               color: Colors.yellow,
                 border: Border.all(
                   width: 2.0,
                   color: Colors.red,
                 )
             ),
    //          child: Text("content",style: TextStyle(backgroundColor: Colors.green),), //基本
    //        child: Padding(
    //          padding: EdgeInsets.fromLTRB(20, 40, 0, 0),
    //          child:  Text("content",style: TextStyle(backgroundColor: Colors.green),), //padding
    //        ),
           child: Align(
    //          alignment: Alignment(1, 1),
    //        alignment: Alignment.center,
             widthFactor: 4,
             heightFactor: 4,
             child: Text("content",style: TextStyle(backgroundColor: Colors.green),),
           ),
           ),
         ),
       );
     }
    }
    
    当widthFactor和heightFactor为null的时候,当其有限制条件的时候,Align会根据限制条件尽量的扩展自己的尺寸,当没有限制条件的时候,会调整到child的尺寸;
    当widthFactor或者heightFactor不为null的时候,Aligin会根据factor属性,扩展自己的尺寸,例如设置widthFactor为2.0的时候,那么,Align的宽度将会是child的两倍
    ***widthFactor***:宽度因子,如果设置的话,Align的宽度就是child的宽度乘以这个值,不能为负数。
    
    widthFactor:宽度因子,如果设置的话,Align的宽度就是child的宽度乘以这个值,不能为负数。
    heightFactor:高度因子,如果设置的话,Align的高度就是child的高度乘以这个值,不能为负数。
    
    Center继承自Align,只不过是将alignment设置为Alignment.center,其他属性例如widthFactor、heightFactor,布局行为,都与Align完全一样,在这里就不再单独做介绍了。Center源码如下,没有设置alignment属性,是因为Align默认的对齐方式就是居中
    

    相关文章

      网友评论

        本文标题:flutter-布局-position

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