Bagaimana cara membuat tata letak dengan sudut membulat ..?


517

Bagaimana saya bisa membuat tata letak dengan sudut bulat? Saya ingin menerapkan sudut bulat untuk saya LinearLayout.


buat bentuk yang bisa digambar dengan sudut lalu atur sebagai latar .. di mana masalahnya?
stinepike

Anda hanya perlu mengatur gambar bulat sebagai latar belakang tata letak yang lain, bentuk seperti yang dikatakan dalam komentar pertama
SilentKiller

Anda hanya perlu mencari lebih dari SO ... Anda akan menemukan banyak asnwers ..
Pankaj Kumar

sudutnya dikaburkan untuk saya
filthy_wizard

Jawaban:


1030

1: Tentukan layout_bg.xml dalam drawables :

<?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: Tambahkan layout_bg.xmlsebagai latar belakang ke tata letak Anda

android:background="@drawable/layout_bg"

194
Ini tidak berhasil. seperti yang telah Anda tentukan, itu adalah latar belakangnya, sehingga konten menimpa sudut-sudut yang bulat, dan jika Anda memiliki konten yang menarik di sudut-sudutnya, Anda tidak akan melihatnya dibulatkan.
pengembang android

22
Hampir selalu, konten saya tidak pernah mencakup sudut. Ini bekerja dengan sempurna.
David JY Tang

2
Bagaimana Anda menghindari kesalahan Element shape doesn't have the required attribute android:layout_height?
Lorenz

2
Element shape doesn't have the required attribute android:layout_heightAlasan kesalahan ditampilkan karena layout_bg.xml tidak ada di dalam folder drawable.
Atul

8
@ nhouser9: sebenarnya ini lebih seperti "Berhasil, tetapi berhati-hatilah bahwa latar depan / konten Anda mungkin menarik di sudut". Jadi tergantung pada kasus penggunaannya mungkin 100% berfungsi. Saya senang jawabannya belum begitu banyak downvotes karena berguna, dan saya senang bahwa komentar memiliki seratus upvotes karena mudah untuk menemukan batasan dengan solusi ini. Terbaik dari kedua dunia.
Benoit Duffez

125

Untuk API 21+, Gunakan Tampilan Klip

Kliping garis bundar ditambahkan ke Viewkelas di API 21. Lihat dokumen pelatihan ini atau referensi ini untuk informasi lebih lanjut.

Fitur bawaan ini membuat sudut bundar sangat mudah diimplementasikan. Ini berfungsi pada tampilan atau tata letak apa pun dan mendukung kliping yang tepat.

Inilah Yang Harus Dilakukan:

  • Buat bentuk bulat yang dapat digambar dan atur sebagai latar belakang tampilan Anda: android:background="@drawable/round_outline"
  • Menurut dokumentasi, maka yang perlu Anda lakukan adalah ini: android:clipToOutline="true"

Sayangnya, tampaknya ada bug dan atribut XML ini saat ini tidak dikenali. Untungnya, kita dapat mengatur kliping di Jawa:

  • Dalam aktivitas atau fragmen Anda: View.setClipToOutline(true)

Seperti apa rupanya:

masukkan deskripsi gambar di sini

Catatan Khusus Tentang ImageViews

setClipToOutline()hanya berfungsi ketika latar belakang Tampilan diatur ke bentuk yang dapat digambar. Jika bentuk latar belakang ini ada, Lihat memperlakukan garis besar latar belakang sebagai batas untuk kliping dan tujuan bayangan.

Ini berarti bahwa jika Anda ingin membulatkan sudut pada ImageView dengan setClipToOutline(), gambar Anda harus berasal android:srcalih-alih android:background(karena latar belakang digunakan untuk bentuk bulat). Jika Anda HARUS menggunakan latar belakang untuk mengatur gambar Anda alih-alih src, Anda dapat menggunakan solusi tampilan bersarang ini:

  • Buat tata letak luar dengan latar belakangnya diatur agar bentuk Anda dapat digambar
  • Bungkus tata letak itu di sekitar ImageView Anda (tanpa bantalan)
  • ImageView (termasuk yang lainnya di tata letak) sekarang akan dipotong ke bentuk bulat tata letak luar.

9
Tidak bekerja di API kurang dari 21. Tidak bisa menunggu sampai saya hanya dapat mendukung API 21.
startoftext

Menggunakan 'setClipToOutline' berfungsi, tetapi juga menghapus frame itu sendiri (yang dapat Anda gunakan untuk latar belakang). Apakah ada cara untuk menghindari hal ini?
pengembang android

Apakah Anda membaca catatan saya tentang penggunaan src=@drawable...bukan background=@drawable? Anda bisa melakukan itu atau membuat sarang ImageView Anda di dalam tampilan wadah yang menampung garis bentuk.
hungryghost

9
Semua orang berkomentar tentang bug itu --- hampir tiga tahun dan tidak menunjukkan tanda-tanda untuk diperbaiki kapan saja dekade ini. Mari kita beri tekanan.
Josh Hansen

