角が丸いレイアウトの作り方..?


517

角が丸いレイアウトを作成するにはどうすればよいですか?丸みを帯びた角をに適用したいLinearLayout


コーナー付きのドローアブルを作成し、背景として設定します。問題はどこにありますか?
stinepike 2013

丸みを帯びた画像をレイアウトの背景として設定するだけで、最初のコメントで述べたように形を作ることができます
SilentKiller 2013

SOを検索するだけで済みます。多くの必要なものが見つかります..
Pankaj Kumar

角が
ぼやけ

回答:


1030

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
これは機能しません。設定したとおり、背景になります。そのため、コンテンツは丸みを帯びた角を上書きします。角に描画するコンテンツがある場合、角が丸く表示されません。
Android開発者

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_heightlayout_bg.xmlがドローアブルフォルダー内にないためにエラーが表示された理由。
Atul

8
@ nhouser9:実際には「動作しますが、フォアグラウンド/コンテンツが隅に描画される可能性があることに注意してください」のようなものです。したがって、ユースケースによっては100%機能する場合があります。答えは便利なので、投票にそれほど多くの投票がないことを嬉しく思います。また、この解決策で制限を見つけるのは簡単なので、コメントには10​​0の投票があることを嬉しく思います。両方の長所。
Benoit Duffez 2018年

125

API 21以降の場合、クリップビューを使用

丸みを帯びたアウトラインクリッピングがViewAPI 21 のクラスに追加されました。このトレーニングドキュメントまたはこのリファレンスを参照してくださいをご覧ください。

この組み込み機能により、角の丸い実装が非常に簡単になります。任意のビューまたはレイアウトで機能し、適切なクリッピングをサポートします。

ここに何をすべきか:

  • 丸い形状のドローアブルを作成し、ビューの背景として設定します。 android:background="@drawable/round_outline"
  • ドキュメンテーションによると、あなたがする必要があるのはこれだけです: android:clipToOutline="true"

残念ながら、バグがあるようで、このXML属性は現在認識されていません。幸い、Javaでクリッピングを設定できます。

  • あなたの活動またはフラグメントで: View.setClipToOutline(true)

それはどのようなものか:

ここに画像の説明を入力してください

ImageViewsに関する特別な注意

setClipToOutline()ビューの背景が描画可能な形状に設定されている場合にのみ機能します。この背景形状が存在する場合、Viewは背景の輪郭をクリッピングおよびシャドウイングの境界として扱います。

これは、ImageViewの角をで丸める場合setClipToOutline()、画像のandroid:src代わりに画像を使用する必要があることを意味しますandroid:background(丸みを帯びた形状には背景が使用されるため)。srcの代わりに背景を使用して画像を設定する必要がある場合は、このネストされたビューの回避策を使用できます。

  • 背景をシェイプドローアブルに設定して外部レイアウトを作成する
  • ImageViewの周りにそのレイアウトをラップします(パディングなし)
  • ImageView(レイアウト内の他のものを含む)は、外側のレイアウトの丸みのある形状にクリップされます。

9
私は唯一のAPI 21をサポートできるまで、APIでの作業少ない21カント待ち以上はありません
startoftext

「setClipToOutline」を使用しても機能しますが、フレーム自体(背景に使用するドローアブル)も削除されます。これを回避する方法はありますか?
Android開発者

src=@drawable...代わりにを使用することについての私のメモを読みましたbackground=@drawableか?これを行うか、形状の輪郭を保持するコンテナービュー内にImageViewをネストすることができます。
hungryghost 2017年

9
誰もがそのバグについてコメントしています---それはほぼ3年前のものであり、この10年間いつでも修正される兆候はありません。プレッシャーをかけましょう。
Josh Hansen、

どのようにしてこのバグをまだ修正できないのですか
P Fuster 2018

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.drawable.your_xml_name)を使用して、ドローアブルの背景(アイコンまたはリソースファイル)を使用するのと同じように使用します。


5
特定のコーナーを丸める可能性を愛した
マーキュリー

1
この答えは、ほぼ上記の答えです。ここでの唯一の実際の変更は、各コーナーの半径の定義であり、各コーナーに同じ値が与えられた場合は、代わりに1行で記述します。<corners android:radius="7dp" />:)
ZooMagic

これは私にとって最良の答えです。特定のコーナーを丸めることができるので... 100%うまく
Mahmoud Ayman

