Блог

Главная - Вопросы по программированию - Как придать закругленные углы линейному макету?

Как придать закругленные углы линейному макету?

#android #android-layout #android-drawable #android-constraintlayout

#Android #android-макет #android-возможность рисования #android-constraintlayout

Вопрос:

Я хочу наложить мой LinearLayout с закругленными углами поверх ImageView , но на заднем плане все еще остается белый цвет. Как это удалить?

введите описание изображения здесь

activity_main

 <androidx.constraintlayout.widget.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">
    <ImageView
        android:id="@ id/imageView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:contentDescription="@string/todo"
        android:scaleType="centerCrop"
        app:layout_constraintBottom_toTopOf="@ id/linearLayout"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/mountains" />
    <LinearLayout
        android:id="@ id/linearLayout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="@drawable/linear_layout"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@ id/imageView">
        <TextView
            android:id="@ id/textView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-condensed-medium"
            android:padding="15dp"
            android:text="@string/the_white_mountains"
            android:textAllCaps="true"
            android:textColor="@color/black"
            android:textSize="20sp" />
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

linear_layout

 <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/black"/>
    <corners android:topLeftRadius="15dp" android:topRightRadius="15dp"/>
</shape>

Как мне удалить эти белые уголки?

Комментарии:

1. В вашем случае цвет фона по умолчанию для ConstraintLayout — белый. Вы можете изменить желаемый цвет, используя -> Пример: android:background=»@android:color/ darker_gray»

Ответ №1:

Этот белый цвет в фоновом режиме является цветом фона по умолчанию для Constraintlayout. если вы хотите изменить его, добавьте этот атрибут в свой Constraintlayout:

 android:background="#E53935"

это будет выглядеть примерно так:
введите описание изображения здесь

как вы можете видеть, цвет фона изменился, но поскольку между виджетами нет пустого пространства, мы можем видеть цвет только в верхних углах. если это изображение является статическим, вы можете установить цвет фона в качестве нижнего цвета изображения, а именно: #1E1D2D

это будет выглядеть так: введите описание изображения здесь

если это изображение не является статическим, вы можете сделать некоторое пространство между виджетами, например, так:

 <androidx.constraintlayout.widget.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">

<ImageView
    android:id="@ id/imageView"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginStart="2dp"
    android:layout_marginTop="2dp"
    android:layout_marginEnd="2dp"
    android:layout_marginBottom="2dp"
    android:contentDescription="@string/todo"
    android:scaleType="centerCrop"
    app:layout_constraintBottom_toTopOf="@ id/linearLayout"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:srcCompat="@drawable/mountains" />

<LinearLayout
    android:id="@ id/linearLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="2dp"
    android:layout_marginEnd="2dp"
    android:layout_marginBottom="2dp"
    android:background="@drawable/linear_layout"
    android:orientation="vertical"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@ id/imageView">

    <TextView
        android:id="@ id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fontFamily="sans-serif-condensed-medium"
        android:padding="15dp"
        android:text="@string/the_white_mountains"
        android:textAllCaps="true"
        android:textColor="@color/black"
        android:textSize="20sp" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

это будет выглядеть примерно так:

введите описание изображения здесь

Я надеюсь, что мое объяснение будет ясным и полезным.

Ответ №2:

Ваш чертеж в порядке, но вам нужно настроить ограничения, поскольку ImageView он не занимает всю высоту экрана, и чтобы он действительно не пересекался с LinearLayout .

Итак, добавьте ImageView нижние ограничения к родительским, а не к верхней части LinearLayout 

 <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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">
    <ImageView
        android:id="@ id/imageView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:contentDescription="@string/todo"
        android:scaleType="centerCrop"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/mountains" />
    <LinearLayout
        android:id="@ id/linearLayout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="@drawable/linear_layout"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent">
        <TextView
            android:id="@ id/textView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-condensed-medium"
            android:padding="15dp"
            android:text="@string/the_white_mountains"
            android:textAllCaps="true"
            android:textColor="@color/black"
            android:textSize="20sp" />
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Предварительный просмотр

введите описание изображения здесь