视图的填充和边距之间的区别
Posted
技术标签:
【中文标题】视图的填充和边距之间的区别【英文标题】:Difference between a View's Padding and Margin 【发布时间】:2011-06-04 22:18:13 【问题描述】:View 的 Margin 和 Padding 有什么区别?
【问题讨论】:
边距在边框内,边距在外。有关详细信息,请参阅W3C Box model。 This blog post 更具可读性,不过 :-) 这可能会有所帮助Declaring Layout 这和 html 一样,更多请看这里***.com/questions/2189452/… 查看我对类似问题的回答***.com/questions/21959050/… 【参考方案1】:为了帮助我记住填充物的含义,我想到了一件带有很多厚棉垫的大外套。我在我的外套里面,但我和我的棉大衣是在一起的。我们是一个整体。
但要记住margin,我会想到,“嘿,给我一些margin!”这是我和你之间的空白。不要进入我的舒适区——我的边缘。
为了更清楚,这是TextView
中的填充和边距图片:
上图的xml布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical" >
<TextView
android:layout_
android:layout_
android:layout_margin="10dp"
android:background="#c5e1b0"
android:textColor="#000000"
android:text="TextView margin only"
android:textSize="20sp" />
<TextView
android:layout_
android:layout_
android:layout_margin="10dp"
android:background="#f6c0c0"
android:textColor="#000000"
android:text="TextView margin only"
android:textSize="20sp" />
<TextView
android:layout_
android:layout_
android:background="#c5e1b0"
android:padding="10dp"
android:textColor="#000000"
android:text="TextView padding only"
android:textSize="20sp" />
<TextView
android:layout_
android:layout_
android:background="#f6c0c0"
android:padding="10dp"
android:textColor="#000000"
android:text="TextView padding only"
android:textSize="20sp" />
<TextView
android:layout_
android:layout_
android:layout_margin="10dp"
android:background="#c5e1b0"
android:textColor="#000000"
android:padding="10dp"
android:text="TextView padding and margin"
android:textSize="20sp" />
<TextView
android:layout_
android:layout_
android:layout_margin="10dp"
android:background="#f6c0c0"
android:textColor="#000000"
android:padding="10dp"
android:text="TextView padding and margin"
android:textSize="20sp" />
<TextView
android:layout_
android:layout_
android:background="#c5e1b0"
android:textColor="#000000"
android:text="TextView no padding no margin"
android:textSize="20sp" />
<TextView
android:layout_
android:layout_
android:background="#f6c0c0"
android:textColor="#000000"
android:text="TextView no padding no margin"
android:textSize="20sp" />
</LinearLayout>
相关
Gravity vs layout_gravity Match_parent vs wrap_content【讨论】:
【参考方案2】:Padding 是边框内,边框和实际视图内容之间的空间。请注意,填充完全围绕内容:顶部、底部、右侧和左侧都有填充(可以是独立的)。
边距 是边框外的空间,位于边框和该视图旁边的其他元素之间。在图像中,边距是整个对象之外的灰色区域。请注意,与填充一样,边距完全围绕内容:顶部、底部、右侧和左侧都有边距。
一张图片超过 1000 个字(摘自Margin Vs Padding - CSS Properties):
【讨论】:
答案是 HTML/CSS,问题是关于 Android。 Android 的视图模型受 HTML 启发,但并不完全相同。一方面,边框不是一个一流的大型对象。 注意:在 Android 中,layout_width 属性包括内容和填充。 (在 HTML 中,css width 属性仅指内容宽度。)正如 Seva 所说,Android 没有内置的边框概念。您可以使用 9-patch png 背景或 xml 矢量 drawable 在 Android 中添加边框。 另外值得注意的是,背景是根据边距而不是内边距修改的(在Android中)。 在Android中,这里所说的“边框”,实际上是“视图容器”。这应该澄清一些我希望的事情。 总的来说,我同意关于图像和 1K 字的说法,但这里的传说破坏了清晰度。相反,单词 Margin 可以在蓝色区域内,而单词 Padding 在黄色区域内。那么这句话就适用了。就目前而言,对我来说,接受的答案中与外套的文字类比比这里的图像更清晰,不到 1K 字:-) 事实上,图像甚至是错误的。文本 Content 周围的白色是 Padding 的一部分。【参考方案3】:Padding 在 View 内。
边距在视图之外。
这种差异可能与背景或尺寸属性有关。
【讨论】:
【参考方案4】:内边距在视图内,边距在外。填充可用于所有视图。根据视图的不同,内边距和边距之间可能存在视觉差异,也可能不存在。
例如,对于按钮,特征按钮背景图像包括内边距,但不包括边距。换句话说,添加更多的 padding 会使按钮在视觉上看起来更大,而添加更多的 margin 只会使按钮和下一个控件之间的差距更大。
另一方面,对于TextView
s,padding 和 margin 的视觉效果是相同的。
margin 是否可用取决于视图的容器,而不是视图本身。在LinearLayout
中支持边距,在AbsoluteLayout
中(现在认为已过时) - 不支持。
【讨论】:
【参考方案5】:下图让你了解内边距和边距-
【讨论】:
【参考方案6】:填充是指小部件和小部件原始框架之间的空间。但是边距是小部件的原始框架与其他小部件的框架之间的空间。。
【讨论】:
【参考方案7】:填充
Padding 在 View 内部。例如,如果你给了 android:paddingLeft=20dp
,那么 view 里面的项目将从左到右排列为 20dp
宽度。你也可以使用 paddingRight
,paddingBottom
,paddingTop
分别从右侧、底部和顶部提供填充。
保证金
保证金在View
之外。例如,如果你给android:marginLeft=20dp
,那么视图将从左到右排列在20dp
之后。
【讨论】:
【参考方案8】:填充是边框与实际图像或单元格内容之间的边框内的空间。 边距是边界外、边界和该对象旁边的其他元素之间的空间。
【讨论】:
【参考方案9】:有时您可以通过仅使用填充或边距来获得相同的结果。示例:
说视图 X 包含视图 Y(又名:视图 Y 在视图 X 内)。
-Margin=30 的视图 Y 或 Padding=30 的视图 X 将获得相同的结果:视图 Y 的偏移量为 30。
【讨论】:
【参考方案10】:除了上述所有正确答案之外,另一个区别是 padding 增加了视图的可点击区域,而 margins 增加了视图的可点击区域不是。如果您有一个较小的可点击图像但希望让点击处理程序宽容,这将非常有用。
例如,请看这张带有ImageView
(Android 图标)的布局图像,其中我将paddingBotton
设置为100dp
(图像是股票启动器mipmap ic_launcher
)。使用附加的点击处理程序,我能够点击图像外部和下方的方式并仍然注册点击。
【讨论】:
【参考方案11】:简单来说:
-
填充 - 在视图边框内创建空间。
Margin - 在视图边界之外创建空间。
【讨论】:
【参考方案12】:假设您在视图中有一个按钮,视图的大小为 200 x 200,按钮的大小为 50 x 50,按钮标题为 HT。现在margin和padding的区别是,你可以在view中设置button的margin,比如左边20,top 20,padding会调整button或者text view中的文本位置等等。 , padding 值从左边算起 20,所以会调整文字的位置。
【讨论】:
【参考方案13】:边距是指元素之外的额外空间。填充是指元素内的额外空间。边距是控件周围的额外空间。填充是控件内部的额外空间。
用白色填充很难看出margin和padding的区别,但是用彩色填充你可以看得很清楚。
【讨论】:
【参考方案14】:简单来说: padding 改变盒子的大小(有东西)。 边距改变不同框之间的间距
【讨论】:
【参考方案15】:填充用于在视图与其内容之间添加空白。
边距用于在不同视图之间添加空格。
对于 padding 和 margin,我们有两种方法来设置它们,
将所有边设置为相等值 根据要求设置侧面特定值具有相等值的所有边:
您可以使用android:padding="15dp"
设置所有边的内边距为 15dp
和android:layout_margin="15dp"
设置边距为15dp
具有特定值的边:
填充
android:paddingBottom
设置底部边缘的填充
android:paddingStart
设置起始边缘的内边距意味着在视图的左侧
android:paddingEnd
将边距设置在视图的右侧表示在端边
android:paddingTop
设置顶部边缘的填充
保证金
android:layout_marginBottom
指定此视图底部的额外空间。
android:layout_marginEnd
指定端侧的额外空间,表示此视图的右侧。
android:layout_marginStart
指定起始侧的额外空间,表示此视图的左侧。
android:layout_marginTop
指定此视图顶部的额外空间。
【讨论】:
以上是关于视图的填充和边距之间的区别的主要内容,如果未能解决你的问题,请参考以下文章