Background Image Rounded Corners

Question

I am have a background image that changes and on top of it I am using rounded corners. Is there a way to hide the corners of the image. Below is a screen shot of my widget with the corners showing. enter image description here

EDIT CODE:

Bitmap bm1 = BitmapFactory.decodeResource(context.getResources(), Utilities.getDrawableId(ACCUWX.Icons.AL_WIDGETBG_ICON_MAP[Integer.parseInt(wdm.iconCode)]));
Bitmap roundedBm = Utilities.getRoundedCornerBitmap(bm1);
toRet.setImageViewBitmap(R.id.widget_bg, roundedBm);

method call:

public static Bitmap getRoundedCornerBitmap(Bitmap bitmap) {
        Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
            bitmap.getHeight(), Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

        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 = 12;

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

To show that I have a background image and rounded corners on top of it made from a drawable utilizing xml shape:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/widget_bg_rl"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipChildren="true">
    <ImageView
        android:id="@+id/widget_bg"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/al_widgetbg_06_07_08"
        android:scaleType="center" />

    <LinearLayout 
        android:id="@+id/current_layout"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:focusable="true"
        android:weightSum="8">
        <RelativeLayout
            android:id="@+id/city_time_rl"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2.5"
            android:background="@drawable/rounded_corners_top"
            android:clipChildren="true">
            <TextView
                android:id="@+id/city" 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:text="MECHANICSBURG"
                android:textSize="16dp"
                android:textColor="@color/dk_blue"
                />

i hope the the problem is in R.id.widget_bg, if this layout means make that also an with rounded corner. — Aerrow
the widget_bg is where I load the image resource that could be one of 15 images. They are all rectangular. — taraloca

matt5784 matt5784 · Accepted Answer · 2012-06-13T17:53:58

You should be able to accomplish this by making the background transparent before you draw the rounded rectangle on top of it.

Background Image Rounded Corners

1 Answers