Як зробити макет із закругленими кутами ..?


517

Як можна зробити макет із закругленими кутами? Я хочу застосувати закруглені кути до своїх LinearLayout.


Створіть форму, що малюється кутом, а потім встановіть як фон .. де проблема?
stinepike

вам просто потрібно встановити закруглене зображення як фон макета, інакше зробити форму, як сказано в першому коментарі
SilentKiller

вам просто потрібно пошукати SO ... ви знайдете багато asnwers ..
Панкай Кумар

кути для мене затьмарені
filthy_wizard

Відповіді:


1029

1: Визнач layout_bg.xml у рисунках :

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF"/>
    <stroke android:width="3dp" android:color="#B1BCBE" />
    <corners android:radius="10dp"/>
    <padding android:left="0dp" android:top="0dp" android:right="0dp" android:bottom="0dp" />
</shape>

2: Додайте layout_bg.xmlяк тло до свого макета

android:background="@drawable/layout_bg"

194
Це не працює. як ви встановили, це фон, тому вміст перекриває закруглені кути, і якщо у вас є вміст, який малює на кутах, ви не побачите їх округлення.
андроїд розробник

22
Майже завжди мій вміст ніколи не охоплює кути. Це прекрасно працює.
David JY Tang

2
Як уникнути помилки Element shape doesn't have the required attribute android:layout_height?
Лоренц

2
Element shape doesn't have the required attribute android:layout_heightПричина помилки була показана через те, що layout_bg.xml не знаходився всередині папки, що малюється.
Атул

8
@ nhouser9: насправді це більше схоже на "Це працює, але будьте попереджені, що ваш передній план / вміст може малювати в кутах". Тож залежно від випадку використання це може на 100% спрацювати. Я радий, що відповідь має не так багато рейтингів, тому що це корисно, і я радий, що коментар має сто оновлених результатів, тому що легко визначити обмеження цим рішенням. Найкраще з обох світів.
Бенуа Дюффес

124

Для API 21+, використовуйте Перегляд кліпів

Округлене обрізання контуру було додано до Viewкласу в API 21. Докладнішу інформацію див. У цьому навчальному документі чи в цьому посиланні .

Ця вбудована функція робить закруглені кути дуже простими у виконанні. Він працює на будь-якому вікні чи макеті та підтримує правильне відсікання.

Ось що робити:

  • Створіть закруглену форму, яку можна намалювати, і встановіть її як тло перегляду: android:background="@drawable/round_outline"
  • Згідно з документацією, тоді все, що вам потрібно зробити, це: android:clipToOutline="true"

На жаль, видається помилка, і цей атрибут XML наразі не розпізнається. На щастя, ми можемо встановити відсікання на Java:

  • У вашій діяльності або фрагменті: View.setClipToOutline(true)

Як це виглядає:

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

Спеціальна примітка про ImageView

setClipToOutline()працює лише тоді, коли фон перегляду встановлений у формі, що малюється. Якщо така форма фону є, View розглядає контур фону як межі для вирізання і затінення.

Це означає, що якщо ви хочете округлити кути на ImageView за допомогою setClipToOutline(), ваше зображення повинне вийти android:srcзамість android:background(оскільки фон використовується для округлої форми). Якщо ви ОБОВ'ЯЗКОВО використовувати фон для встановлення свого зображення замість src, ви можете використовувати це вкладене перегляд:

  • Створіть зовнішній макет з його фоном, встановленим для малювання вашої форми
  • Оберніть цей макет навколо свого ImageView (без прокладки)
  • ImageView (включаючи все інше в макеті) тепер буде вирізано до округлої форми зовнішнього макета.

9
Не працює в API менше 21. Не можу почекати, поки я можу підтримувати лише API 21.
startoftext

Використання 'setClipToOutline' працює, але він також видаляє сам кадр (те, що ви використовуєте для фону). Чи є спосіб уникнути цього?
андроїд розробник

Ви читали мою замітку про використання src=@drawable...замість background=@drawable? Ви можете це зробити або вкласти зображення ImageView всередині перегляду контейнера, який містить контур форми.
голодний

9
Всі коментують цю помилку --- їй майже три роки і не виявлено жодних ознак виправлення в будь-який час цього десятиліття. Давайте тиснемо на якийсь тиск.
Джош Хансен

