Flutter UI基础- padding,margin

今天我们来看一下UI布局中常用的东西,padding,margin

    这两个属性还是比较好理解,首先,我们要知道,在哪些widget 中有这两个属性。

Container

Container


Container

在属性中可以清晰的看到 padding,margin 两个属性。

我们来详细了解一下这两个属性的作用效果。

通过代码,还是截图的方式给大家展示效果。

首先上代码:

padding 代码

代码效果

效果

很明显,这里的效果 可以清楚的看到 padding 的效果,是  修改的子控件child 在父控件上的内边距。

接下来看一下

margin

代码部分

代码部分

代码效果

代码效果

很明显,效果不会印象内部空间的位置,而是 修改当前控件在父控件 上的内边距 (修改的是自己)

经过这两个测试,能清楚的明白padding 和margin 的区别是效果。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,790评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,610评论 1 45
  • Bootstrap是什么? 一套易用、优雅、灵活、可扩展的前端工具集--BootStrap。GitHub上介绍 的...
    凛0_0阅读 10,917评论 3 184
  • 听说 你能感受四季变化 我不能 听说 你能尝出酸甜苦辣 我还是不能 听说 你掌握了喜怒哀乐 我依然不能 听说 你享...
    杨那么阅读 217评论 3 3
  • 雪山独行阅读 503评论 0 0