Как сделать изображение круговым и дать ему белую круговую границу? Нужно ли использовать два изображения - одно для изображения и другое для белой границы? Есть ли другой способ сделать это?Создание изображения круговой с белой круговой рамкой
Нет необходимости в том, чтобы вы использовали два изображения для одного изображения и другое для белой границы. Вы можете создать один новый 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"
Но «@ drawable/border» означает, что я должен предоставить изображение внутри чертежей с именем border na? –
Не создавайте один новый xml-файл в вашей папке с возможностью рисования, если папка с выталкиванием не существует, тогда вы также можете поместить ее в свою папку drawable-mdpi, а затем просто скопировать и вставить содержимое, указанное выше в файле border.xml, не нужно помещать изображение внутри, затем установите эту строку 'android: background =" @ drawable/border "для вашего изображения. – InnocentKiller
@maria, вы получаете то, что я пытаюсь сказать. – InnocentKiller
Вот хороший 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;
}
Для обеспечения границы вокруг ImageView:
Добавьте этот xml внутри вашей папки с возможностью скачивания:
=> 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>
Надежда, это воля помогает
Это не точный раунд :(его округленный прямоугольник я получаю –
Попробуйте это:
<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>
могу ли вы поделиться xml-кодом? –
вы можете конвертировать здесь: [link] (https: // sites .google.com/site/infivivek/resourse-center/online-resources/html-to-xml-converter) – user3258691
Мы говорим об android здесь, сэр, это какой-то HTML-код, который можно использовать в webView, но ... – AnixPasBesoin
Сначала получите 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 в it.Arrange его к центру относительной layout.And установить этот круг, как форму background.Then ImageView разместит вашу круглую ImageView выше ранее добавлено изображение. Измените его и в центре. При изменении кругового поля просмотра изображения вы получите желаемый эффект границы. Надеюсь, что это поможет ..
У меня уже есть код для создания кругового изображения и его работоспособности. Теперь мне нужно поставить на него круглую круговую рамку. Могу ли я сделать это с помощью того же кода или сделать что-то еще? Это мой вопрос –
You нужно применить форму к вашему коду –
можете ли вы поделиться этим кодом? –
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;
}
Попробуйте это ...
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;
}
Это может быть не лучшим образом, и вы не можете быть в состоянии изменить много свойств, но безусловно, самый простой способ. Я просто использовал библиотеку this, и я сделал круговое изображение, которое также имеет границу.
Итак, это мое решение:
Первый, я положил это в моем build.grandle:
`compile 'com.github.siyamed:android-shape-imageview:[email protected]ar'`
Второй, я положил это в моем файле .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);
Это все, что я сделал, чтобы сделать циркуляр изображение с белой каймой.
Хотя эта ссылка может ответить на вопрос, лучше включить здесь основные части ответа и предоставить ссылку для справки. Ответные ссылки могут стать недействительными, если связанная страница изменится. – HaveNoDisplayName
Я обновлю свой ответ. Я прошу прощения. – Marialena
Используя этот 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);
надеюсь, что это помогает, если у вас есть какой-либо путаницы, пожалуйста, комментарий ниже.
Я попытался сохранить ImageView внутри CardView и скорректированный радиус CardView соответственно.
NetworkImageView является одним из библиотеки Volley. То же самое должно работать с 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>
У меня уже есть код для создания кругового изображения и его работоспособности. Теперь мне нужно поставить на него круглую круговую рамку. Могу ли я сделать это с помощью того же кода или сделать что-то еще? Это мой вопрос. –