Bagaimana bug ini belum diperbaiki
P Fuster

74

Berikut adalah salinan file XML untuk membuat drawable dengan latar belakang putih, batas hitam, dan sudut bundar:

 <?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>

simpan sebagai file xml di direktori drawable, Gunakan seperti Anda menggunakan latar belakang drawable (ikon atau file sumber daya) menggunakan nama sumber dayanya (R.drawable.your_xml_name)


5
Menyukai kemungkinan membulatkan sudut tertentu
Merkurius

1
Jawaban ini cukup banyak dengan jawaban di atas. Satu-satunya perubahan nyata di sini adalah definisi dari masing-masing jari-jari sudut, dan diberi nilai yang sama untuk setiap sudut saya akan menulisnya dalam satu baris sebagai gantinya: <corners android:radius="7dp" />:)
ZooMagic

ini adalah jawaban TERBAIK untuk saya, karena mencakup ketersediaan pembulatan sudut tertentu ... pekerjaan bagus, bekerja 100%
Mahmoud Ayman

Sudut-sudut ImageView tidak membulat (terpotong), bagaimana cara mengatasi ini?
Primož Kralj

Masih bekerja pada bulan September 2019. Bagus.
Nikolas Rieble

36

Gunakan CardView di perpustakaan dukungan android v7. Meskipun agak berat, ini menyelesaikan semua masalah, dan cukup mudah. Tidak seperti metode latar yang ditetapkan yang dapat digambar, metode ini dapat memotong subview dengan sukses.

<?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
Jauh lebih baik untuk semua orang yang bisa "membelinya" daripada apa pun. Ini membuat saya bingung bahwa hal mendasar semacam itu bukan bagian dari tampilan Android standar, menjadi bahan pokok dalam CSS untuk hampir semua browser web
Ben Philipp

29

Saya telah melakukan ini:

Periksa Tangkapan Layar:

Latar Belakang Tata Letak Relatif

Buat file drawable dengan nama custom_rectangle.xmldi folder drawable :

<?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>

Sekarang terapkan latar belakang Rectangle pada View :

mView.setBackground(R.drawlable.custom_rectangle);

Selesai


14
Ini tidak berhasil. seperti yang telah Anda tentukan, itu adalah latar belakangnya, sehingga konten menimpa sudut-sudut yang bulat, dan jika Anda memiliki konten yang menarik di sudut-sudutnya, Anda tidak akan melihatnya dibulatkan.
pengembang android

25

Saya pikir cara yang lebih baik untuk melakukannya adalah menggabungkan 2 hal:

  1. buat bitmap tata letak, seperti yang ditunjukkan di sini .

  2. buat drawed rounded dari bitmap, seperti yang ditunjukkan di sini

  3. atur drawable pada imageView.

Ini akan menangani kasus-kasus yang gagal diselesaikan solusi lain, seperti memiliki konten yang memiliki sudut.

Saya pikir itu juga sedikit lebih ramah GPU, karena ia menunjukkan satu lapisan, bukan 2.

Satu-satunya cara yang lebih baik adalah membuat tampilan yang sepenuhnya dikustomisasi, tetapi itu banyak kode dan mungkin membutuhkan banyak waktu. Saya pikir apa yang saya sarankan di sini adalah yang terbaik dari kedua dunia.

Berikut cuplikan cara melakukannya:

RoundedCornersDrawable.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: menemukan alternatif yang bagus, berdasarkan pustaka "RoundKornersLayouts" . Miliki kelas yang akan digunakan untuk semua kelas tata letak yang ingin Anda perpanjang, untuk dibulatkan:

//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()
    }

}

Kemudian, di setiap kelas tata letak khusus Anda, tambahkan kode yang mirip dengan yang ini:

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) }

}

Jika Anda ingin mendukung atribut, gunakan ini seperti yang tertulis di perpustakaan:

<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>

Alternatif lain, yang mungkin lebih mudah untuk sebagian besar kegunaan: gunakan MaterialCardView. Hal ini memungkinkan menyesuaikan sudut membulat, warna dan lebar goresan, dan ketinggian.

Contoh:

<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>

Dan hasilnya:

masukkan deskripsi gambar di sini

Perhatikan bahwa ada sedikit masalah artefak di tepi goresan (meninggalkan beberapa piksel konten di sana), jika Anda menggunakannya. Anda dapat melihatnya jika Anda memperbesar. Saya telah melaporkan tentang masalah ini di sini .

EDIT: tampaknya diperbaiki, tetapi tidak pada IDE. Dilaporkan di sini .


Terima kasih telah menyusun jawaban yang luar biasa ini, ini membuat saya bergerak ke arah yang benar, tetapi saya dapat menggunakan bantuan dengan masalah yang sangat terkait di sini stackoverflow.com/questions/25877515/…
Will Thomson

Ini memberikan kesalahan karena tidak ada konstruktor default yang tersedia di ImageView.
Anuj

