Question

如何使图像呈圆形并赋予其白色圆形边框？是否有必要使用两个图像视图 - 一个用于图像，另一个用于白色边框？还有其他办法吗？

Answer 1

试试这个......

public static Bitmap getCircularBitmapWithWhiteBorder(Bitmap bitmap,
        int borderWidth) {
    if (bitmap == null || bitmap.isRecycled()) {
        return null;
    }

    final int width = bitmap.getWidth() + borderWidth;
    final int height = bitmap.getHeight() + borderWidth;

    Bitmap canvasBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
    BitmapShader shader = new BitmapShader(bitmap, TileMode.CLAMP, TileMode.CLAMP);
    Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setShader(shader);

    Canvas canvas = new Canvas(canvasBitmap);
    float radius = width > height ? ((float) height) / 2f : ((float) width) / 2f;
    canvas.drawCircle(width / 2, height / 2, radius, paint);
    paint.setShader(null);
    paint.setStyle(Paint.Style.STROKE);
    paint.setColor(Color.BLUE);
    paint.setStrokeWidth(borderWidth);
    canvas.drawCircle(width / 2, height / 2, radius - borderWidth / 2, paint);
    return canvasBitmap;
}

Answer 2

首先使用您的代码获取Circulat图像。然后应用这个xml：

 <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
    <gradient android:startColor="#333440" android:endColor="#333440"
        android:angle="270"/>
</shape>

然后添加一个相对布局并向其添加一个imageview。将其排列到相对布局的中心。然后将此圆形设置为Imageview的背景。然后将圆形图像视图置于先前添加的imageview上方。将其也放置到center.By更改圆形图像视图边距将获得所需的边框效果。希望这会对你有帮助..

Answer 3

这可能不是最好的方法，你可能无法改变很多属性，但这肯定是最简单的方法。我刚刚使用了this库，我创建了一个带有边框的圆形图像视图。

所以，这是我的解决方案：

首先，我把它放在我的build.grandle：

中

`compile 'com.github.siyamed:android-shape-imageview:0.9.+@aar'`

第二次，我把它放在我的.xml布局文件中：

 <com.github.siyamed.shapeimageview.CircularImageView
                    android:layout_width="150dp"
                    android:layout_gravity="center_horizontal"
                    android:layout_height="150dp"
                    android:id="@+id/photo"
                    app:siBorderWidth="5dp"
                    app:siBorderColor="#ffffff"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true" />

在我的.java文件中，这是我可以采取的方式或将图像设置为CircularImageView：

final com.github.siyamed.shapeimageview.CircularImageView photo = (com.github.siyamed.shapeimageview.CircularImageView) convertView.findViewById(R.id.photo);

photo.setBackgroundResource(R.drawable.female);

这就是我用白色边框做的图像圆形所做的一切。

Answer 4

首先将以下行添加到 build.gradle 文件

implementation 'de.hdodenhof:circleimageview:2.2.0'

然后将以下 XML 代码添加到 xml 文件中：

<de.hdodenhof.circleimageview.CircleImageView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/profile_image"
    android:layout_width="96dp"
    android:layout_height="96dp"
    android:src="@drawable/profile"
    app:civ_border_width="2dp"
    app:civ_border_color="#FF000000"/>

Answer 5

不一定不必为图像使用两个图像视图，而对于白色边框则不需要使用其他图像视图。您可以创建一个新的XML文件，如下所示

<强> border.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="5dp" android:color="#000000" />
<padding android:left="5dp" android:top="5dp" android:right="5dp"
    android:bottom="5dp" />
</shape>

然后将其设置为图像视图。就像在图像视图中添加以下行一样。

android:background="@drawable/border"

Answer 6

这是一个不错的tutorial。

在本教程中，他们使用方法： -

/ * *使图像呈圆形 * /

