Shulou(Shulou.com)06/03 Report--

This article will explain in detail how to implement custom letter selection sidebar in Android. The editor thinks it is very practical, so I share it with you as a reference. I hope you can get something after reading this article.

The details are as follows

LetterSideBar.java

Package com.zb.customview.widgets; import android.content.Context;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Rect;import android.text.TextUtils;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View; import androidx.annotation.Nullable; import com.zb.customview.R; public class LetterSideBar extends View {private Paint mPaint; private int color, selectedColor; private float textSize, spacing Private String mChoosing = "Z"; private OnLetterSelectedListener listener; private int width, height Private String [] LETTERS = new String [] {"#", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U" "V", "W", "X", "Y", "Z"} Public interface OnLetterSelectedListener {/ / empty means to uncheck void onSelected (String letter);} public void setOnLetterSelectedListener (OnLetterSelectedListener listener) {this.listener = listener;} public LetterSideBar (Context context) {this (context, null);} public LetterSideBar (Context context, @ Nullable AttributeSet attrs) {super (context, attrs) If (null! = attrs) {TypedArray ta = context.obtainStyledAttributes (attrs, R.styleable.LetterSideBar); color = ta.getColor (R.styleable.LetterSideBar_LetterSideBar_textColor, Color.BLACK); selectedColor = ta.getColor (R.styleable.LetterSideBar_LetterSideBar_textSelectedColor, Color.RED); textSize = ta.getDimensionPixelSize (R.styleable.LetterSideBar_LetterSideBar_textSize, sp2px (12)) Spacing = ta.getDimensionPixelSize (R.styleable.LetterSideBar_LetterSideBar_spacing, dp2px (5)); ta.recycle ();} init ();} private void init () {mPaint = new Paint (); mPaint.setAntiAlias (true); mPaint.setColor (color); mPaint.setTextSize (textSize) } @ Override protected void onDraw (Canvas canvas) {drawText (canvas); drawSelectedText (canvas, mChoosing);} private void drawText (Canvas canvas) {mPaint.setColor (color); for (int iTuno; iTun0 & & position

< LETTERS.length) { //合规位置 String letter = LETTERS[position]; if(!letter.equals(mChoosing)) { //与选中的不符 去刷新控件 mChoosing = letter; performListener(mChoosing); invalidate(); } } else { //不合规位置 if(null != mChoosing) { mChoosing = null; performListener(mChoosing); invalidate(); } } } else if(null != mChoosing) { //点击事件不在view内部 mChoosing = null; performListener(mChoosing); invalidate();//触摸在view之外 取消选中 } return true; default: if(mChoosing != null) { mChoosing = null; performListener(mChoosing); invalidate(); } break; } return super.onTouchEvent(event); } private void performListener(String letter) { if(null != listener) listener.onSelected(letter); } private boolean isTouchInsideView(float x, float y) { //左右可以适当判断在控件内 if(x >

= 0 & & x = getPaddingTop () & & y < height) return true; return false;} / * calculate the location of the touch * @ param y * @ return * / private int caculatePosition (float y) {float heightWithOutPadding = height-getPaddingTop ()-getPaddingBottom (); float eachElementHeight = heightWithOutPadding / LETTERS.length; y-= getPaddingTop () Int position = (int) (y / eachElementHeight); return position;} private void drawLetterAt (Canvas canvas, int position, String letter) {float heightForEach = ((height * 1f-getPaddingTop ()-getPaddingBottom ())-(LETTERS.length-1) * spacing) / LETTERS.length; float spacingInUp = spacing * (position-1); if (spacingInUp < 0) spacingInUp = 0 Float currentTop = getPaddingTop () + (heightForEach * position) + spacingInUp; float currentBottom = currentTop + heightForEach; Paint.FontMetrics fmi = mPaint.getFontMetrics (); float x = (width-getPaddingLeft ()-getPaddingRight ()-mPaint.measureText (letter)) / 2f + getPaddingLeft (); float baseLine = (fmi.descent + Math.abs (fmi.ascent)) / 2f-fmi.descent; float y = (currentBottom + currentTop) / 2f + baseLine Canvas.drawText (letter, 0,1, x, y, mPaint);} @ Override protected void onLayout (boolean changed, int left, int top, int right, int bottom) {super.onLayout (changed, left, top, right, bottom); if (changed) {width = getWidth (); height = getHeight () } @ Override protected void onMeasure (int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure (widthMeasureSpec, heightMeasureSpec); int textWidth = (int) (getPaddingLeft () + getPaddingRight () + mPaint.measureText ("A")); Rect textBounds = new Rect (); mPaint.getTextBounds ("A", 0,1, textBounds); int singleTextHeight = textBounds.height () Int totalHeight = (int) (27f * singleTextHeight + 26f * spacing) + getPaddingBottom () + getPaddingTop (); / / 26 letters + 1 # int widthMode = MeasureSpec.getMode (widthMeasureSpec); int heightMode = MeasureSpec.getMode (widthMeasureSpec); int specWidth = MeasureSpec.getSize (widthMeasureSpec); int specHeight = MeasureSpec.getSize (widthMeasureSpec); int realWidth, realHeight; if (widthMode = MeasureSpec.EXACTLY) {realWidth = specWidth } else {realWidth = textWidth;} if (heightMode = = MeasureSpec.EXACTLY) {realHeight = specHeight;} else {realHeight = totalHeight;} setMeasuredDimension (realWidth, realHeight);} protected int dp2px (int dp) {return (int) (getContext (). GetResources (). GetDisplayMetrics (). Density * dp + 0.5) } protected int sp2px (int sp) {return (int) (getContext (). GetResources (). GetDisplayMetrics (). ScaledDensity * sp + 0.5);}}

Attrs.xml

Layout.xml

Used in the code

SideBar.setOnLetterSelectedListener (new LetterSideBar.OnLetterSelectedListener () {@ Override public void onSelected (String letter) {if (TextUtils.isEmpty (letter)) {P.P ("unchecked"); letterTxt.setVisibility (View.GONE);} else {P.P ("selected" + letter)) LetterTxt.setText (letter); letterTxt.setVisibility (View.VISIBLE);}) On "Android how to achieve custom letter selection sidebar" this article is shared here, I hope the above content can be of some help to you, so that you can learn more knowledge, if you think the article is good, please share it out for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.