android 自定义圆角button效果的实例代码（自定义view Demo）

2023-08-03 20:24:03 70

概述

在平时开发过程中经常会碰到需要使用圆角button的情况，一般也会包括很多其他小功能，比如要在里面添加img，设置不同的圆角大小等。

针对这样的场景，直接使用创建多个shape，定义多个xml文件也是可以实现的。但是如果使用非常频繁，那么直接自定义一个就会来的非常方便。

甚至在一些情况下，不是可以用shape定义的规则图形，比如需要用到贝塞尔曲线等。
如果全局需要这样风格的view，那么自定义一个View是非常必要的。

本文主要是个demo记录，如有需要的读者可以借鉴学习。

Demo

主要实现功能：

自定义圆角大小
支持设置leftDrawable，和自定义文字内容（文字和img默认居中）
支持点击效果

源码

RoundRadiusButton.java

/**
*author:xujiajia
*description:
*1、drawable只有在设置textString的时候才会生效(居中效果两个一起测量)
*/
publicclassRoundRadiusButtonextendsView{
//data
privateintwidth=0;
privateintheight=0;
privateintroundRadius=16;
privateintbgColor=Color.LTGRAY;
privatebooleanisTouching=false;
//imgandtext
privateDrawableleftDrawable=null;
privateintdrawableWidth=20;
privateintdrawableHeight=20;
privateintleftDrawablePaddingRight=0;
privateStringtextString;
privateinttextSize=30;
privateinttextColor=Color.BLACK;
//onDraw
Paintpaint;
Pathpath;
RectFrectF;
Rectrect;
publicRoundRadiusButton(Contextcontext,intwidth,intheight){
super(context);
this.width=width;
this.height=height;
this.setLayoutParams(newViewGroup.LayoutParams(width,height));
this.setClickable(true);
}
publicRoundRadiusButton(Contextcontext,AttributeSetattrs){
super(context,attrs);
getDataFromAttrs(context,attrs);
this.setClickable(true);
}
publicRoundRadiusButton(Contextcontext,AttributeSetattrs,intdefStyleAttr){
super(context,attrs,defStyleAttr);
getDataFromAttrs(context,attrs);
this.setClickable(true);
}
privatevoidgetDataFromAttrs(Contextcontext,AttributeSetattrs){
if(attrs==null){
return;
}
TypedArrayta=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();
}
publicvoidsetRoundRadius(introundRadius){
this.roundRadius=roundRadius;
invalidate();
}
publicvoidsetBgColor(intbgColor){
this.bgColor=bgColor;
invalidate();
}
publicvoidsetLeftDrawable(DrawableleftDrawable,intdrawableWidth,intdrawableHeight,
intpaddingRight){
this.leftDrawable=leftDrawable;
this.drawableWidth=drawableWidth;
this.drawableHeight=drawableHeight;
this.leftDrawablePaddingRight=paddingRight;
invalidate();
}
publicvoidsetTextString(StringtextString){
this.textString=textString;
invalidate();
}
publicvoidsetTextColor(inttextColor){
this.textColor=textColor;
invalidate();
}
publicvoidsetTextSize(inttextSize){
this.textSize=textSize;
invalidate();
}
@OverridepublicbooleanonTouchEvent(MotionEventevent){
if(isClickable()){
switch(event.getAction()){
caseMotionEvent.ACTION_DOWN:
isTouching=true;
invalidate();
break;
caseMotionEvent.ACTION_UP:
isTouching=false;
invalidate();
break;
}
}
returnsuper.onTouchEvent(event);
}
@OverrideprotectedvoidonDraw(Canvascanvas){
super.onDraw(canvas);
if(width==0||height==0){
width=getWidth();
height=getHeight();
}
if(paint==null){
paint=newPaint();
}
if(path==null){
path=newPath();
}
if(rectF==null){
rectF=newRectF();
}
if(rect==null){
rect=newRect();
}
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);
floatleftBitmap=0;
floattopBitmap=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);
}
}
floattextX=0;
floattextY=
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.java

publicclassMainActivityextendsAppCompatActivity{
privateLinearLayoutllContainer;
@Override
protectedvoidonCreate(BundlesavedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
privatevoidinitView(){
llContainer=findViewById(R.id.ll_container);
RoundRadiusButtonroundRadiusButton=newRoundRadiusButton(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(newView.OnClickListener(){
@OverridepublicvoidonClick(Viewv){
Toast.makeText(MainActivity.this,"testest",Toast.LENGTH_LONG).show();
}
});
roundRadiusButton.setClickable(false);
llContainer.addView(roundRadiusButton);
}
}

activity_main.xml

attrs.xml

colors.xml


#30000000

总结

以上所述是小编给大家介绍的android自定义圆角button效果的实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

android 自定义圆角button效果的实例代码（自定义view Demo）

热门推荐

随机推荐