Comment faire une vue avec des coins arrondis?


92

J'essaie de faire une vue sous Android avec des bords arrondis. La solution que j'ai trouvée jusqu'à présent est de définir une forme avec des coins arrondis et de l'utiliser comme arrière-plan de cette vue.

Voici ce que j'ai fait, définir un dessinable comme indiqué ci-dessous:

<padding
android:top="2dp"
android:bottom="2dp"/>
<corners android:bottomRightRadius="20dp"
android:bottomLeftRadius="20dp"
android:topLeftRadius="20dp"
android:topRightRadius="20dp"/>

Maintenant, je l'ai utilisé comme arrière-plan pour ma mise en page comme ci-dessous:

<LinearLayout
        android:orientation="vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="10dp"
        android:clipChildren="true"
        android:background="@drawable/rounded_corner">

Cela fonctionne parfaitement bien, je peux voir que la vue a des bords arrondis.

Mais ma mise en page contient de nombreuses autres vues enfants, par exemple un ImageView ou un fichier MapView. Lorsque je place un ImageViewà l'intérieur de la mise en page ci-dessus, les coins de l'image ne sont pas coupés / rognés, mais semblent pleins.

J'ai vu d'autres solutions de contournement pour le faire fonctionner comme celui expliqué ici .

Mais existe-t-il une méthode pour définir des coins arrondis pour une vue et toutes ses vues enfants sont contenues dans cette vue principale qui a des coins arrondis?


Que faire si vous utilisez une mise en page personnalisée s'étendant à LinearLayout, et pendant que son objet est créé, itérez tous les enfants de cette mise en page et leur appliquez un arrière-plan de bordure arrondie?
MysticMagicϡ

3
android.support.v7.widget.CardView semble être la solution pour cela
rocketspacer

Cette solution l'a résolu pour moi, mais nécessite un sous- classement
Aaron

Est-ce que cela répond à votre question? Ajout de bordures pour l'image arrondie de l'image Android
user4157124

Réponses:


127

Une autre approche consiste à créer une classe de mise en page personnalisée comme celle ci-dessous. Cette mise en page dessine d'abord son contenu sur un bitmap hors écran, masque le bitmap hors écran avec un rect arrondi, puis dessine le bitmap hors écran sur le canevas réel.

Je l'ai essayé et cela semble fonctionner (du moins pour mon cas de test simple). Cela affectera bien sûr les performances par rapport à une mise en page classique.

package com.example;

import android.content.Context;
import android.graphics.*;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.widget.FrameLayout;

public class RoundedCornerLayout extends FrameLayout {
    private final static float CORNER_RADIUS = 40.0f;

    private Bitmap maskBitmap;
    private Paint paint, maskPaint;
    private float cornerRadius;

    public RoundedCornerLayout(Context context) {
        super(context);
        init(context, null, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context, attrs, defStyle);
    }

    private void init(Context context, AttributeSet attrs, int defStyle) {
        DisplayMetrics metrics = context.getResources().getDisplayMetrics();
        cornerRadius = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, CORNER_RADIUS, metrics);

        paint = new Paint(Paint.ANTI_ALIAS_FLAG);

        maskPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);
        maskPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

        setWillNotDraw(false);
    }

    @Override
    public void draw(Canvas canvas) {
        Bitmap offscreenBitmap = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_8888);
        Canvas offscreenCanvas = new Canvas(offscreenBitmap);

        super.draw(offscreenCanvas);

        if (maskBitmap == null) {
            maskBitmap = createMask(canvas.getWidth(), canvas.getHeight());
        }

        offscreenCanvas.drawBitmap(maskBitmap, 0f, 0f, maskPaint);
        canvas.drawBitmap(offscreenBitmap, 0f, 0f, paint);
    }

    private Bitmap createMask(int width, int height) {
        Bitmap mask = Bitmap.createBitmap(width, height, Bitmap.Config.ALPHA_8);
        Canvas canvas = new Canvas(mask);

        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.WHITE);

        canvas.drawRect(0, 0, width, height, paint);

        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
        canvas.drawRoundRect(new RectF(0, 0, width, height), cornerRadius, cornerRadius, paint);

        return mask;
    }
}

Utilisez ceci comme une mise en page normale:

<com.example.RoundedCornerLayout
    android:layout_width="200dp"
    android:layout_height="200dp">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/test"/>

    <View
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:background="#ff0000"
        />