Як цю помилку ще не можна виправити
P Fuster

74

Ось копія XML-файлу для створення малюнка з білим тлом, чорною облямівкою та закругленими кутами:

 <?xml version="1.0" encoding="UTF-8"?> 
    <shape xmlns:android="http://schemas.android.com/apk/res/android"> 
        <solid android:color="#ffffffff"/>    

        <stroke android:width="3dp"
                android:color="#ff000000"
                />

        <padding android:left="1dp"
                 android:top="1dp"
                 android:right="1dp"
                 android:bottom="1dp"
                 /> 

        <corners android:bottomRightRadius="7dp" android:bottomLeftRadius="7dp" 
         android:topLeftRadius="7dp" android:topRightRadius="7dp"/> 
    </shape>

збережіть його як XML-файл у каталозі, що малюється, Використовуйте його так, як ви використовуєте будь-який файл, що малюється (значок чи файл ресурсу), використовуючи його ім'я ресурсу (R.dravable.your_xml_name)


5
Полюбила можливість закруглення конкретних кутів
Меркурій

1
Ця відповідь є значною мірою відповіддю, як описано вище. Єдиною реальною зміною тут є визначення кожного радіуса кута, і з огляду на його однакове значення для кожного кута я б написав його в одному рядку замість цього: <corners android:radius="7dp" />:)
ZooMagic

це найкраща відповідь для мене, оскільки вона охоплює наявність закруглення конкретних кутів ... хороша робота, працює 100%
Махмуд Айман

Кути ImageView не округлені (обрізані), як це вирішити?
Primož Kralj

Все ще працює у вересні 2019 року. Ніцца.
Ніколас Рібле

36

Використовуйте CardView в бібліотеці підтримки android v7. Він хоч і трохи важкий, але вирішує всю проблему і досить легко. Не так, як встановлений метод фонового малювання, він може вдало вирізати підзагляди.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardBackgroundColor="@android:color/transparent"
    card_view:cardCornerRadius="5dp"
    card_view:cardElevation="0dp"
    card_view:contentPadding="0dp">
    <YOUR_LINEARLAYOUT_HERE>
</android.support.v7.widget.CardView>

2
Набагато краще для всіх, хто може собі це дозволити, ніж будь-що інше. Мене бентежить, що така основна річ не є частиною стандартних переглядів Android, тому що є основним елементом у CSS майже для будь-якого веб-браузера
Бен Філіп

29

Я зробив так:

Перевірка екрана:

Відносна розкладка фону

Створити Drawable файл з ім'ям , custom_rectangle.xmlв витяжці папці:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <solid android:color="@android:color/white" />

    <corners android:radius="10dip" />

    <stroke
        android:width="1dp"
        android:color="@android:color/white" />

</shape>

Тепер застосуйте Rectangle фон на Вид :

mView.setBackground(R.drawlable.custom_rectangle);

Зроблено


14
Це не працює. як ви встановили, це фон, тому вміст перекриває закруглені кути, і якщо у вас є вміст, який малює на кутах, ви не побачите їх округлення.
андроїд розробник

25

Я думаю, що кращий спосіб зробити це - об'єднати 2 речі:

  1. зробіть растровий макет, як показано тут .

  2. зробіть закруглений малюнок із растрової карти, як показано тут

  3. встановити графічний малюнок на imageView.

Це стосується випадків, які інші рішення не вдалося вирішити, наприклад, вміст із куточками.

Я думаю, що це також трохи більш зручно для GPU, оскільки він показує один шар замість 2.

Єдиний кращий спосіб - це зробити повністю налаштований вид, але це багато коду і може зайняти багато часу. Я думаю, що те, що я запропонував тут, є найкращим з обох світів.

Ось фрагмент того, як це можна зробити:

RoundedCornersDravable.java

/**
 * shows a bitmap as if it had rounded corners. based on :
 * http://rahulswackyworld.blogspot.co.il/2013/04/android-drawables-with-rounded_7.html
 * easy alternative from support library: RoundedBitmapDrawableFactory.create( ...) ; 
 */
public class RoundedCornersDrawable extends BitmapDrawable {

    private final BitmapShader bitmapShader;
    private final Paint p;
    private final RectF rect;
    private final float borderRadius;

