android通讯录右侧字母导航的简单实现

接着上一篇文章,在已经分组排序好了的expandableListView界面加上导航的功能,因为刚学安卓不久,一开始还挺怕这玩意儿的,后来看了网上的几篇文章,再加上自己的思路,做好了之后一想,其实也没有多复杂,而且还挺简单的.先上完成后的效果图：



关于字母导航的在网上大概有两种实现方法：

1,使用button或image控件

2,画图

其实原理都差不多,本文在这里用的是画图的方式.

首先,自定义一个类继承android.view.View类

/**
* 本类用来画出右侧的字母实现导航
* @author orathee
*/
public class MyLetterView extends View {

public SlideLetter mSlideLetter;

private Paint paint ;
private String[] sortKey = { "#", "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 MyLetterView(Context context) {
super(context);
}

public MyLetterView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}

public MyLetterView(Context context, AttributeSet attrs) {
super(context, attrs);
}

@Override
protected void onDraw(Canvas canvas) {
if(paint == null){
paint = new Paint();
}
paint.setColor(Color.GRAY);
paint.setTextSize(15);
for (int i = 0; i < sortKey.length; i++) {
canvas.drawText(sortKey[i], 8, 20 * (i + 1) + 100, paint);
}
super.onDraw(canvas);
}

@Override
public boolean onTouchEvent(MotionEvent event) {
if(mSlideLetter == null){//获取contactsLayout的实例
mSlideLetter = MainActivity.getmContactsLayout();
}
// 触发事件时获取当前坐标
int y = (int) event.getY();
//当前使用的是绝对坐标，对不不同机型待改进
if (y >= 100 && y <= 640) {
// 监听按下时的事件
if (event.getAction() == MotionEvent.ACTION_DOWN) {
mSlideLetter.showLetter();
// 监听抬起的事件
} else if (event.getAction() == MotionEvent.ACTION_UP) {
mSlideLetter.hideLetter();
}
// 监听move的事件，text随着手势移动
else if (event.getAction() == MotionEvent.ACTION_MOVE) {
mSlideLetter.showLetter();
}
int number = (y - 105) / 20;
String letter = sortKey[number];
mSlideLetter.showToast(letter);
invalidate();
} else {
mSlideLetter.hideLetter();
}
return true;
}

public interface SlideLetter {
/**
* 子母可见
*/
void showLetter();

/**
* 字母隐藏
*/
void hideLetter();
/**
* 显示子母
*/
void showToast(String letter);
}

}

本类主要是画出字母列和实现它的onTouch方法,另外SlideLetter接口需要实现它的三个方法

xml中view的配置：

<RelativeLayout
android:id="@+id/sort_layout"
android:layout_width="20dip"
android:layout_height="700dip"
android:layout_alignRight="@+id/expandableListView1" >

<com.out.view.MyLetterView
android:id="@+id/myView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
</RelativeLayout>

接口中三个方法的实现：

@Override
public void showLetter() {
sectionToastLayout.setVisibility(View.VISIBLE);
}

@Override
public void hideLetter() {
sectionToastLayout.setVisibility(View.GONE);
}

@Override
public void showToast(String letter) {
sectionToastText.setText(letter);
int position = adapter.getGroupPosition(letter);//获取需要显示字母的groupPosition
if (position != -1) {
exListView.setSelectedGroup(position);
}
}

这样就基本能够实现导航功能了,当然代码中还有很多的不足,比如：不能根据分辨率的大小适当的设置导航条的位置,还有待改进.