</com.example.RoundedCornerLayout>

1
J'utilise cette mise en page pour la visualisation d'image avec la fonction de zoom à l'intérieur, mais cette mise en page ne détecte pas l'auditeur tactile lorsque j'essaye de zoomer, comment ajouter une fonction d'écoute tactile dans cette mise en page?
Muhammad Nafian Wildana

2
J'ai utilisé cette méthode et fonctionne très bien. Mais lorsque je mets un EditText dans la mise en page, l'écran ne se met pas à jour lorsque je tape. Lorsque je ferme la fenêtre, le texte s'affiche. L'écran se met à jour une fois que je ferme le clavier. Une solution à cela?
Sajib Acharya

1
Le seul problème avec cela lorsque vous l'utilisez avec la vue Recycleur est qu'il n'attend pas le chargement d'un ensemble complet d'éléments. Et arrondit seulement quelques articles. Y a-t-il une raison à cela?
Ahmed

2
Cela ne fonctionne pas avec les images chargées à partir de la bibliothèque glide qui utilisent des transitions d'espace réservé (ou tout autre enfant animé en fait). J'ai une solution alternative mais elle nécessite que votre couleur d'arrière-plan soit une couleur unie. Voir gist.github.com/grennis/da9f86870c45f3b8ae00912edb72e868
Greg Ennis

2
Solution fine et utile mais trop chère. RecyclerView avec seulement six éléments contenant une image ne peut pas défiler en douceur. Et cela ne dépend pas de la puissance de l'appareil (Samsung S9 ou Wileyfox Swift 2). stackoverflow.com/a/41098690/4399323 est une meilleure réponse!
Valentin Yuryev

71

Ou vous pouvez utiliser un android.support.v7.widget.CardViewcomme ceci:

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    card_view:cardBackgroundColor="@color/white"
    card_view:cardCornerRadius="4dp">

    <!--YOUR CONTENT-->
</android.support.v7.widget.CardView>

J'ai essayé de nombreuses façons, la vôtre est la meilleure solution à mon problème. MERCI!
wizChen

Impossible de supprimer l'élévation. Fonctionne bien si la conception nécessite une élévation.
Abdalrahman Shatou

1
@AbdalrahmanShatou developer.android.com/reference/android/support/v7/widget/... il existe des propriétés pour cela. Avez-vous essayé de les régler sur "0"?
rocketspacer

5
Un inconvénient est qu'il ne prend pas en charge <21 api Android
Itai Spector

50

shape.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

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

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

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

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

</shape>

et à l'intérieur de votre mise en page

<LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="10dp"
        android:clipChildren="true"
        android:background="@drawable/shape">

        <ImageView
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:src="@drawable/your image"
             android:background="@drawable/shape">

</LinearLayout>

3
@Zach: De quelle manière cela a-t-il échoué? De la même manière que votre application fonctionnait lorsque vous avez posé la question d'origine?
LarsH

2
clipChildren est inutile et la vue de l'image s'étend toujours en dehors de la vue.
Abdalrahman Shatou

1
J'aimerais pouvoir vous donner une prime pour cela. Merci
Odys

3
Je ne pense pas que cette approche fonctionnerait si l'image est rectangulaire, car l'arrière-plan sera dessiné derrière le contenu de l'image. Cela peut ne fonctionner qu'avec des images transparentes et ayant elles-mêmes des coins arrondis.
Harsha Vardhan

21

La réponse de Jaap van Hengstum fonctionne très bien mais je pense que c'est cher et si nous appliquons cette méthode sur un Button par exemple, l'effet tactile est perdu car la vue est rendue sous forme de bitmap.

Pour moi la meilleure méthode et la plus simple consiste à appliquer un masque sur la vue, comme ça:

@Override
protected void onSizeChanged(int width, int height, int oldWidth, int oldHeight) {
    super.onSizeChanged(width, height, oldWidth, oldHeight);

    float cornerRadius = <whatever_you_want>;
    this.path = new Path();
    this.path.addRoundRect(new RectF(0, 0, width, height), cornerRadius, cornerRadius, Path.Direction.CW);
}

@Override
protected void dispatchDraw(Canvas canvas) {
    if (this.path != null) {
        canvas.clipPath(this.path);
    }
    super.dispatchDraw(canvas);
}