    public RoundedCornersDrawable(final Resources resources, final Bitmap bitmap, final float borderRadius) {
        super(resources, bitmap);
        bitmapShader = new BitmapShader(getBitmap(), Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        final Bitmap b = getBitmap();
        p = getPaint();
        p.setAntiAlias(true);
        p.setShader(bitmapShader);
        final int w = b.getWidth(), h = b.getHeight();
        rect = new RectF(0, 0, w, h);
        this.borderRadius = borderRadius < 0 ? 0.15f * Math.min(w, h) : borderRadius;
    }

    @Override
    public void draw(final Canvas canvas) {
        canvas.drawRoundRect(rect, borderRadius, borderRadius, p);
    }
}

CustomView.java

public class CustomView extends ImageView {
    private View mMainContainer;
    private boolean mIsDirty=false;

    // TODO for each change of views/content, set mIsDirty to true and call invalidate

    @Override
    protected void onDraw(final Canvas canvas) {
        if (mIsDirty) {
            mIsDirty = false;
            drawContent();
            return;
        }
        super.onDraw(canvas);
    }

    /**
     * draws the view's content to a bitmap. code based on :
     * http://nadavfima.com/android-snippet-inflate-a-layout-draw-to-a-bitmap/
     */
    public static Bitmap drawToBitmap(final View viewToDrawFrom, final int width, final int height) {
        // Create a new bitmap and a new canvas using that bitmap
        final Bitmap bmp = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
        final Canvas canvas = new Canvas(bmp);
        viewToDrawFrom.setDrawingCacheEnabled(true);
        // Supply measurements
        viewToDrawFrom.measure(MeasureSpec.makeMeasureSpec(canvas.getWidth(), MeasureSpec.EXACTLY),
                MeasureSpec.makeMeasureSpec(canvas.getHeight(), MeasureSpec.EXACTLY));
        // Apply the measures so the layout would resize before drawing.
        viewToDrawFrom.layout(0, 0, viewToDrawFrom.getMeasuredWidth(), viewToDrawFrom.getMeasuredHeight());
        // and now the bmp object will actually contain the requested layout
        canvas.drawBitmap(viewToDrawFrom.getDrawingCache(), 0, 0, new Paint());
        return bmp;
    }

    private void drawContent() {
        if (getMeasuredWidth() <= 0 || getMeasuredHeight() <= 0)
            return;
        final Bitmap bitmap = drawToBitmap(mMainContainer, getMeasuredWidth(), getMeasuredHeight());
        final RoundedCornersDrawable drawable = new RoundedCornersDrawable(getResources(), bitmap, 15);
        setImageDrawable(drawable);
    }

}

EDIT: знайдено хорошу альтернативу, засновану на бібліотеці "RoundKornersLayouts" . Майте округлий клас, який буде використовуватися для всіх класів компонування, які ви хочете розширити:

//based on https://github.com/JcMinarro/RoundKornerLayouts
class CanvasRounder(cornerRadius: Float, cornerStrokeColor: Int = 0, cornerStrokeWidth: Float = 0F) {
    private val path = android.graphics.Path()
    private lateinit var rectF: RectF
    private var strokePaint: Paint?
    var cornerRadius: Float = cornerRadius
        set(value) {
            field = value
            resetPath()
        }

    init {
        if (cornerStrokeWidth <= 0)
            strokePaint = null
        else {
            strokePaint = Paint()
            strokePaint!!.style = Paint.Style.STROKE
            strokePaint!!.isAntiAlias = true
            strokePaint!!.color = cornerStrokeColor
            strokePaint!!.strokeWidth = cornerStrokeWidth
        }
    }

    fun round(canvas: Canvas, drawFunction: (Canvas) -> Unit) {
        val save = canvas.save()
        canvas.clipPath(path)
        drawFunction(canvas)
        if (strokePaint != null)
            canvas.drawRoundRect(rectF, cornerRadius, cornerRadius, strokePaint)
        canvas.restoreToCount(save)
    }

    fun updateSize(currentWidth: Int, currentHeight: Int) {
        rectF = android.graphics.RectF(0f, 0f, currentWidth.toFloat(), currentHeight.toFloat())
        resetPath()
    }

