相信大家一定见过这样的一个效果吧,也相信大家也在网上找到了许多的例子,但是大多的都是残缺不全的,没能真正的实现大家的一个效果吧,那么今天我就和大家分享我的这个完全的源代码,希望能对大家有所帮助吧,需要的人可以直接拿过去用,至于技术点嘛,其实没什么的,对于获取拼音的用到了一个pinyin4j-2.5.0.jar这个jar包,可以帮助我们实现效果。
还是直接上效果图,之后再上源码吧。
先看旁边的那个26个字母控件的实现:
自己画了出26个字母。
- public class MySideBar extends View {
- OnTouchingLetterChangedListener onTouchingLetterChangedListener;
- // 26个字母
- public static String[] b = { "#", "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" };
- int choose = -1;
- Paint paint = new Paint();
- public MySideBar(Context context, AttributeSet attrs, int defStyle) {
- super(context, attrs, defStyle);
- }
- public MySideBar(Context context, AttributeSet attrs) {
- super(context, attrs);
- }
- public MySideBar(Context context) {
- super(context);
- }
- /**
- * 重写这个方法
- */
- protected void onDraw(Canvas canvas) {
- super.onDraw(canvas);
- if (showBkg) {
- canvas.drawColor(Color.parseColor("#40000000"));
- }
- int height = getHeight();
- int width = getWidth();
- int singleHeight = height / b.length;
- for (int i = 0; i < b.length; i++) {
- paint.setColor(Color.BLACK);
- // paint.setColor(Color.WHITE);
- paint.setTypeface(Typeface.DEFAULT_BOLD);
- paint.setAntiAlias(true);
- paint.setTextSize(20);
- if (i == choose) {
- paint.setColor(Color.parseColor("#3399ff"));
- paint.setFakeBoldText(true);
- }
- float xPos = width / 2 - paint.measureText(b[i]) / 2;
- float yPos = singleHeight * i + singleHeight;
- canvas.drawText(b[i], xPos, yPos, paint);
- paint.reset();
- }
- }
- private boolean showBkg = false;
- @Override
- public boolean dispatchTouchEvent(MotionEvent event) {
- final int action = event.getAction();
- final float y = event.getY();
- final int oldChoose = choose;
- final OnTouchingLetterChangedListener listener = onTouchingLetterChangedListener;
- final int c = (int) (y / getHeight() * b.length);
- switch (action) {
- case MotionEvent.ACTION_DOWN:
- showBkg = true;
- if (oldChoose != c && listener != null) {
- if (c > 0 && c < b.length) {
- listener.onTouchingLetterChanged(b[c]);
- choose = c;
- invalidate();
- }
- }
- break;
- case MotionEvent.ACTION_MOVE:
- if (oldChoose != c && listener != null) {
- if (c > 0 && c < b.length) {
- listener.onTouchingLetterChanged(b[c]);
- choose = c;
- invalidate();
- }
- }
- break;
- case MotionEvent.ACTION_UP:
- showBkg = false;
- choose = -1;
- invalidate();
- break;
- }
- return true;
- }
- @Override
- public boolean onTouchEvent(MotionEvent event) {
- return super.onTouchEvent(event);
- }
- /**
- * 向外公开的方法
- *
- * @param onTouchingLetterChangedListener
- */
- public void setOnTouchingLetterChangedListener(
- OnTouchingLetterChangedListener onTouchingLetterChangedListener) {
- this.onTouchingLetterChangedListener = onTouchingLetterChangedListener;
- }
- /**
- * 接口
- *
- * @author coder
- *
- */
- public interface OnTouchingLetterChangedListener {
- public void onTouchingLetterChanged(String s);
- }
- }
再看布局文件的实现,这里用到FrameLayout来实现
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:orientation="vertical" >
- <FrameLayout
- android:id="@+id/llParent"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:orientation="vertical" >
- <ListView
- android:id="@+id/lvShow"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent" />
- <TextView
- android:id="@+id/tvLetter"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center"
- android:background="@drawable/show_head_toast_bg"
- android:gravity="center"
- android:maxWidth="70dip"
- android:minWidth="70dip"
- android:padding="10dip"
- android:textColor="#99FFFFFF"
- android:textSize="50sp" >
- </TextView>
- <com.jiahui.view.MySideBar
- android:id="@+id/myView"
- android:layout_width="30dip"
- android:layout_height="fill_parent"
- android:layout_gravity="right" >
- </com.jiahui.view.MySideBar>
- </FrameLayout>
- </LinearLayout>
接下来再看Activity里的实现了,详细的请直接看代码吧,不懂的可以加Q
- public class TestActivity extends Activity implements
- OnTouchingLetterChangedListener {
- private ListView lvShow;
- private List<UserInfo> userInfos;
- private TextView overlay;
- private MySideBar myView;
- private MyUserInfoAdapter adapter;
- private OverlayThread overlayThread = new OverlayThread();
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- // TODO Auto-generated method stub
- super.onCreate(savedInstanceState);
- setContentView(R.layout.main);
- lvShow = (ListView) findViewById(R.id.lvShow);
- myView = (MySideBar) findViewById(R.id.myView);
- overlay = (TextView) findViewById(R.id.tvLetter);
- lvShow.setTextFilterEnabled(true);
- overlay.setVisibility(View.INVISIBLE);
- getUserInfos();
- Log.i("coder", "userInfos.size" + userInfos.size());
- adapter = new MyUserInfoAdapter(this, userInfos);
- lvShow.setAdapter(adapter);
- myView.setOnTouchingLetterChangedListener(this);
- }
- private void getUserInfos() {
- UserInfo[] userinfoArray = new UserInfo[] {
- new UserInfo("唐僧", "18765432345", PinyinUtils.getAlpha("唐僧")),
- new UserInfo("猪师弟", "18765432345", PinyinUtils.getAlpha("猪师弟")),
- new UserInfo("阿呆", "18765432345", PinyinUtils.getAlpha("阿呆")),
- new UserInfo("8899", "18765432345",
- PinyinUtils.getAlpha("8899")),
- new UserInfo("孙悟空", "18765432345", PinyinUtils.getAlpha("孙悟空")),
- new UserInfo("阿三", "18765432345", PinyinUtils.getAlpha("阿三")),
- new UserInfo("张三", "18765432345", PinyinUtils.getAlpha("张三")),
- new UserInfo("张二B", "18876569008", PinyinUtils.getAlpha("张二B")),
- new UserInfo("阿三", "18765432345", PinyinUtils.getAlpha("阿三")),
- new UserInfo("张三", "18765432345", PinyinUtils.getAlpha("张三")),
- new UserInfo("张二B", "18876569008", PinyinUtils.getAlpha("张二B")),
- new UserInfo("阿三", "18765432345", PinyinUtils.getAlpha("阿三")),
- new UserInfo("张三", "18765432345", PinyinUtils.getAlpha("张三")),
- new UserInfo("张二B", "18876569008", PinyinUtils.getAlpha("张二B")),
- new UserInfo("阿三", "18765432345", PinyinUtils.getAlpha("阿三")),
- new UserInfo("张三", "18765432345", PinyinUtils.getAlpha("张三")),
- new UserInfo("张二B", "18876569008", PinyinUtils.getAlpha("张二B")),
- new UserInfo("李四", "18909876545", PinyinUtils.getAlpha("李四")),
- new UserInfo("王小二", "18909876545", PinyinUtils.getAlpha("王小二")),
- new UserInfo("张三丰", "18909876545", PinyinUtils.getAlpha("张三丰")),
- new UserInfo("郭靖", "18909876545", PinyinUtils.getAlpha("郭靖")),
- new UserInfo("张无忌", "18909876545", PinyinUtils.getAlpha("张无忌")),
- new UserInfo("黄小贤", "18909876545", PinyinUtils.getAlpha("黄小贤")) };
- Arrays.sort(userinfoArray, new PinyinComparator());
- userInfos = Arrays.asList(userinfoArray);
- }
- private Handler handler = new Handler() {
- };
- private class OverlayThread implements Runnable {
- public void run() {
- overlay.setVisibility(View.GONE);
- }
- }
- @Override
- public void onTouchingLetterChanged(String s) {
- Log.i("coder", "s:" + s);
- overlay.setText(s);
- overlay.setVisibility(View.VISIBLE);
- handler.removeCallbacks(overlayThread);
- handler.postDelayed(overlayThread, 1000);
- if (alphaIndexer(s) > 0) {
- int position = alphaIndexer(s);
- Log.i("coder", "position:" + position);
- lvShow.setSelection(position);
- }
- }
- public int alphaIndexer(String s) {
- int position = 0;
- for (int i = 0; i < userInfos.size(); i++) {
- if (userInfos.get(i).getPy().startsWith(s)) {
- position = i;
- break;
- }
- }
- Log.i("coder", "i" + position + userInfos.get(position));
- return position;
- }
- }
好了这样的一效果就算完成了,也希望大家能分享更多的东西出来,大家一起成长一起学习!
本文系转载,原文出处http://blog.csdn.net/jiahui524/article/details/7785606,若不慎冒犯作者,请与我联系,谢谢!