Comment l'utiliser?
Maksim Kniazev

@MaksimKniazev Créez une sous-classe de la mise en page souhaitée (par exemple: FrameLayout), puis collez ces deux méthodes dans cette sous-classe et remplacez «<whatever_you_want>» par la valeur de rayon de coin souhaitée (à partir des ressources par exemple). C'est tout. Est-ce assez clair pour vous ou avez-vous besoin d'un exemple?
Donkey

Merci beaucoup, cela fonctionne vraiment mieux pour RecyclerView!
Valentin Yuryev

18

Si vous rencontrez des problèmes lors de l'ajout d'écouteurs tactiles à la mise en page. Utilisez cette mise en page comme mise en page parent.

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.RectF;
import android.graphics.Region;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.view.View;
import android.widget.FrameLayout;

public class RoundedCornerLayout extends FrameLayout {
    private final static float CORNER_RADIUS = 6.0f;
    private float cornerRadius;

    public RoundedCornerLayout(Context context) {
        super(context);
        init(context, null, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context, attrs, defStyle);
    }

    private void init(Context context, AttributeSet attrs, int defStyle) {
        DisplayMetrics metrics = context.getResources().getDisplayMetrics();
        cornerRadius = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, CORNER_RADIUS, metrics);
        setLayerType(View.LAYER_TYPE_SOFTWARE, null);
    }


    @Override
    protected void dispatchDraw(Canvas canvas) {
        int count = canvas.save();

        final Path path = new Path();
        path.addRoundRect(new RectF(0, 0, canvas.getWidth(), canvas.getHeight()), cornerRadius, cornerRadius, Path.Direction.CW);
        canvas.clipPath(path, Region.Op.REPLACE);

        canvas.clipPath(path);
        super.dispatchDraw(canvas);
        canvas.restoreToCount(count);
    }


}

comme

<?xml version="1.0" encoding="utf-8"?>
<com.example.view.RoundedCornerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:id="@+id/patentItem"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingRight="20dp">
        ... your child goes here
    </RelativeLayout>
</com.example.view.RoundedCornerLayout>

2
Cela fonctionne bien s'il n'y a pas beaucoup d'animation à l'écran, ce qui fait que l'écran se dessine encore et encore plusieurs fois; depuis, cela ralentira considérablement les performances. Devrait essayer cardview, qui a une méthode efficace de coin arrondi (ne pas utiliser le chemin de détourage ou canvas.drawRoundRect - mauvais en dessous de l'API 17, mais utiliser porterFilterDuffColor)
Nguyen Tan Dat

15

Créez un fichier xml appelé round.xmldans le drawabledossier et collez ce contenu:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
  <solid android:color="#FFFFFF" />
  <stroke android:width=".05dp" android:color="#d2d2d2" />
  <corners android:topLeftRadius="5dp" android:topRightRadius="5dp" android:bottomRightRadius="5dp" android:bottomLeftRadius="5dp"/>
</shape>

puis utilisez le round.xmlcomme backgroundpour n'importe quel élément. Ensuite, cela vous donnera des coins arrondis.


9

Dans Android L, vous pourrez simplement utiliser View.setClipToOutline pour obtenir cet effet. Dans les versions précédentes, il n'y avait aucun moyen de découper simplement le contenu d'un ViewGroup aléatoire dans une certaine forme.

Vous devrez penser à quelque chose qui vous donnerait un effet similaire:

  • Si vous n'avez besoin que de coins arrondis dans ImageView, vous pouvez utiliser un shader pour «peindre» l'image sur la forme que vous utilisez comme arrière-plan. Jetez un œil à cette bibliothèque pour un exemple.

  • Si vous avez vraiment besoin que tous les enfants soient coupés, peut-être pouvez-vous avoir une autre vue sur votre mise en page? Un avec un arrière-plan de la couleur que vous utilisez et un «trou» rond au milieu? Vous pouvez en fait créer un ViewGroup personnalisé qui dessine cette forme sur tous les enfants remplaçant la méthode onDraw.


3

suivez ce tutoriel et toute la discussion ci-dessous - http://www.curious-creature.org/2012/12/11/android-recipe-1-image-with-rounded-corners/

selon ce billet rédigé par Guy Romain, l'un des principaux développeurs de l'ensemble de la boîte à outils de l'interface utilisateur Android, il est possible de faire un conteneur (et toutes ses vues enfant) avec des coins arrondis, mais il a expliqué que c'était trop cher (à partir de performances de problèmes de rendu).