    private fun resetPath() {
        path.reset()
        path.addRoundRect(rectF, cornerRadius, cornerRadius, Path.Direction.CW)
        path.close()
    }

}

Потім додайте в кожен із ваших спеціалізованих класів компонування код, подібний до цього:

class RoundedConstraintLayout : ConstraintLayout {
    private lateinit var canvasRounder: CanvasRounder

    constructor(context: Context) : super(context) {
        init(context, null, 0)
    }

    constructor(context: Context, attrs: AttributeSet) : super(context, attrs) {
        init(context, attrs, 0)
    }

    constructor(context: Context, attrs: AttributeSet, defStyle: Int) : super(context, attrs, defStyle) {
        init(context, attrs, defStyle)
    }

    private fun init(context: Context, attrs: AttributeSet?, defStyle: Int) {
        val array = context.obtainStyledAttributes(attrs, R.styleable.RoundedCornersView, 0, 0)
        val cornerRadius = array.getDimension(R.styleable.RoundedCornersView_corner_radius, 0f)
        val cornerStrokeColor = array.getColor(R.styleable.RoundedCornersView_corner_stroke_color, 0)
        val cornerStrokeWidth = array.getDimension(R.styleable.RoundedCornersView_corner_stroke_width, 0f)
        array.recycle()
        canvasRounder = CanvasRounder(cornerRadius,cornerStrokeColor,cornerStrokeWidth)
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN_MR2) {
            setLayerType(FrameLayout.LAYER_TYPE_SOFTWARE, null)
        }
    }

    override fun onSizeChanged(currentWidth: Int, currentHeight: Int, oldWidth: Int, oldheight: Int) {
        super.onSizeChanged(currentWidth, currentHeight, oldWidth, oldheight)
        canvasRounder.updateSize(currentWidth, currentHeight)
    }

    override fun draw(canvas: Canvas) = canvasRounder.round(canvas) { super.draw(canvas) }

    override fun dispatchDraw(canvas: Canvas) = canvasRounder.round(canvas) { super.dispatchDraw(canvas) }

}

Якщо ви хочете підтримати атрибути, використовуйте це, як написано в бібліотеці:

<resources>
  <declare-styleable name="RoundedCornersView">
      <attr name="corner_radius" format="dimension"/>
      <attr name="corner_stroke_width" format="dimension"/>
      <attr name="corner_stroke_color" format="color"/>
  </declare-styleable>
</resources>

Ще одна альтернатива, яка може бути простішою для більшості застосувань: використовуйте MaterialCardView. Це дозволяє налаштувати закруглені кути, колір та ширину обведення та висоту.

Приклад:

<FrameLayout
    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:clipChildren="false" android:clipToPadding="false"
    tools:context=".MainActivity">

    <com.google.android.material.card.MaterialCardView
        android:layout_width="100dp" android:layout_height="100dp" android:layout_gravity="center"
        app:cardCornerRadius="8dp" app:cardElevation="8dp" app:strokeColor="#f00" app:strokeWidth="2dp">

        <ImageView
            android:layout_width="match_parent" android:layout_height="match_parent" android:background="#0f0"/>

    </com.google.android.material.card.MaterialCardView>

</FrameLayout>

І результат:

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

Зауважте, що на краях обведення є невелика проблема артефактів (залишає там кілька пікселів вмісту), якщо ви їх використовуєте. Ви можете помітити це, якщо збільшити масштаб. Про це питання я повідомляв тут .

EDIT: здається, виправлено, але не на IDE. Повідомлено тут .


Спасибі для збірки цього дивного відповіді, це змусило мене рухатися в правильному напрямку, але я міг би використовувати деяку допомогу з дуже пов'язаної з проблемою тут stackoverflow.com/questions/25877515 / ...
Will Thomson

Це дає помилку, оскільки в ImageView немає конструктора за замовчуванням.
Ануй

На це слід прийняти відповідь. Замість плоскої логіки ви пішли вниз і знайшли приголомшливе рішення. Також це вирішує проблеми, про які ви згадали в коментарях до інших відповідей. Дякуємо за ваші зусилля, і, можливо, ви можете отримати повністю функціональний клас та поділитися ним через github. Я думаю, що це може допомогти занадто багатьом людям.
Арда Кара

@Senhor Ти думаєш, що я повинен? Я подумаю про це. Зараз ви можете побачити інші створені мною сховища тут: github.com/AndroidDeveloperLB?tab=repositories
розробник для android

