Фон Android, чтобы заполнить половину экрана

Question

Как мне заставить мой макет ограничения отображать мою форму для рисования следующим образом:

Это мой дизайн.

И это то, что я получил.

<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 / radiusbackground.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) и нижняя часть белого цвета.Вы можете изменить коды в соответствии с вашими потребностями

Надеюсь, это поможет !!