【移动应用开发技术】如何在android中自定义圆角button效果

【移动应用开发技术】如何在android中自定义圆角button效果

这篇文章将为大家详细讲解有关如何在android中自定义圆角button效果，文章内容质量较高，因此在下分享给大家做个参考，希望大家阅读完这篇文章后对相关知识有一定的了解。源码RoundRadiusButton.java/**

*

author:

xujiajia

*

description:

*

1、drawable只有在设置textString的时候才会生效(居中效果两个一起测量)

*/

public

class

RoundRadiusButton

extends

View

{

//data

private

int

width

=

0;

private

int

height

=

0;

private

int

roundRadius

=

16;

private

int

bgColor

=

Color.LTGRAY;

private

boolean

isTouching

=

false;

//img

and

text

private

Drawable

leftDrawable

=

null;

private

int

drawableWidth

=

20;

private

int

drawableHeight

=

20;

private

int

leftDrawablePaddingRight

=

0;

private

String

textString;

private

int

textSize

=

30;

private

int

textColor

=

Color.BLACK;

//onDraw

Paint

paint;

Path

path;

RectF

rectF;

Rect

rect;

public

RoundRadiusButton(Context

context,

int

width,

int

height)

{

super(context);

this.width

=

width;

this.height

=

height;

this.setLayoutParams(new

ViewGroup.LayoutParams(width,

height));

this.setClickable(true);

}

public

RoundRadiusButton(Context

context,

AttributeSet

attrs)

{

super(context,

attrs);

getDataFromAttrs(context,

attrs);

this.setClickable(true);

}

public

RoundRadiusButton(Context

context,

AttributeSet

attrs,

int

defStyleAttr)

{

super(context,

attrs,

defStyleAttr);

getDataFromAttrs(context,

attrs);

this.setClickable(true);

}

private

void

getDataFromAttrs(Context

context,

AttributeSet

attrs)

{

if

(attrs

==

null)

{

return;

}

TypedArray

ta

=

context.obtainStyledAttributes(attrs,

R.styleable.RoundRadiusButton);

roundRadius

=

ta.getDimensionPixelOffset(R.styleable.RoundRadiusButton_roundRadius,

16);

bgColor

=

ta.getColor(R.styleable.RoundRadiusButton_bgColor,

Color.LTGRAY);

leftDrawable

=

ta.getDrawable(R.styleable.RoundRadiusButton_leftDrawable);

drawableWidth

=

ta.getDimensionPixelOffset(R.styleable.RoundRadiusButton_drawableWidth,

0);

drawableHeight

=

ta.getDimensionPixelOffset(R.styleable.RoundRadiusButton_drawableHeight,

0);

leftDrawablePaddingRight

=

ta.getDimensionPixelOffset(R.styleable.RoundRadiusButton_leftDrawablePaddingRight,

0);

textString

=

ta.getString(R.styleable.RoundRadiusButton_textString);

textSize

=

ta.getDimensionPixelOffset(R.styleable.RoundRadiusButton_textSize,

0);

textColor

=

ta.getColor(R.styleable.RoundRadiusButton_textColor,

Color.BLACK);

ta.recycle();

}

public

void

setRoundRadius(int

roundRadius)

{

this.roundRadius

=

roundRadius;

invalidate();

}

public

void

setBgColor(int

bgColor)

{

this.bgColor

=

bgColor;

invalidate();

}

public

void

setLeftDrawable(Drawable

leftDrawable,

int

drawableWidth,

int

drawableHeight,

int

paddingRight)

{

this.leftDrawable

=

leftDrawable;

this.drawableWidth

=

drawableWidth;

this.drawableHeight

=

drawableHeight;

this.leftDrawablePaddingRight

=

paddingRight;

invalidate();

}

public

void

setTextString(String

textString)

{

this.textString

=

textString;

invalidate();

}

public

void

setTextColor(int

textColor)

{

this.textColor

=

textColor;

invalidate();

}

public

void

setTextSize(int

textSize)

{

this.textSize

=

textSize;

invalidate();

}

@Override

public

boolean

onTouchEvent(MotionEvent

event)

{

if

(isClickable())

{

switch

(event.getAction())

{

case

MotionEvent.ACTION_DOWN:

isTouching

=

true;

invalidate();

break;

case

MotionEvent.ACTION_UP:

isTouching

=

false;

invalidate();

break;

}

}

return

super.onTouchEvent(event);

}

@Override

protected

void

onDraw(Canvas

canvas)

{

super.onDraw(canvas);

if

(width

==

0

||

height

==

0)

{

width

=

getWidth();

height

=

getHeight();

}

if

(paint

==

null)

{

paint

=

new

Paint();

}

if

(path

==

null)

{

path

=

new

Path();

}

if

(rectF

==

null)

{

rectF

=

new

RectF();

}

if

(rect

==

null)

{

rect

=

new

Rect();

}

paint.setColor(bgColor);

paint.setAntiAlias(true);//抗锯齿

paint.setStrokeWidth(0);//线的宽度设为0，避免画圆弧的时候部分圆弧与边界相切

paint.setStyle(Paint.Style.FILL_AND_STROKE);

path.setFillType(Path.FillType.WINDING);

//左上圆角

path.moveTo(0,

roundRadius);

rectF.set(0,

0,

2

*

roundRadius,

2

*

roundRadius);

path.addArc(rectF,

180,

90);

//上边

path.lineTo(width

-

roundRadius,

0);

//右上圆角

rectF.set(width

-

roundRadius

*

2,

0,

width,

roundRadius

*

2);

path.addArc(rectF,

-90,

90);

//右边

path.lineTo(width,

height

-

roundRadius);

//右下圆角

rectF.set(width

-

roundRadius

*

2,

height

-

roundRadius

*

2,

width,

height);

path.addArc(rectF,

0,

90);

//下边

path.lineTo(roundRadius,

height);

//左下圆角

rectF.set(0,

height

-

roundRadius

*

2,

2

*

roundRadius,

height);

path.addArc(rectF,

90,

90);

//左边

path.lineTo(0,

roundRadius);

path.close();

canvas.drawPath(path,

paint);

if

(isTouching)

{

paint.setColor(getContext().getResources().getColor(R.color.black_tran_30));

canvas.drawPath(path,

paint);

}

//填充背景中间空白的部分

path.moveTo(0,

roundRadius);

path.lineTo(width

-

roundRadius,

0);

path.lineTo(width,

height

-

roundRadius);

path.lineTo(roundRadius,

height);

path.close();

canvas.drawPath(path,

paint);

if

(isTouching)

{

paint.setColor(getContext().getResources().getColor(R.color.black_tran_30));

canvas.drawPath(path,

paint);

}

//text,

drawable两个一起计算位置

if

(!TextUtils.isEmpty(textString))

{

paint.setStrokeWidth(1.5f);

paint.setColor(textColor);

paint.setTextSize(textSize);

rect.setEmpty();

paint.getTextBounds(textString,

0,

textString.length(),

rect);

float

leftBitmap

=

0;

float

topBitmap

=

0;

if

(leftDrawable

!=

null)

{

if

(leftDrawable

!=

null)

{

leftBitmap

=

(1.0f

*

width

-

drawableWidth

-

rect.width()

-

leftDrawablePaddingRight)

/

2;

topBitmap

=

(1.0f

*

height

-

drawableHeight)

/

2;

leftDrawable.setBounds((int)

leftBitmap,

(int)

topBitmap,

(int)

(leftBitmap

+

drawableWidth),

(int)

(topBitmap

+

drawableHeight));

leftDrawable.draw(canvas);

}

}

float

textX

=

0;

float

textY

=

1.0f

*

height

/

2

+

paint.getTextSize()

/

2

-

paint.getFontMetrics().descent

/

2;

if

(leftBitmap

==

0

&&

topBitmap

==

0)

{

textX

=

width

/

2

-

rect.width()

/

2;

}

else

{

textX

=

leftBitmap

+

drawableWidth

+

leftDrawablePaddingRight;

}

canvas.drawText(textString,

textX,

textY,

paint);

}

}

}MainActivity.javapublic