Оскільки велика частина зробленого ви можете спробувати. Btw autofittextview виглядає дуже здорово.
Арда Кара

10

Спробуйте це...

1.Create Drawable XML (custom_layout.xml):

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

<solid android:color="#FFFFFF" />

<stroke
    android:width="2dp"
    android:color="#FF785C" />

<corners android:radius="10dp" />

</shape>

2.додайте фон перегляду

android:background="@drawable/custom_layout"

Так само, як я писав вище про подібне рішення: Це не працює. як ви встановили, це фон, тому вміст перекриває закруглені кути, і якщо у вас є вміст, який малює на кутах, ви не побачите їх округлення.
андроїд розробник

9

Якщо ви хочете, щоб ваш макет був округлим, найкраще використовувати CardView, він надав безліч функцій, щоб зробити дизайн гарним.

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardCornerRadius="5dp">
      <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".3"
                android:text="@string/quote_code"
                android:textColor="@color/white"
                android:textSize="@dimen/text_head_size" />
      </LinearLayout>
</android.support.v7.widget.CardView>

За допомогою цього перегляду карт: cardCornerRadius = "5dp", ви можете змінити радіус.


5

Найкращим і найпростішим методом було б використання картки-картки для малювання у вашому макеті. Це також відповідає інструкціям Google щодо матеріального дизайну. Просто включіть це у вас LinearLayout:

android:background="@drawable/card_background"

Додайте це до каталогу, який можна намалювати, і назви його card_background.xml :

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <shape android:shape="rectangle">
            <solid android:color="#BDBDBD"/>
            <corners android:radius="5dp"/>
        </shape>
    </item>

    <item
        android:left="0dp"
        android:right="0dp"
        android:top="0dp"
        android:bottom="2dp">
        <shape android:shape="rectangle">
            <solid android:color="#ffffff"/>
            <corners android:radius="5dp"/>
        </shape>
    </item>
</layer-list>

5

Використовуйте CardView, щоб отримати закруглені краї для будь-яких макетів. Використовуйте card_view: cardCornerRadius = "5dp" для перегляду карти, щоб отримати закруглені краї макета.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:card_view="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical">

      <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        card_view:cardCornerRadius="5dp">
          <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:padding="15dp"
                android:weightSum="1">

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight=".3"
                    android:text="@string/quote_code"
                    android:textColor="@color/white"
                    android:textSize="@dimen/text_head_size" />

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight=".7"
                    android:text="@string/quote_details"
                    android:textColor="@color/white"
                    android:textSize="@dimen/text_head_size" />
            </LinearLayout>
       </android.support.v7.widget.CardView>
   </LinearLayout>

CardView з бібліотеки support.v7 ви можете використовувати з API7 або новішої версії.
Микита Г.

5

Кращий спосіб зробити це:

background_activity.xml

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:gravity="fill">
        <color android:color="@color/black"/>
    </item>
    <item>
        <shape android:gravity="fill">
            <solid android:color="@color/white"/>
            <corners android:radius="10dip"/>
            <padding android:left="0dip" android:top="0dip" android:right="0dip" android:bottom="0dip" />
        </shape>
    </item>
</layer-list>

Це також буде працювати нижче API 21, і ви отримаєте щось подібне:

Результат


Якщо ви готові докласти трохи більше зусиль для кращого контролю, тоді скористайтеся android.support.v7.widget.CardViewйого cardCornerRadiusатрибутом (і встановіть elevationатрибут, щоб 0dpпозбутися будь-якої супровідної тіні, що падає за допомогою cardView). Крім того, це буде працювати від рівня API лише до 15.


Якщо вміст відповідає фоновому режиму, він його перекриє. Він насправді не затискає форму, яку ви встановили.
андроїд розробник

Ви маєте на увазі інший погляд? Чи можете ви оновити код, щоб показати, що ви маєте на увазі? Ідея полягає в тому, щоб закруглені кути не поставили чорну область. По кутах повинен бути прозорий колір.
андроїд розробник

Ой, я розумію ваше запитання зараз. Я думаю, що для цього ви можете зробити невеликий фіксований запас у вашому вмісті
Абдул Васае