Ini harus diterima jawaban. Alih-alih logika datar Anda turun dan menemukan solusi yang luar biasa. Ini juga memecahkan masalah yang Anda sebutkan di komentar untuk jawaban lain. Terima kasih atas usaha Anda dan mungkin Anda bisa memperbaiki kelas yang berfungsi penuh dan membagikannya melalui github. Saya pikir itu mungkin membantu banyak orang.
Arda Kara

@ Hakim Anda pikir saya harus? Saya akan berpikir tentang hal ini. Untuk saat ini, Anda dapat melihat repositori lain yang saya buat, di sini: github.com/AndroidDeveloperLB?tab=repositories
pengembang android

Setelah sebagian besar selesai, Anda dapat mencobanya. Btw autofittextview terlihat sangat keren.
Arda Kara

10

Coba ini...

1. buat xml yang dapat ditarik (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. Tambahkan latar belakang tampilan Anda

android:background="@drawable/custom_layout"

Seperti yang saya tulis di atas solusi serupa: Ini tidak berhasil. seperti yang telah Anda tentukan, itu adalah latar belakangnya, sehingga konten menimpa sudut-sudut yang bulat, dan jika Anda memiliki konten yang menarik di sudut-sudutnya, Anda tidak akan melihatnya dibulatkan.
Pengembang android

9

Jika Anda ingin membuat tata letak Anda membulat, yang terbaik adalah menggunakan CardView, itu menyediakan banyak fitur untuk membuat desain yang indah.

<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>

Dengan card_view ini: cardCornerRadius = "5dp", Anda dapat mengubah radius.


5

Metode terbaik dan paling sederhana adalah dengan memanfaatkan card_background yang dapat digambar dalam tata letak Anda. Ini juga mengikuti pedoman desain materi Google. Cukup sertakan ini di dalam Anda LinearLayout:

android:background="@drawable/card_background"

Tambahkan ini ke direktori Anda yang dapat digambar dan beri nama 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

Gunakan CardView untuk mendapatkan tepi bulat untuk tata letak apa pun. Gunakan card_view: cardCornerRadius = "5dp" untuk cardview untuk mendapatkan tepi tata letak bulat.

<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 dari perpustakaan support.v7, Anda dapat menggunakan dari API7 atau lebih tinggi.
Nikita G.

5

Cara yang lebih baik untuk melakukannya adalah:

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>

Ini akan bekerja di bawah API 21 juga, dan memberi Anda sesuatu seperti ini:

Hasil


Jika Anda bersedia melakukan sedikit usaha lebih banyak kontrol yang lebih baik, maka gunakan android.support.v7.widget.CardViewdengan cardCornerRadiusatributnya (dan atur elevationatribut untuk 0dpmenyingkirkan drop shadow yang menyertainya dengan cardView). Juga, ini akan bekerja dari level API serendah 15.


Jika konten sesuai dengan latar belakang, itu akan menimpanya. Itu tidak benar-benar klip ke bentuk yang Anda tetapkan.
Pengembang android

Maksud Anda pandangan lain? Bisakah Anda memperbarui kode untuk menunjukkan maksud Anda? Idenya adalah bahwa sudut yang bulat tidak akan menempatkan area hitam. Di sudut-sudut, harus ada warna transparan.
pengembang android

Oh saya mendapatkan pertanyaan Anda sekarang. Saya kira untuk itu, Anda dapat puas dengan margin tetap yang kecil pada konten Anda
Abdul Wasae

Namun, konten tidak akan dipotong sesuai bentuk yang Anda pilih, karena margin tetap berbentuk persegi panjang, dan tidak sesuai dengan bentuk yang Anda pilih.
pengembang android

5

Berfungsi untuk mengatur radius sudut secara terprogram

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);
}

Menggunakan

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, cukup beri nilai padding yang sama dengan goresan, sehingga batas dapat terlihat, tanpa memandang ukuran gambar


3

Saya telah mengambil jawaban @gauravsapiens dengan komentar saya di dalam untuk memberi Anda pemahaman yang wajar tentang apa yang akan mempengaruhi parameter.

<?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>

Jika Anda hanya ingin membuat bentuk yang membulatkan sudut, lepaskan bantalan dan goresan akan berhasil. Jika Anda menghapus solid juga, Anda akan, pada dasarnya, telah membuat sudut bulat pada latar belakang transparan.

Demi menjadi malas, saya telah membuat bentuk di bawahnya, yang hanya merupakan latar belakang putih solid dengan sudut-sudut bulat - selamat menikmati! :)

<?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

Buat xml Anda di drawable, 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-->

dan kemudian, tambahkan ini di layout.xml

 android:background="@drawable/layout_background"

2

Dengan Perpustakaan Komponen Bahan Anda dapat menggunakan MaterialShapeDrawableuntuk menggambar bentuk kustom .

Cukup letakkan LinearLayout di tata letak xml Anda:

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

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

</LinearLayout>

Kemudian dalam kode Anda, Anda dapat menerapkan ShapeAppearanceModel. Sesuatu seperti:

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);

masukkan deskripsi gambar di sini

Catatan :: ini membutuhkan versi 1.1.0 dari pustaka komponen material.


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" />

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.