Android - 限制布局内另一个约束布局背景不显示

Question

我正在开发一个Android活动，我想要一个标题，并在标题下的内容。我想要将背景图像放在内容上，而不是标题上。

从图片中可以看到我的形象也streched在屏幕上，这是我不希望的标识部。

这里是我当前布局的XML：

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@drawable/background_11" 
    tools:context=".login.LoginActivity" 
    > 

    <ImageView 
     android:id="@+id/logo" 
     android:layout_width="381dp" 
     android:layout_height="156dp" 
     android:src="@drawable/logo" 
     tools:ignore="ContentDescription" 
     app:layout_constraintTop_toBottomOf="parent" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     android:layout_marginTop="-480dp" 
     android:layout_marginRight="10dp" 
     android:layout_marginLeft="10dp" 
     android:layout_marginStart="10dp" 
     android:layout_marginEnd="10dp" 
     app:layout_constraintHorizontal_bias="0.47" /> 

    <ImageView 
     android:id="@+id/emptyImage" 
     android:layout_width="384dp" 
     android:layout_height="445dp" 
     android:layout_marginBottom="0dp" 
     android:layout_marginRight="0dp" 
     android:layout_marginTop="0dp" 
     android:background="@color/TICK_BACKGROUND" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toBottomOf="@+id/logo" 
     app:layout_constraintVertical_bias="0.0" 
     app:srcCompat="@drawable/empty" /> 

    <EditText 
     android:id="@+id/login_usernameTextField" 
     android:layout_width="291dp" 
     android:layout_height="63dp" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="8dp" 
     android:layout_marginTop="80dp" 
     android:background="@drawable/rounded_text_edit_shape" 
     android:ems="10" 
     android:hint="Username" 
     android:inputType="textPersonName" 
     android:textColor="@color/INPUT_TEXT_COLOR" 
     android:textColorHint="@color/iron" 
     android:textCursorDrawable="@null" 
     app:layout_constraintHorizontal_bias="0.506" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toBottomOf="@+id/logo" 
     android:layout_marginStart="8dp" 
     android:layout_marginEnd="8dp" /> 

    <EditText 
     android:id="@+id/login_passwordTextField" 
     android:layout_width="291dp" 
     android:layout_height="63dp" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="8dp" 
     android:layout_marginTop="-38dp" 
     android:background="@drawable/rounded_text_edit_shape" 
     android:ems="10" 
     android:hint="Password" 
     android:textCursorDrawable="@null" 
     android:inputType="textPassword" 
     android:textColor="@color/INPUT_TEXT_COLOR" 
     android:textColorHint="@color/iron" 
     app:layout_constraintHorizontal_bias="0.506" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toBottomOf="@+id/login_usernameTextField" 
     android:layout_marginStart="8dp" 
     android:layout_marginEnd="8dp" /> 

    <Button 
     android:id="@+id/login_loginButton" 
     android:onClick="loginButtonClick" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="8dp" 
     android:layout_marginTop="30dp" 
     android:background="@drawable/rounded_button_shape" 
     android:text="Log In" 
     android:textColor="@color/white" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toBottomOf="@+id/login_passwordTextField" 
     app:layout_constraintBottom_toBottomOf="parent" 
     android:layout_marginBottom="8dp" 
     app:layout_constraintVertical_bias="0.28" 
     android:layout_marginStart="8dp" 
     android:layout_marginEnd="8dp" /> 

</android.support.constraint.ConstraintLayout> 

我想过做父母布局和布局内添加页眉和包含内容的另一布局。然后设置内容布局内的背景像这样的：android:background="@drawable/background_11"

这里是我试过的代码：

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" android:layout_height="match_parent"> 




    <ImageView 
     android:id="@+id/logo" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentTop="true" 
     app:srcCompat="@drawable/logo_2" 
     app:layout_constraintTop_toTopOf="parent" 
     android:layout_marginTop="-1dp" 
     android:layout_marginLeft="0dp" 
     app:layout_constraintLeft_toLeftOf="parent" 
     android:layout_marginRight="8dp" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintHorizontal_bias="0.0" /> 

    <android.support.constraint.ConstraintLayout 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:background="@drawable/background_11" 
     app:layout_constraintTop_toBottomOf="@id/logo" 
     android:layout_marginLeft="8dp" 
     app:layout_constraintLeft_toLeftOf="parent"> 

    </android.support.constraint.ConstraintLayout> 
</android.support.constraint.ConstraintLayout> 

然而，我的背景没有显示出来。下面是reuslts：

Answer 1

我把它通过使线性布局内的约束布局工作：

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 


    <ImageView 
     android:id="@+id/imageView5" 
     android:layout_width="wrap_content" 
     android:layout_height="146dp" 
     app:srcCompat="@drawable/netset_logo_2" /> 

    <android.support.constraint.ConstraintLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:background="@drawable/background_11"> 

    </android.support.constraint.ConstraintLayout> 
</LinearLayout> 

不过我不明白为什么我的第一个解决方案工作。为什么不能在约束布局内添加约束布局？

Answer 2

您可以在其他ConstraintLayout中使用ConstraintLayout，但您需要遵守一些规则。 ConstraintLayout的所有直接孩子都应该对左，上，右，下都有约束。

我认为没有内部ConstraintLayout左右的约束，他有一个宽度和高度等于0dp，他不显示。

你有没有尝试添加约束左和rigth到你的内部ConstraintLayout？

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" android:layout_height="match_parent"> 

    <ImageView 
     android:id="@+id/logo" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentTop="true" 
     app:srcCompat="@drawable/logo_2" 
     app:layout_constraintTop_toTopOf="parent" 
     android:layout_marginTop="-1dp" 
     android:layout_marginLeft="0dp" 
     app:layout_constraintLeft_toLeftOf="parent" 
     android:layout_marginRight="8dp" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintHorizontal_bias="0.0" /> 

    <android.support.constraint.ConstraintLayout 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:background="@drawable/background_11" 
     app:layout_constraintTop_toBottomOf="@id/logo" 
     android:layout_marginLeft="8dp" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintLeft_toLeftOf="parent"> 

    </android.support.constraint.ConstraintLayout> 
</android.support.constraint.ConstraintLayout> 

希望这会有所帮助。

Answer 3

很自然地，你使约束布局占据了整个屏幕，而Logo占据了它的一个较小的子集。 因此，您的屏幕上有徽标，背景下方有徽标。 您可能需要在主约束布局内的不同子布局上设置“背景”。

像这样

<constraintlayout 
width:match_parent 
height:match_parent> 
    <logo here/> 
    <constraintlayout 
    background_here> 
    <constraintlayout/> 
<constraintlayout/> 

希望这是有道理的。