Android开发实现根据字母快速定位侧边栏

按首字母对List排列,并根据首字母快速定位的实现,在Android开发中被大量应用,今天我也来亲自实现一下,将这个控件封装起来,也方便以后的使用。大体上可以分为两步来实现这个控件:首先使自己的控件继承于View,并进行图形绘制;然后根据触摸位置计算当前触摸的字母,并实现回调接口的方法。

下面来进行实践:

1.创建自己的控件类并继承于View,注意:不能只声明含有一个构造参数Context的构造函数,这样我们的控件无法在xml文件中调用,因为Android中xml调用控件之间的参数传递是通过构造参数中的AttributeSet参数来进行的,没有这个参数我们的控件不能在xml中使用。在这里我添加了父类View的三个构造函数,这里只需要调用父类的构造函数即可,不需要额外的操作。

public QuicLocationBar(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr);
  // TODO Auto-generated constructor stub
 }
 
 public QuicLocationBar(Context context, AttributeSet attrs) {
  super(context, attrs);
  // TODO Auto-generated constructor stub
 }
 
 public QuicLocationBar(Context context) {
  super(context);
  // TODO Auto-generated constructor stub
 }

2.绘制字符:绘制的部分通过复写父类的onDraw方法来实现,并通过Paint来来绘制

1)首先声明一个成员变量来保存我们的字符数组,并初始化一个Paint类的成员变量来帮助我们绘制字符

private String characters[] = { "#", "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" };
 private Paint paint = new Paint();

2)根据总的高度除以字符串数组的长度来得到每一个字符的高度,然后循环遍历整个数组来绘制字符

@Override
  protected void onDraw(Canvas canvas) {
  // TODO Auto-generated method stub
  super.onDraw(canvas);
  int width = getWidth();
  int height = getHeight();
   int singleHeight = height / characters.length;
  for (int i = 0; i < characters.length; i++) {
   //对paint进行相关的参数设置
   paint.setColor(getResources().getColor(R.color.myblack));
   paint.setTypeface(Typeface.DEFAULT_BOLD);
   paint.setAntiAlias(true);
   paint.setTextSize(20);
   if (i == choose) {//choose变量表示当前触摸的字符位置,若没有触摸则为-1
    paint.setColor(getResources().getColor(R.color.myred));
    paint.setFakeBoldText(true);
   }
   //计算字符的绘制的位置
   float xPos = width / 2 - paint.measureText(characters[i]) / 2;
   float yPos = singleHeight * i + singleHeight;
   //在画布上绘制字符
   canvas.drawText(characters[i], xPos, yPos, paint);
   paint.reset();//每次绘制完成后不要忘记重制Paint
  }
 }

注意:不要忘记在每次绘制完成后重置Paint

3.处理触摸事件:通过复写父类的dispatchTouchEvent方法来实现

1)首先我们要设计一个回调接口,当我们触摸的字符发生改变时可以执行该回调接口的方法

public interface OnTouchLetterChangedListener {
  public void touchLetterChanged(String s);
 }

2)当发生按下事件或移动事件时,我们根据触摸点的位置计算出当前触摸的字符,如果和我们显示的字符不相同则执行回调接口的方法,并进行View的重绘;当发生抬起事件时我们将当前显示的字符更新为-1,表示当前没有字符显示,并进行View的重绘。

@Override
  public boolean dispatchTouchEvent(MotionEvent event) {
  int action = event.getAction();
  float y = event.getY();
  int c = (int) (y / getHeight() * characters.length);
 
  switch (action) {
  case MotionEvent.ACTION_UP:
   choose = -1;//
   setBackgroundColor(0x0000);
   invalidate();
   break;
 
  case MotionEvent.ACTION_DOWN:
  case MotionEvent.ACTION_MOVE:
   setBackgroundColor(getResources().getColor(R.color.darkgray));
   if (choose != c) {
    if (c >= 0 && c < characters.length) {
     if (mOnTouchLetterChangedListener != null) {
      mOnTouchLetterChangedListener
        .touchLetterChanged(characters[c]);
     }
     choose = c;
     invalidate();
    }
   }
   break;
  }
  return true;//返回true表示触摸事件不在向下分发
 }

附上整体源码:

package com.example.test.widget;
 
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Typeface;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.TextView;
 
import com.example.gymapp.R;
 
public class QuicLocationBar extends View {
 
 private String characters[] = { "#", "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" };
 private int choose = -1;
 private Paint paint = new Paint();
 private OnTouchLetterChangedListener mOnTouchLetterChangedListener;
 
 public QuicLocationBar(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr);
  // TODO Auto-generated constructor stub
 }
 
 public QuicLocationBar(Context context, AttributeSet attrs) {
  super(context, attrs);
  // TODO Auto-generated constructor stub
 }
 
 public QuicLocationBar(Context context) {
  super(context);
  // TODO Auto-generated constructor stub
 }
 
 public void setOnTouchLitterChangedListener(
   OnTouchLetterChangedListener onTouchLetterChangedListener) {
  this.mOnTouchLetterChangedListener = onTouchLetterChangedListener;
 }
 
 @Override
 protected void onDraw(Canvas canvas) {
  // TODO Auto-generated method stub
  super.onDraw(canvas);
  int width = getWidth();
  int height = getHeight();
  int singleHeight = height / characters.length;
  for (int i = 0; i < characters.length; i++) {
   // 对paint进行相关的参数设置
   paint.setColor(getResources().getColor(R.color.myblack));
   paint.setTypeface(Typeface.DEFAULT_BOLD);
   paint.setAntiAlias(true);
   paint.setTextSize(20);
   if (i == choose) {// choose变量表示当前显示的字符位置,若没有触摸则为-1
    paint.setColor(getResources().getColor(R.color.myred));
    paint.setFakeBoldText(true);
   }
   // 计算字符的绘制的位置
   float xPos = width / 2 - paint.measureText(characters[i]) / 2;
   float yPos = singleHeight * i + singleHeight;
   // 在画布上绘制字符
   canvas.drawText(characters[i], xPos, yPos, paint);
   paint.reset();// 每次绘制完成后不要忘记重制Paint
  }
 }
 
 
 @Override
 public boolean dispatchTouchEvent(MotionEvent event) {
  int action = event.getAction();
  float y = event.getY();
  int c = (int) (y / getHeight() * characters.length);
 
  switch (action) {
  case MotionEvent.ACTION_UP:
   choose = -1;//
   setBackgroundColor(0x0000);
   invalidate();
   break;
 
  case MotionEvent.ACTION_DOWN:
  case MotionEvent.ACTION_MOVE:
   setBackgroundColor(getResources().getColor(R.color.darkgray));
   if (choose != c) {
    if (c >= 0 && c < characters.length) {
     if (mOnTouchLetterChangedListener != null) {
      mOnTouchLetterChangedListener
        .touchLetterChanged(characters[c]);
     }
     choose = c;
     invalidate();
    }
   }
   break;
  }
  return true;
 }
 
 public interface OnTouchLetterChangedListener {
  public void touchLetterChanged(String s);
 }
 
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

你可能感兴趣的:(Android开发实现根据字母快速定位侧边栏)