class

MainActivity

extends

AppCompatActivity

{

private

LinearLayout

llContainer;

@Override

protected

void

onCreate(Bundle

savedInstanceState)

{

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

initView();

}

private

void

initView()

{

llContainer

=

findViewById(R.id.ll_container);

RoundRadiusButton

roundRadiusButton

=

new

RoundRadiusButton(this,

500,

200);

roundRadiusButton.setBgColor(Color.LTGRAY);

roundRadiusButton.setRoundRadius(40);

//text

roundRadiusButton.setTextString("testtesttest");

roundRadiusButton.setTextColor(Color.WHITE);

roundRadiusButton.setTextSize(40);

//drawable

roundRadiusButton.setLeftDrawable(getResources().getDrawable(R.mipmap.ic_launcher),

60,

60,

80);

roundRadiusButton.setOnClickListener(new

View.OnClickListener()

{

@Override

public

void

onClick(View

v)

{

Toast.makeText(MainActivity.this,

"testest",

Toast.LENGTH_LONG).show();

}

});

roundRadiusButton.setClickable(false);

llContainer.addView(roundRadiusButton);

}

}activity_main.xml<?xml

version="1.0"

encoding="utf-8"?>

<LinearLayout

xmlns:android="/apk/res/android"

xmlns:app="/apk/res-auto"

xmlns:tools="/tools"

android:id="@+id/ll_container"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#868684"

android:gravity="center"

android:orientation="vertical"

tools:context=".MainActivity"

>

<com.example.newbuttiontest.RoundRadiusButton

android:layout_width="300dp"

android:layout_height="200dp"

app:bgColor="#FFEB3B"

app:drawableHeight="18dp"

app:drawableWidth="18dp"

app:leftDrawable="@mipmap/ic_launcher"

app:leftDrawablePaddingRight="5dp"

app