首页 > 其他 > 详细

Flutter 容器类组件:填充(padding)

时间:2019-12-30 14:10:25      阅读:98      评论:0      收藏:0      [点我收藏+]

前言

Padding可以给其子节点添加填充(留白)。

接口描述

class EdgeInsets extends EdgeInsetsGeometry {
  // 分别指定四个方向的填充
  const EdgeInsets.fromLTRB(this.left, this.top, this.right, this.bottom);
  // 所有方向均使用相同数值的填充
  const EdgeInsets.all(double value)
    : left = value,
      top = value,
      right = value,
      bottom = value;
  // 可以设置具体某个方向的填充(可以同时指定多个方向)。
  const EdgeInsets.only({
    this.left = 0.0,
    this.top = 0.0,
    this.right = 0.0,
    this.bottom = 0.0,
  });
  // 用于设置对称方向的填充,vertical指top和bottom,horizontal指left和right。
  const EdgeInsets.symmetric({
    double vertical = 0.0,
    double horizontal = 0.0,
  }) : left = horizontal,
       top = vertical,
       right = horizontal,
       bottom = vertical;

代码示例

// 填充(padding)


import 'package:flutter/material.dart';

class PaddingTestRoute extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Padding(
      // 上下左右各添加16像素补白
      padding: EdgeInsets.all(16.0),
      child: Column(
        // 显式指定对齐方式为左对齐,排除对齐干扰
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Padding(
            // 左边添加8像素补白
            padding: const EdgeInsets.only(left: 8.0),
            child: Text('Hello world',style: TextStyle(color: Colors.blue),),
          ),
          Padding(
            //
            padding: EdgeInsets.symmetric(vertical: 8.0),
            child: Text('I am Hah',style: TextStyle(color: Colors.yellow),),
          ),
          Padding(
            // 分别指定四个方向的补白
            padding: EdgeInsets.fromLTRB(20.0, 20.0, 20.0, 20.0),
            child: Text('Your Dear',style: TextStyle(color: Colors.red),),
          ),

        ],
      ),
    );

  }
}

总结

暂无。

Flutter 容器类组件:填充(padding)

原文:https://www.cnblogs.com/parzulpan/p/12118811.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!