ImageViewの角が丸められていない(クリップされていない)場合、どうすれば解決できますか?
プリモジュKralj

2019年9月も引き続き機能します。
Nikolas Rieble

36

Android v7サポートライブラリでCardViewを使用します。少し重いですが、すべての問題を解決し、簡単です。描画可能な背景の設定メソッドとは異なり、サブビューを正常にクリップできます。

<?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ビューの一部ではなく、ほとんどすべてのWebブラウザーのCSSの定番であることに私は困惑します
Ben Philipp

29

私はこのようにしました:

スクリーンショットを確認:

相対レイアウトの背景

という名前のドローアブルファイル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>

Viewに四角形の背景を適用します

mView.setBackground(R.drawlable.custom_rectangle);

できた


14
これは機能しません。設定したとおり、背景になります。そのため、コンテンツは丸みを帯びた角よりも優先されます。角に描画するコンテンツがある場合、角が丸くなっていることはわかりません。
Android開発者

25

私はそれを行うためのより良い方法は2つをマージすることだと思います:

  1. ここに示すように、レイアウトのビットマップを作成します

  2. ここに示すように、ビットマップから丸いドローアブルを作成します

  3. ドローアブルをimageViewに設定します。

これにより、コーナーのあるコンテンツなど、他のソリューションで解決できなかったケースが処理されます。

2の代わりに1つのレイヤーが表示されるため、GPUにも少しやさしいと思います。

完全にカスタマイズされたビューを作成するのが唯一のより良い方法ですが、それはコードが多く、時間がかかる場合があります。ここで私が提案したのは、両方の長所だと思います。

これを行う方法のスニペットを次に示します。

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

}

編集:「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>

そしてその結果:

ここに画像の説明を入力してください

使用する場合、ストロークの端に若干のアーティファクトの問題がある(コンテンツの一部のピクセルがそこに残る)ことに注意してください。ズームインするとわかります。この問題についてはここで報告しまし。。

編集:修正されたようですが、IDEにはありません。ここで報告されました


この素晴らしい答えを組み立てるためのおかげで、それのは私が右方向に移動しましたが、私はここに非常に関連した問題で、いくつかの助けを使用することができstackoverflow.com/questions/25877515/...
ウィル・トムソン

ImageViewで利用できるデフォルトのコンストラクタがないため、これはエラーになります。
Anuj 14

これは受け入れられるべき答えです。フラットなロジックの代わりに、ダウンして素晴らしいソリューションを見つけました。また、これにより、他の回答へのコメントで言及した問題が解決されます。あなたの努力に感謝し、多分あなたは完全に機能するクラスを正し、githubを介してそれを共有することができます。あまりにも多くの人に役立つかもしれないと思います。
Arda Kara、2015年

@Senhorあなたは私がすべきだと思いますか?私はそれについて考えるだろう。今のところ、私が作成した他のリポジトリをここで見ることができます:github.com/AndroidDeveloperLB?tab
android developer

その大部分が終わったら、試してみることができます。ところでautofittextviewは本当にクールに見えます。
Arda Kara 2015年

10

これを試して...

1.作成 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"

上記と同様のソリューションについて書いたとおり、これは機能しません。設定したとおり、背景になります。そのため、コンテンツは丸みを帯びた角よりも優先されます。角に描画するコンテンツがある場合、角が丸くなっていることはわかりません。
Android開発者

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>

このcard_view:cardCornerRadius = "5dp"を使用すると、半径を変更できます。


5

最善かつ最も簡単な方法は、レイアウトでcard_backgroundドローアブルを利用することです。これは、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」 cardviewためには丸みを帯びたレイアウトのエッジを取得します。

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

support.v7ライブラリのCardView。API7以降から使用できます。
Nikita G.

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で削除します)。また、これは最低15のAPIレベルで機能します。


コンテンツが背景に合う場合、それは上書きされます。実際に設定した形状にクリップされません。
android開発者

別の見方ですか?意味を示すためにコードを更新していただけませんか?丸みを帯びたコーナーは黒い領域を配置しないという考えです。角の周りに、透明色があるはずです。
android開発者

ああ、私は今あなたの質問を得ます。私はそれのために、あなたはあなたのコンテンツの小さな固定マージンでうまくいくことができると思います
Abdul Wasae 2017年

ただし、固定マージンは長方形であり、選択した形状に従っていないため、コンテンツは選択した形状にカットされません。
android開発者

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

Material Components Libraryを使用すると、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" />

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.