Але тоді вміст не буде вирізаний відповідно до обраної вами форми, оскільки фіксовані поля прямокутні, а не відповідно до обраної вами форми.
андроїд розробник

5

Функція для заданого радіуса кута програмно

static void setCornerRadius(GradientDrawable drawable, float topLeft,
        float topRight, float bottomRight, float bottomLeft) {
    drawable.setCornerRadii(new float[] { topLeft, topLeft, topRight, topRight,
            bottomRight, bottomRight, bottomLeft, bottomLeft });
}

static void setCornerRadius(GradientDrawable drawable, float radius) {
    drawable.setCornerRadius(radius);
}

Використання

GradientDrawable gradientDrawable = new GradientDrawable();
gradientDrawable.setColor(Color.GREEN);
setCornerRadius(gradientDrawable, 20f);
//or setCornerRadius(gradientDrawable, 20f, 40f, 60f, 80f); 

view.setBackground(gradientDrawable);

4
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF"/>
    <stroke android:width="3dip" android:color="#B1BCBE" />
    <corners android:radius="10dip"/>
    <padding android:left="3dip" android:top="3dip" android:right="3dip" android:bottom="3dip" />
</shape>

@David, просто помістіть накладки того ж значення, що й штрих, щоб було видно рамки, без розміру зображення


3

Я взяв відповідь @gauravsapiens із своїми коментарями всередині, щоб зрозуміти, на що впливатимуть параметри.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- Background color -->
    <solid android:color="@color/white" />

    <!-- Stroke around the background, width and color -->
    <stroke android:width="4dp" android:color="@color/drop_shadow"/>

    <!-- The corners of the shape -->
    <corners android:radius="4dp"/>

    <!-- Padding for the background, e.g the Text inside a TextView will be 
    located differently -->
    <padding android:left="10dp" android:right="10dp" 
             android:bottom="10dp" android:top="10dp" />

</shape>

Якщо ви просто хочете створити форму, яка округляє кути, видалення накладки і обведення виконають. Якщо ви також видалите тверду речовину, ви фактично створили закруглені кути на прозорому тлі.

Заради лінивості я створив під собою форму, яка є просто суцільним білим тлом із закругленими кутами - насолоджуйтесь! :)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- Background color -->
    <solid android:color="@color/white" />

    <!-- The corners of the shape -->
    <corners android:radius="4dp"/>

</shape>

3

Створіть свій XML у малюванні, layout_background.xml

 <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" >
      <solid android:color="@color/your_colour" />
      <stroke
            android:width="2dp"
            android:color="@color/your_colour" />
      <corners android:radius="10dp" />      
    </shape>
 <--width, color, radius should be as per your requirement-->

а потім додайте це у своє layout.xml

 android:background="@drawable/layout_background"

2

За допомогою бібліотеки матеріальних компонентів ви можете використовувати MaterialShapeDrawableдля малювання спеціальних фігур .

Просто помістіть LinearLayout у свій xml макет:

<LinearLayout
    android:id="@+id/linear_rounded"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    ..>

    <!-- content ..... -->

</LinearLayout>

Тоді у своєму коді ви можете застосувати ShapeAppearanceModel. Щось на зразок:

float radius = getResources().getDimension(R.dimen.default_corner_radius);

LinearLayout linearLayout= findViewById(R.id.linear_rounded);
ShapeAppearanceModel shapeAppearanceModel = new ShapeAppearanceModel()
    .toBuilder()
    .setAllCorners(CornerFamily.ROUNDED,radius)
    .build();

MaterialShapeDrawable shapeDrawable = new MaterialShapeDrawable(shapeAppearanceModel);
//Fill the LinearLayout with your color
shapeDrawable.setFillColor(ContextCompat.getColorStateList(this,R.color.secondaryLightColor));


ViewCompat.setBackground(linearLayout,shapeDrawable);

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

Примітка: для цього потрібна версія 1.1.0 бібліотеки компонентів матеріалів.


1
 <shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="@dimen/_10sdp"
android:shape="rectangle">

<solid android:color="@color/header" />

<corners
    android:bottomLeftRadius="@dimen/_5sdp"
    android:bottomRightRadius="@dimen/_5sdp"
    android:topLeftRadius="@dimen/_5sdp"
    android:topRightRadius="@dimen/_5sdp" />

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.