Je vous recommanderai d'aller selon son post, et si vous voulez des coins arrondis, alors mettez en place des coins arrondis ImageView fonction de cet article. ensuite, vous pouvez le placer dans un conteneur avec n'importe quel arrière-plan, et vous obtiendrez l'effet que vous souhaitez.

c'est ce que j'ai fait aussi finalement.


3

Vous pouvez utiliser un androidx.cardview.widget.CardViewcomme ceci:

<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"       
        app:cardCornerRadius="@dimen/dimen_4"
        app:cardElevation="@dimen/dimen_4"
        app:contentPadding="@dimen/dimen_10">

       ...

</androidx.cardview.widget.CardView>

OU

shape.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

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

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

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

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

</shape>

et à l'intérieur de votre mise en page

<LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/shape">

        ...

</LinearLayout>

3

Créez un fichier xml sous votre dossier dessinable avec le code suivant. (Le nom du fichier que j'ai créé est arrondi_corner.xml)

arrondi_corner.xml

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

        <!-- view background color -->
        <solid
            android:color="#a9c5ac" >
        </solid>

        <!-- view border color and width -->
        <stroke
            android:width="3dp"
            android:color="#1c1b20" >
        </stroke>

        <!-- If you want to add some padding -->
        <padding
            android:left="4dp"
            android:top="4dp"
            android:right="4dp"
            android:bottom="4dp"    >
        </padding>

        <!-- Here is the corner radius -->
        <corners
            android:radius="10dp"   >
        </corners>
    </shape>

Et gardez cela drawablecomme backgroundpour la vue sur laquelle vous souhaitez conserver la bordure d'angle arrondie. Gardons-le pour unLinearLayout

    <LinearLayout android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/rounded_corner"
            android:layout_centerInParent="true">

            <TextView android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="Hi, This layout has rounded corner borders ..."
                android:gravity="center"
                android:padding="5dp"/>

    </LinearLayout>

3

Cela a CardViewfonctionné pour moi dans l'API 27 dans Android Studio 3.0.1. Le a colorPrimaryété référencé dans le res/values/colors.xmlfichier et n'est qu'un exemple. Pour la layout_width de 0dpcelui-ci s'étendra à la largeur du parent. Vous devrez configurer les contraintes et la largeur / hauteur selon vos besoins.

<android.support.v7.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:cardCornerRadius="4dp"
    app:cardBackgroundColor="@color/colorPrimary">

    <!-- put your content here -->

</android.support.v7.widget.CardView>

2

Différence avec la réponse de Jaap van Hengstum:

  1. Utilisation BitmapShader au lieu du masque bitmap.
  2. Créez une seule image bitmap.
public class RoundedFrameLayout extends FrameLayout {
    private Bitmap mOffscreenBitmap;
    private Canvas mOffscreenCanvas;
    private BitmapShader mBitmapShader;
    private Paint mPaint;
    private RectF mRectF;

    public RoundedFrameLayout(Context context) {
        super(context);
        init();
    }

    public RoundedFrameLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public RoundedFrameLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        setWillNotDraw(false);
    }

    @Override
    public void draw(Canvas canvas) {
        if (mOffscreenBitmap == null) {
            mOffscreenBitmap = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_8888);
            mOffscreenCanvas = new Canvas(mOffscreenBitmap);
            mBitmapShader = new BitmapShader(mOffscreenBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
            mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
            mPaint.setShader(mBitmapShader);
            mRectF = new RectF(0f, 0f, canvas.getWidth(), canvas.getHeight());
        }
        super.draw(mOffscreenCanvas);

        canvas.drawRoundRect(mRectF, 8, 8, mPaint);
    }
}

2
public class RoundedCornerLayout extends FrameLayout {
    private double mCornerRadius;

    public RoundedCornerLayout(Context context) {
        this(context, null, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context, attrs, defStyle);
    }

    private void init(Context context, AttributeSet attrs, int defStyle) {
        DisplayMetrics metrics = context.getResources().getDisplayMetrics();
        setLayerType(View.LAYER_TYPE_SOFTWARE, null);
    }

    public double getCornerRadius() {
        return mCornerRadius;
    }

