Android背景填充屏幕的一半

Question

如何获取约束布局以显示我的Shape可绘制对象，如下所示：

This is my designed.

And this is what i got.

<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"
tools:context=".MainActivity"
tools:layout_editor_absoluteY="81dp">

<ScrollView
    android:id="@+id/scrollViewDashBoard"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.0">

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

        <ImageView
            android:id="@+id/iconProfile"
            android:layout_width="45dp"
            android:layout_height="45dp"
            android:layout_marginStart="24dp"
            android:layout_marginTop="16dp"
            android:src="@drawable/baseline_face_white_18dp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="16dp"
            android:layout_marginEnd="8dp"
            android:onClick="intentLogin"
            android:text="@string/label_dashboard_login"
            android:textColor="@color/colorFontWhite"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.082"
            app:layout_constraintStart_toEndOf="@+id/iconProfile"
            app:layout_constraintTop_toTopOf="parent" />

        <android.support.constraint.ConstraintLayout
            android:id="@+id/constraintMenus"
            android:layout_width="340dp"
            android:layout_height="180dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="24dp"
            android:layout_marginEnd="8dp"
            android:background="@drawable/main_menu_radius"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.520"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/iconProfile">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <!--Row 1-->
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <!--Column 1-->
                    <android.support.v7.widget.CardView
                        android:layout_width="70dp"
                        android:layout_height="60dp"
                        android:layout_margin="16dp"
                        android:layout_weight="1"
                        android:elevation="8dp"
                        android:onClick="intentLocalExperience"
                        app:cardCornerRadius="8dp">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="vertical">

                            <ImageView
                                android:layout_width="45dp"
                                android:layout_height="45dp"
                                android:layout_gravity="center"
                                android:background="@drawable/cerclebackgroundyellow"
                                android:padding="5dp"
                                android:src="@drawable/ic_motorcycle_black_24dp" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:text="@string/label_local_experience"
                                android:textAlignment="center"
                                android:textSize="10dp" />

                        </LinearLayout>
                    </android.support.v7.widget.CardView>

                    <!--Column 2-->
                    <android.support.v7.widget.CardView
                        android:layout_width="70dp"
                        android:layout_height="60dp"
                        android:layout_margin="16dp"
                        android:layout_weight="1"
                        android:elevation="8dp"
                        android:onClick="intentFavoriteFood"
                        app:cardCornerRadius="8dp">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="vertical">

                            <ImageView
                                android:layout_width="45dp"
                                android:layout_height="45dp"
                                android:layout_gravity="center"
                                android:background="@drawable/cerclebackgroundpurple"
                                android:padding="5dp"
                                android:src="@drawable/ic_restaurant_black_24dp" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:text="@string/label_favorite_food"
                                android:textAlignment="center"
                                android:textSize="10dp" />

                        </LinearLayout>
                    </android.support.v7.widget.CardView>
                    <!--Column 3-->
                    <android.support.v7.widget.CardView
                        android:layout_width="70dp"
                        android:layout_height="60dp"
                        android:layout_margin="16dp"
                        android:layout_weight="1"
                        android:elevation="8dp"
                        app:cardCornerRadius="8dp">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:onClick="intentRecreation"
                            android:orientation="vertical">

                            <ImageView
                                android:layout_width="45dp"
                                android:layout_height="45dp"
                                android:layout_gravity="center"
                                android:background="@drawable/cerclebackgroundred"
                                android:padding="5dp"
                                android:src="@drawable/ic_landscape_black_24dp" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:text="@string/label_recreation"
                                android:textAlignment="center"
                                android:textSize="10dp" />

                        </LinearLayout>
                    </android.support.v7.widget.CardView>

                </LinearLayout>
                <!--Row 2-->
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <!--Column 1-->
                    <android.support.v7.widget.CardView
                        android:layout_width="70dp"
                        android:layout_height="60dp"
                        android:layout_margin="16dp"
                        android:layout_weight="1"
                        android:elevation="8dp"
                        app:cardCornerRadius="8dp">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="vertical">

                            <ImageView
                                android:layout_width="45dp"
                                android:layout_height="45dp"
                                android:layout_gravity="center"
                                android:src="@mipmap/ic_launcher_round" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:text="@string/label_travel_agency"
                                android:textAlignment="center"
                                android:textSize="10dp" />

                        </LinearLayout>
                    </android.support.v7.widget.CardView>
                    <!--Column 2-->
                    <android.support.v7.widget.CardView
                        android:layout_width="70dp"
                        android:layout_height="60dp"
                        android:layout_margin="16dp"
                        android:layout_weight="1"
                        android:elevation="8dp"
                        app:cardCornerRadius="8dp">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="vertical">

                            <ImageView
                                android:layout_width="45dp"
                                android:layout_height="45dp"
                                android:layout_gravity="center"
                                android:background="@drawable/cerclebackgroundgreen"
                                android:padding="5dp"
                                android:src="@drawable/ic_card_giftcard_black_24dp" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:text="@string/label_local_souvenir"
                                android:textAlignment="center"
                                android:textSize="10dp" />

                        </LinearLayout>
                    </android.support.v7.widget.CardView>
                    <!--Column 3-->
                    <android.support.v7.widget.CardView
                        android:layout_width="70dp"
                        android:layout_height="60dp"
                        android:layout_margin="16dp"
                        android:layout_weight="1"
                        android:elevation="8dp"
                        app:cardCornerRadius="8dp">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="vertical">

                            <ImageView
                                android:layout_width="45dp"
                                android:layout_height="45dp"
                                android:layout_gravity="center"
                                android:background="@drawable/cercle_background_bluegrey"
                                android:padding="5dp"
                                android:src="@drawable/ic_hotel_black_24dp" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:text="@string/label_guest_house"
                                android:textAlignment="center"
                                android:textSize="10dp" />

                        </LinearLayout>
                    </android.support.v7.widget.CardView>

                </LinearLayout>

            </LinearLayout>


        </android.support.constraint.ConstraintLayout>

    </android.support.constraint.ConstraintLayout>

</ScrollView>

我希望蓝色显示在我设计的位置。我试图在@ drawable / gradientbackground.xml文件中创建形状并将其设置为ConstraintLayout背景，但是收到的结果如图2所示。该怎么办？

Answer 1

您可以使用GradientDrawable来执行此操作。为背景使用多种颜色。 （而不是保留视图并以不同的方式应用背景色）

custom_background_gradient

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:bottom="120dp">
        <shape android:shape="rectangle" >
            <corners
                android:topRightRadius="8dip"
                android:topLeftRadius="8dip" />

            <gradient
                android:startColor="#47C8F8"
                android:endColor="#47C8F8"
                android:angle="270" />
        </shape>
    </item>
    <item android:top="120dp" >
        <shape android:shape="rectangle" >
            <corners
                android:bottomLeftRadius="8dip"
                android:bottomRightRadius="8dip" />

            <gradient
                android:startColor="#FFFFFF"
                android:endColor="#FFFFFF"
                android:angle="270" />
            <size android:height="30dp" />
        </shape>
    </item>
</layer-list>

将此自定义背景应用于ConstraintLayoutlayout

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

现在它将显示顶部的天蓝色（＃47C8F8）和下面的白色。您可以根据需要修改代码

希望对您有帮助！