public Bitmap getRoundedShape(Bitmap scaleBitmapImage) {
  // TODO Auto-generated method stub
  int targetWidth = 50;
  int targetHeight = 50;
  Bitmap targetBitmap = Bitmap.createBitmap(targetWidth, 
                            targetHeight,Bitmap.Config.ARGB_8888);

                Canvas canvas = new Canvas(targetBitmap);
  Path path = new Path();
  path.addCircle(((float) targetWidth - 1) / 2,
  ((float) targetHeight - 1) / 2,
  (Math.min(((float) targetWidth), 
                ((float) targetHeight)) / 2),
          Path.Direction.CCW);

                canvas.clipPath(path);
  Bitmap sourceBitmap = scaleBitmapImage;
  canvas.drawBitmap(sourceBitmap, 
                                new Rect(0, 0, sourceBitmap.getWidth(),
    sourceBitmap.getHeight()), 
                                new Rect(0, 0, targetWidth,
    targetHeight), null);
  return targetBitmap;
 }

为图像提供边框视图：

将此xml添加到drawable文件夹中：

=＆GT; rounded.xml

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

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

    <stroke
        android:width="3dip"
        android:color="#FF0000" />

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

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

</shape>

希望，这会有所帮助

Answer 7

Try This
    public static Bitmap createRoundImage(Bitmap loadedImage) {
    System.out.println("loadbitmap" + loadedImage);
    loadedImage = Bitmap.createScaledBitmap(loadedImage, 100, 100, true);
    Bitmap circleBitmap = Bitmap.createBitmap(loadedImage.getWidth(),
            loadedImage.getHeight(), Bitmap.Config.ARGB_8888);
    BitmapShader shader = new BitmapShader(loadedImage,
            Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
    Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setShader(shader);

    Canvas c = new Canvas(circleBitmap);
    c.drawCircle(loadedImage.getWidth() / 2, loadedImage.getHeight() / 2,
            loadedImage.getWidth() / 2, paint);
    return circleBitmap;
}

Answer 8

使用此link我已成功使用FrameLayout和两个 RoundedImageView。我所做的逻辑是一个是包装器视图，一个是包含配置文件图像的视图。这是我的代码

XML代码：

    <FrameLayout
    android:id="@+id/llImageProfile"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_marginTop="40dp"
    android:foregroundGravity="center">


    <com.pepperpk.frt.mallpk.custom.RoundedImageView
        android:id="@+id/circleViewOverlay"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center" />

    <com.pepperpk.frt.mallpk.custom.RoundedImageView
        android:id="@+id/circleView"
        android:layout_width="95dp"
        android:layout_height="95dp"
        android:layout_gravity="center" />
</FrameLayout>

JAVA代码：

profileWrapper.setImageResource(R.drawable.white_background);
profile.setImageResource(R.drawable.profile);

希望它有所帮助，如果您有任何疑惑，请在下面发表评论。

Answer 9

我尝试将ImageView保存在CardView中并相应地调整了CardView的半径。

NetworkImageView是Volley Library的一个。相同也应该与ImageView一起使用。

<android.support.v7.widget.CardView
            android:layout_width="105dp"
            android:layout_height="105dp"
            android:layout_margin="5dp"
            android:elevation="0dp"
            android:id="@+id/card_image_view"
            app:cardCornerRadius="53dp"
            android:innerRadius="0dp"
            android:background="@color/reco_widget_search_background"
            android:shape="ring"
            android:thicknessRatio="1">

            <NetworkImageView
                android:id="@+id/circle_networkImageViewProduct"
                android:layout_width="105dp"
                android:layout_height="105dp"
                android:backgroundTint="@color/white"
                android:tint="@color/white"
                android:scaleType="fitXY"
                android:layout_gravity="center"
                android:visibility="gone"
                />
        </android.support.v7.widget.CardView>

Answer 10

试试这个：

<html>
<head>
<style type="text/css">
img {
border: 30px solid #FFFFFF;
border-radius: 130px;
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
}
body {
background: #000;
}
</style>
<meta charset="utf-8">
<title>try</title>
</head>
<body>
<img src="http://icons.iconarchive.com/icons/danleech/simple/1024/google-icon.png" width="48" height="48" alt=""/>
</body>
</html>

使图像呈圆形，带有白色圆形边框

10 个答案: