Android自定義字母選擇側邊欄
更新時間：2021年09月13日 16:34:25 作者：zbzbhahae
這篇文章主要為大家詳細介紹了Android自定義字母選擇側邊欄，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了Android自定義字母選擇側邊欄的具體代碼，供大家參考，具體內容如下
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 {
//空表示取消選中
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 i=0; i<LETTERS.length; i++) {
drawLetterAt(canvas, i, LETTERS[i]);
}
}
private void drawSelectedText(Canvas canvas, String selected) {
if(TextUtils.isEmpty(selected))
return;
mPaint.setColor(selectedColor);
int position = -1;
for(int i=0; i<LETTERS.length; i++) {
if(selected.equals(LETTERS[i])) {
position = i;
break;
}
}
if(position < 0 || position >= LETTERS.length)
return;
drawLetterAt(canvas, position, selected);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
int action = event.getAction();
switch (action) {
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
float x = event.getX();
float y = event.getY();
if(isTouchInsideView(x, y)) {
//觸摸在控件內
int position = caculatePosition(y);
if(position >= 0 && position < LETTERS.length) {
//合規(guī)位置
String letter = LETTERS[position];
if(!letter.equals(mChoosing)) { //與選中的不符 去刷新控件
mChoosing = letter;
performListener(mChoosing);
invalidate();
}
} else {
//不合規(guī)位置
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 <= width && y >= getPaddingTop() && y < height)
return true;
return false;
}
/**
* 計算觸摸的位置
* @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個字母+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
<declare-styleable name="LetterSideBar"> <attr name="LetterSideBar_textColor" format="color"/> <attr name="LetterSideBar_textSelectedColor" format="color"/> <attr name="LetterSideBar_textSize" format="dimension"/> <attr name="LetterSideBar_spacing" format="dimension"/> </declare-styleable>
layout.xml
<com.zb.customview.widgets.LetterSideBar
android:id="@+id/letterSideBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:LetterSideBar_textSize="14sp"
app:LetterSideBar_textColor="#FFFFFF"
android:padding="10dp"
app:LetterSideBar_textSelectedColor="#FF0000"
app:LetterSideBar_spacing="2dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:background="#A4A4A4"/>
代碼中使用
sideBar.setOnLetterSelectedListener(new LetterSideBar.OnLetterSelectedListener() {
@Override
public void onSelected(String letter) {
if(TextUtils.isEmpty(letter)) {
P.p("取消選中");
letterTxt.setVisibility(View.GONE);
} else {
P.p("選中" + letter);
letterTxt.setText(letter);
letterTxt.setVisibility(View.VISIBLE);
}
}
});
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
Android利用FlexboxLayout輕松實現(xiàn)流動布局
flexbox是屬于CSS的一種布局方案，可以簡單、完整、響應式的實現(xiàn)各種頁面布局。谷歌將其引入以提高復雜布局的能力。下面這篇文章主要給大家介紹了在Android中利用FlexboxLayout輕松實現(xiàn)流動布局的相關資料，需要的朋友可以參考借鑒，下面來一起看看吧。2017-04-04
這篇文章主要為大家詳細介紹了Android通過PHP服務器實現(xiàn)登錄功能的相關資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01
這篇文章主要為大家詳細介紹了Android實現(xiàn)垂直跑馬燈效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-04-04
Android實現(xiàn)pdf在線預覽或本地預覽的方法
下面小編就為大家分享一篇Android實現(xiàn)pdf在線預覽或本地預覽的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-01-01
android調用C語言實現(xiàn)內存的讀取與修改的方法示例
這篇文章主要介紹了android調用C語言實現(xiàn)內存的讀取與修改的方法示例，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-03-03
單純的自定義一個圓非常簡單 只需要幾步就完成 拖動圓添加實現(xiàn)觸摸事件即可 。接下來通過本文給大家分享Android自定義View圓形和拖動圓、跟隨手指拖動效果，感興趣的朋友一起看看吧2017-09-09
這篇文章主要介紹了Android 截圖功能源碼的分析的相關資料,希望通過本文能幫助到大家，需要的朋友可以參考下2017-09-09
Android最簡單的狀態(tài)切換布局實現(xiàn)教程
這篇文章主要給大家介紹了關于Android中最簡單的狀態(tài)切換布局的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2018-10-10
這篇文章主要介紹了Android通過startService播放背景音樂簡單示例，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2015-12-12
Android中導航組件Navigation的實現(xiàn)原理
大家好，本篇文章主要講的是Android中導航組件Navigation的實現(xiàn)原理，感興趣的同學趕快來看一看吧，對你有幫助的話記得收藏一下2022-02-02