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里的实现了,详细的请直接看代码吧
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; } }
好了这样的一效果就算完成了,也希望大家能分享更多的东西出来,大家一起成长一起学习!
欢迎热爱安卓开发的朋友们加入群讨论。广州超级群218251417,南京群 220818530,深圳群 260134856,西安群252746034,杭州群253603803,厦门群253604146