    public void setCornerRadius(double cornerRadius) {
        mCornerRadius = cornerRadius;
    }

    @Override
    public void draw(Canvas canvas) {
        int count = canvas.save();

        final Path path = new Path();
        path.addRoundRect(new RectF(0, 0, canvas.getWidth(), canvas.getHeight()), (float) mCornerRadius, (float) mCornerRadius, Path.Direction.CW);
        canvas.clipPath(path, Region.Op.REPLACE);

        canvas.clipPath(path);
        super.draw(canvas);
        canvas.restoreToCount(count);
    }
}

2

Avec la bibliothèque de composants de matériaux, la meilleure façon de créer Viewdes coins arrondis est d'utiliser leMaterialShapeDrawable .

Créez un ShapeAppearanceModel avec des coins arrondis personnalisés:

ShapeAppearanceModel shapeAppearanceModelLL1 = new ShapeAppearanceModel()
        .toBuilder()
        .setAllCorners(CornerFamily.ROUNDED,radius16)
        .build();

Créez un MaterialShapeDrawable:

MaterialShapeDrawable shapeDrawableLL1 = new MaterialShapeDrawable(shapeAppearanceModeLL1);

Si vous souhaitez appliquer également une elevationOverlay pour le thème sombre, utilisez ceci:

MaterialShapeDrawable shapeDrawableLL1 = MaterialShapeDrawable.createWithElevationOverlay(this, 4.0f);
shapeDrawableLL1.setShapeAppearanceModel(shapeAppearanceModelLL1);

Facultatif: appliquer à la forme Dessiner une couleur d'arrière-plan et un contour

shapeDrawableLL1.setFillColor(
       ContextCompat.getColorStateList(this,R.color...));
 shapeDrawableLL1.setStrokeWidth(2.0f);
 shapeDrawableLL1.setStrokeColor(
       ContextCompat.getColorStateList(this,R.color...));

Enfin, appliquez le shapeDrawable comme arrière-plan dans votre LinearLayout(ou une autre vue):

LinearLayout linearLayout1= findViewById(R.id.ll_1);
ViewCompat.setBackground(linearLayout1,shapeDrawableLL1);

entrez la description de l'image ici


1

Le lien du didacticiel que vous avez fourni semble suggérer que vous devez définir les propriétés layout_width et layout_height de vos éléments enfants sur match_parent.

<ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent">

0

essayez cette propriété avec votre mise en page linéaire, cela vous aidera
tools: context = ". youractivity"


0
public static Bitmap getRoundedCornerBitmap(Bitmap bitmap, int pixels) {

        Bitmap roundedBitmap = Bitmap.createBitmap(bitmap.getWidth(), bitmap
                .getHeight(), Config.ARGB_8888);
        Canvas canvas = new Canvas(roundedBitmap);

        final int color = 0xff424242;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        final RectF rectF = new RectF(rect);
        final float roundPx = pixels;

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        canvas.drawRoundRect(rectF, roundPx, roundPx, paint);

        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);

        return roundedBitmap;
    }

0

Pour créer une image d'angle arrondi à l'aide de com.google.android.material: material: 1.2.0-beta01

 float radius = context.getResources().getDimension(R.dimen.border_radius_hug);
    shapeAppearanceModel = new ShapeAppearanceModel()
            .toBuilder()
            .setAllCorners(CornerFamily.ROUNDED,radius)
            .build();

imageView.setShapeAppearanceModel(shapeAppearanceModel)

ou si vous souhaitez l'utiliser dans un fichier xml:

  <com.google.android.material.imageview.ShapeableImageView
            android:id="@+id/thumb"
            android:layout_width="80dp"
            android:layout_height="60dp"
            app:shapeAppearanceOverlay="@style/circleImageView"
            />

dans style.xml, ajoutez ceci:

<style name="circleImageView" parent="">
      <item name="cornerFamily">rounded</item>
      <item name="cornerSize">10%</item>
</style>

-1

Utilisez la forme en xml avec rectangle, définissez la propriété du rayon inférieur ou supérieur comme vous le souhaitez, puis appliquez ce xml comme arrière-plan à votre vue .... ou ... utilisez des dégradés pour le faire à partir du code.


J'ai déjà fait cela, mais je veux savoir s'il existe une meilleure méthode?
Zach

Le demandeur a déjà mentionné avoir essayé cette approche dans sa question.
Michael Krause
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.