How to customize fillet button effect by android
This article mainly shows you "android how to customize fillet button effect", the content is easy to understand, clear, hope to help you solve doubts, the following let the editor lead you to study and learn "android how to customize fillet button effect" this article.
The main functions are:
Custom fillet size supports setting leftDrawable, and custom text content (text and img are centered by default) supports click effect
Source code
RoundRadiusButton.java
/ * author: xujiajia * description: * 1. Drawable takes effect only when textString is set (both centered effects are measured together) * / 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); / / Anti-aliasing paint.setStrokeWidth (0) / / the width of the line is set to 0 to avoid some arcs tangent to the boundary paint.setStyle (Paint.Style.FILL_AND_STROKE); path.setFillType (Path.FillType.WINDING); / / upper left fillet path.moveTo (0, roundRadius); rectF.set (0,0,2 * roundRadius, 2 * roundRadius); path.addArc (rectF, 180,90); / / upper path.lineTo (width-roundRadius, 0) / / upper right fillet rectF.set (width-roundRadius * 2,0, width, roundRadius * 2); path.addArc (rectF,-90,90); / / right path.lineTo (width, height-roundRadius); / / lower right fillet rectF.set (width-roundRadius * 2, height-roundRadius * 2, width, height); path.addArc (rectF, 0,90); / / lower path.lineTo (roundRadius, height) / / bottom left fillet rectF.set (0, height-roundRadius * 2,2 * roundRadius, height); path.addArc (rectF, 90,90); / / left 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);} / fill in the blank space in the background 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 two calculate positions 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.java
Public 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
Attrs.xml
Colors.xml
# 30000000 above is all the content of the article "how to customize the fillet button effect by android". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!
