位图重复 + 圆角 [英] Bitmap repeat + rounded corners
问题描述
我正在尝试创建带有圆角和背景的矩形作为重复位图.我是这样写的，但在角落里得到位图.
I am trying to create rectangle with rounded corners and background as repeated bitmaps. I am writing like this, but getting bitmaps in the corners.
有人可以帮忙吗?
背景.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<stroke
android:width="1dp"
android:color="#FFFFFF" />
<corners android:radius="50dp" />
</shape>
</item>
<item>
<bitmap
android:src="@drawable/carbon_4"
android:tileMode="repeat" />
</item>
</layer-list>
推荐答案
据我所知，目标是:有一个带有一些弯曲角的平铺背景图像.
As I understand the goal: have a tiled background image with some curved corners.
像素不够完美，但已尽我所能.
It's not quite pixel perfect, but its as close as I can get.
首先，这是我用来绘制该按钮的一些布局
first, here are some layouts I'm using to draw that button
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/wrapper_main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/bg_curved_tiled"
android:padding="20dp" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Some Text" />
</FrameLayout>
那就是以这个为背景
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:id="@id/layer_needs_rounding">
<bitmap
android:src="@drawable/patch"
android:tileMode="repeat" />
</item>
<item>
<shape
android:shape="rectangle"
android:useLevel="false" >
<stroke
android:width="3dp"
android:color="#666666" />
<solid android:color="@null" />
<corners
android:bottomLeftRadius="@dimen/radius_corner_default"
android:bottomRightRadius="@dimen/radius_corner_default"
android:radius="@dimen/radius_corner_default"
android:topLeftRadius="@dimen/radius_corner_default"
android:topRightRadius="@dimen/radius_corner_default" />
</shape>
</item>
</layer-list>
此时，您有一个看起来像这样的图像
At this point, you have an image that looks like this
如您所见，平铺位图从覆盖在其顶部的弯曲形状的角落伸出.
As you can see, the tiled bitmap sticks out at the corners past the curved shape thats overlayed on top of it.
所以现在你需要一个函数来使位图的角变圆……我在 stackoverflow 的其他地方找到了这个函数
So now you need a function that rounds the corners of a bitmap...i got this one off somewhere else on stackoverflow
public static Bitmap createRoundedCornerBitmap(Context context,
Bitmap input, float roundPx, boolean squareTL, boolean squareTR,
boolean squareBR, boolean squareBL) {
if (input == null) {
return null;
}
final int w = input.getWidth(), h = input.getHeight();
Bitmap output = Bitmap.createBitmap(w, h, Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = 0xff424242;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, w, h);
final RectF rectF = new RectF(rect);
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
// draw rectangles over the corners we want to be square
if (squareTL) {
canvas.drawRect(0, 0, w / 2, h / 2, paint);
}
if (squareTR) {
canvas.drawRect(w / 2, 0, w, h / 2, paint);
}
if (squareBL) {
canvas.drawRect(0, h / 2, w / 2, h, paint);
}
if (squareBR) {
canvas.drawRect(w / 2, h / 2, w, h, paint);
}
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(input, 0, 0, paint);
return output;
}
快到了！我讨厌这部分 - 我没有找到任何更好的方法来获取其中包含实际平铺位图的 Bitmap 对象.例如，BitmapDrawable.getBitmap 只为您提供单独的补丁位图，而不是平铺的重复补丁画布......无赖.所以相反，我正在获取视图的绘图缓存.您需要首先确保视图已完全初始化(高度和宽度已确定并适当平铺)，因此 post 到视图并在那里进行处理.
Almost there!
I hate this part - I haven't found any better way to get the Bitmap object that has the actual tiled bitmap in it. For example, BitmapDrawable.getBitmap just gives you the individual patch bitmap, not the tiled repeated patch canvas...bummer. So instead, I'm getting the drawing cache of the view. You need to make sure the view has been fully initialized first (height and width have been figured out and tiled appropriately), so post to the view and do processing there.
private void shaveOffCorners(final ViewGroup view) {
view.post(new Runnable() {
@Override
public void run() {
// make all child views invisible before scraping the drawing cache
SparseIntArray viewStates = new SparseIntArray();
for(int index = 0; index < view.getChildCount(); ++index) {
View child = view.getChildAt(index);
viewStates.put(index, child.getVisibility());
child.setVisibility(View.INVISIBLE);
}
view.buildDrawingCache();
// this is the exact bitmap that is currently rendered to screen. hence, we wanted to
// hide all the children so that they don't permanently become part of the background
final Bitmap rounded = view.getDrawingCache();
// restore actual visibility states after getting the drawing cache
for(int index = 0; index < view.getChildCount(); ++index) {
View child = view.getChildAt(index);
child.setVisibility(viewStates.get(index));
}
view.setBackgroundDrawable(new BitmapDrawable(
getResources(),
MyImageUtil.createRoundedCornerBitmap(
view.getContext(),
rounded,
getResources().getDimensionPixelSize(R.dimen.radius_corner_default),
false, true, true, false)));
}
});
}
我就是这样做的，希望能帮到你！
And that's how I did it, hope that helps!
如果有人知道实现此目的的不那么可怕的方法，请分享.此外，如果有人知道如何获取平铺位图而不是抓取绘图缓存，那也会很有帮助 - 整个隐藏和恢复子视图有点笨拙.
If anyone knows a less horrible way to accomplish this, please share. Also if anyone knows how to get the tiled bitmap other than scraping the drawing cache, that'd be helpful too - the whole hiding and restoring child views is a little janky.
这篇关于位图重复 + 圆角的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
