marginTop不适用于ConstraintLayout和wrap_content

Question

在我的片段中，我有一个layout_height="wrap_content"的ConstraintLayout，我希望在视图底部的两个底部之间有一个边距。

当我将此边距添加为layout_marginBottom到上方按钮（ button_welcome_signup ）时，它似乎工作正常。但是，如果我尝试将其添加到底部按钮（ button_welcome_signin ）为layout_marginTop，则它无效。

有人知道这里的问题是什么/如果做错了吗？

（请注意，我使用wrap_content是有原因的，而且我非常想在底部按钮上使用边距，因此我可以将其添加到其样式中，以便在我的项目中实现更好的UI一致性）。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:MyAppApp="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
    android:background="@color/white"
    android:minHeight="@dimen/min_height_welcome_frame"
    android:padding="@dimen/margin_all_frame_inner">

    <ImageView
        android:id="@+id/imageview_welcome_logo"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:adjustViewBounds="true"
        android:scaleType="fitCenter"
        android:src="@drawable/logo_header"
        MyAppApp:layout_constraintTop_toTopOf="parent"
        MyAppApp:layout_constraintLeft_toLeftOf="parent"
        MyAppApp:layout_constraintRight_toRightOf="parent" />

    <TextView
        android:id="@+id/textiew_welcome_title"
        style="@style/MyAppTextViewTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/margin_all_component_l"
        android:text="@string/welcome_title"
        MyAppApp:layout_constraintTop_toBottomOf="@id/imageview_welcome_logo" />

    <TextView
        android:id="@+id/textview_welcome_text"
        style="@style/MyAppTextViewText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/welcome_message"
        MyAppApp:layout_constraintTop_toBottomOf="@id/textiew_welcome_title" />

    <Button
        android:id="@+id/button_welcome_signin"
        style="@style/MyAppSubButton"
        android:layout_width="match_parent"
        android:layout_height="46dp"
        android:layout_marginTop="@dimen/margin_all_component_s" 
        android:text="@string/welcome_sign_in"
        MyAppApp:layout_constraintBottom_toBottomOf="parent" />

    <Button
        android:id="@+id/button_welcome_signup"
        style="@style/MyAppButton"
        android:layout_width="match_parent"
        android:layout_height="46dp"
        android:layout_marginTop="@dimen/margin_all_component_l"
        android:text="@string/welcome_sign_up"
        MyAppApp:layout_constraintBottom_toTopOf="@id/button_welcome_signin"
        MyAppApp:layout_constraintTop_toBottomOf="@id/textview_welcome_text"
        MyAppApp:layout_constraintVertical_bias="1" />

</android.support.constraint.ConstraintLayout>

styles.xml：

<style name="MyAppButton" parent="Widget.AppCompat.Button">
    <item name="android:background">@drawable/button_selector_blue</item>
    <item name="android:textSize">@dimen/textsize_all_l</item>
    <item name="android:textColor">@color/white</item>
    <item name="fontFamily">@font/my_sans_serif_regular</item>
</style>

<style name="MyAppSubButton" parent="Widget.AppCompat.Button">
    <item name="android:background">@drawable/button_selector_transparent</item>
    <item name="android:textSize">@dimen/textsize_all_l</item>
    <item name="android:textColor">@color/turquoise_blue</item>
    <item name="fontFamily">@font/my_sans_serif_regular</item>
</style>

提前感谢您的帮助。

Answer 1

在ConstraintLayout范围内，子视图的边距仅在该边被约束到另一个视图时才会生效。在原始示例中，顶部按钮的下边距有效，因为顶部按钮具有底部约束：

MyAppApp:layout_constraintBottom_toTopOf="@id/button_welcome_signin"

但是，底部按钮的上边距不起作用，因为底部按钮的顶部没有约束。

如果您想在底部按钮上使用上边距，请添加此约束：

MyAppApp:layout_constraintTop_toBottomOf="@+id/button_welcome_signup"

请注意，您将还通过将此属性添加到顶部按钮来更新链样式（因为此新约束会创建链）：

MyAppApp:layout_constraintVertical_chainStyle="packed"

Answer 2

试试这个

<Button
    android:id="@+id/button_welcome_signin"
    style="@style/MyAppSubButton"
    android:layout_width="match_parent"
    android:layout_height="46dp"
    android:layout_marginTop="16dp"
    android:text="@string/welcome_sign_in"
    MyAppApp:layout_constraintBottom_toBottomOf="parent"
    MyAppApp:layout_constraintEnd_toEndOf="parent"
    MyAppApp:layout_constraintStart_toStartOf="parent"
    MyAppApp:layout_constraintTop_toBottomOf="@+id/button_welcome_signup" />

Answer 3

第一张图片我的代码上删除了边距

第二张图片在左，右，上，下

添加了边距

Answer 4

<Button
        android:id="@+id/SaveBtnId"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/Save"
        android:layout_marginTop="16dp"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_marginLeft="16dp"
        app:layout_constraintLeft_toLeftOf="parent"
        android:layout_marginRight="16dp"
        app:layout_constraintRight_toRightOf="parent"
         />

Answer 5

我花了一段时间才弄清楚我在想这个错误的方式，所以也许会对别人有所帮助。

在ConstraintLayout中，它从约束中获取一个边距 。

换句话说，假设您有两个相邻的按钮。

右边的一个约束为StartToEnd，TopToTop和BottomToBottom到左边的约束。

如果给右手一个marginBottom，则不会将其下方的内容向下推，而会将其自身从第一个按钮的底部向上推。边距位于其约束的底线和底线之间，而不是屏幕上的所有视图之间。

Answer 6

如果有人遇到与我相同的问题，请尝试在另一个视图（即ImageView）的底部使用一个像match_parent的View（RecyclerView）。但是，即使我在我的ImageView高度尺寸的RecyclerView中放置了top_margin，RecycleView仍与我的ImageView重叠。

解决方案： 设置- android：layout_height =“ 0dp” -对我来说很棒。 解释如下。

MATCH_PARENT无法正常工作

<View
    android:id="@+id/view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"/>

任何视图都应应用其父视图组的属性规则。 ConstraintLayout支持使用“ 0dp”值（match_constraint）而不是“ match_parent”来获取匹配父行为。因此，永远不要在ConstraintLayout中使用“ match_parent”！

我从这里得到的... https://medium.com/@jemli.idea/constraintlayout-never-ever-97c121286100

Answer 7

我同时使用android:margin_vertical和android:margin_top，这里以margin_vertical为准。

问题也可能与android:margin一起发生

Answer 8

android:layout_marginTop="@dimen/_10sdp"