简体   繁体   中英

Rounded corners not working when button has background image

I have a button in my activity and it has a background image also.I have added selector attributes,and it is working for set_pressed and set_focused.But rounded corners are not coming at default state of button, for that i have inserted a background image also.pls help me ...

activity_sam.xml

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

  <item    android:state_pressed="true">
    <shape  >

    <solid android:color="#f27d0f"/>
    <corners  android:radius="7dp"/>
    </shape> 
  </item>

  <item    android:state_focused="true">
    <shape  >

    <solid android:color="#f27d0f"/>
    <corners android:radius="7dp"/>
    </shape> 
  </item>

  <item  android:state_focused="false" 
      android:state_enabled="true" 
      android:drawable="@drawable/sam_logo" >
    <shape  >    
    <corners  android:radius="7dp"/>
    </shape> 
  </item>

</selector>
  • add Layout same size of button

  • provide background image and set rounder corner xml as background to Button ..if it work accept answer.


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

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/top_right_left_coner"
        android:text="@string/hello_world" />
</LinearLayout>

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

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

    <stroke
        android:width="1dp"
        android:color="@android:color/black" />

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

    <corners
        android:bottomLeftRadius="10dip"
        android:bottomRightRadius="10dip"
        android:topLeftRadius="10dip"
        android:topRightRadius="10dip" />        
</shape>

Add this below last item.

 <item>
    <shape>    
    <corners  android:radius="7dp"/>
    </shape> 
  </item>

It will work as default style for button.

Add another item to show the default state as like this :

<shape>    
<corners  android:radius="7dp"/>
</shape> 

If you want to show the rounded corner programmatically do the following :

  public Drawable getRoundedBitmap(Bitmap bitmap, float Rnd_px) {

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

    final int color = 0xff151515;
    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 = Rnd_px;

    paint.setAlpha(50);
    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);
    Drawable image = new BitmapDrawable(output);
    return image;
}

The above code will crop the edges of the image. If you want to show a rounded layer over the image view. Please do the following.

<?xml version="1.0" encoding="UTF-8"?>

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

<stroke
    android:width="3dp"
    android:color="#0000CC" />

<corners
    android:bottomLeftRadius="5dp"
    android:bottomRightRadius="5dp"
    android:topLeftRadius="5dp"
    android:topRightRadius="5dp" />

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

I would rather try something like this in code(not checked yet):

    public class MyDrawable extends PaintDrawable {
    BitmapShader mShader;
Rect mRect = new Rect();
        public MyDrawable(BitmapDrawable bitmapDrawable) {
        super();


        final BitmapShader mShader = new BitmapShader(bitmapDrawable.getBitmap(), bitmapDrawable.getTileModeX() == null ? Shader.TileMode.CLAMP : bitmapDrawable.getTileModeX(), bitmapDrawable.getTileModeY() == null ? Shader.TileMode.CLAMP : bitmapDrawable.getTileModeY());
        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setFilterBitmap(true);
        mPaint.setDither(true);
        mPaint.setStyle(Paint.Style.FILL);
        mPaint.setShader(mShader);
    }


    @Override
    public void draw(Canvas canvas) {
        int saveCount = canvas.getSaveCount();
        canvas.save();
        getPadding(mRect);
        canvas.translate(mRect.left, mRect.top);
        getShape().draw(canvas, mPaint);
        canvas.translate(-mRect.left, -mRect.top);
        canvas.restoreToCount(saveCount);

    }


}

thanks to this You can use MyDrawable.setCornerRadii(float[] radiuses), and thanks to this draw image in rect with 4 diffrent radiuses(top-left,top-right,bottom-left,bottom-roght)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM