8.快速索引、listview

实现这样的效果

布局：
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2.     xmlns:tools="http://schemas.android.com/tools"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="match_parent"
  5.     tools:context=".MainActivity" >
  7.     <ListView
  8.         android:id="@+id/lv_main"
  9.         android:layout_width="match_parent"
  10.         android:layout_height="match_parent" >
  11.     </ListView>
  13.     <com.itheima.quickindex.ui.QuickIndexBar
  14.         android:id="@+id/bar"
  15.         android:layout_width="30dp"
  16.         android:layout_height="match_parent"
  17.         android:layout_alignParentRight="true"
  18.         android:background="#ff0000" />
  20.     <TextView
  21.         android:id="@+id/tv_center"
  22.         android:layout_width="160dp"
  23.         android:layout_height="100dp"
  24.         android:background="@drawable/bg_index"
  25.         android:gravity="center"
  26.         android:textSize="32sp"
  27.         android:visibility="gone"
  28.         android:textColor="#ffffff"
  29.         android:layout_centerInParent="true"
  30.         android:text="A" />
  32. </RelativeLayout>
字的shape：
  1. <shape xmlns:android="http://schemas.android.com/apk/res/android"
  2.     android:shape="rectangle" >
  4.     <solid android:color="#66000000"/>
  5.     
  6.     <corners android:radius="20dp"/>
  7. </shape>
QuickIndexBar

  1. /**
  2.  * 快速索引
  3.  * 
  4.  * 用于根据字母快速定位联系人
  5.  * @author poplar
  6.  *
  7.  */
  8. public class QuickIndexBar extends View {
  9. 	
  10. 	private static final String[] LETTERS = new String[]{
  11. 		"A", "B", "C", "D", "E", "F",
  12. 		"G", "H", "I", "J", "K", "L",
  13. 		"M", "N", "O", "P", "Q", "R",
  14. 		"S", "T", "U", "V", "W", "X",
  15. 		"Y", "Z"};
  17. 	private static final String TAG = "TAG";
  18. 	
  19. 	private Paint mPaint;
  21. 	private int cellWidth;
  23. 	private float cellHeight;
  24. 	
  25. 	/**
  26. 	 * 暴露一个字母的监听，交给main执行
  27. 	 */
  28. 	public interface OnLetterUpdateListener{
  29. 		void onLetterUpdate(String letter);
  30. 	}
  31. 	private OnLetterUpdateListener listener;
  32. 	
  33. 	public OnLetterUpdateListener getListener() {
  34. 		return listener;
  35. 	}
  36. 	/**
  37. 	 * 设置字母更新监听
  38. 	 * @param listener
  39. 	 */
  40. 	public void setListener(OnLetterUpdateListener listener) {
  41. 		this.listener = listener;
  42. 	}
  44. 	public QuickIndexBar(Context context) {
  45. 		this(context, null);
  46. 	}
  48. 	public QuickIndexBar(Context context, AttributeSet attrs) {
  49. 		this(context, attrs, 0);//这样写，只需要在三个参数的构造函数初始化就可以了
  50. 	}
  52. 	public QuickIndexBar(Context context, AttributeSet attrs, int defStyle) {
  53. 		super(context, attrs, defStyle);
  54. 		
  55. 		mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
  56. 		mPaint.setColor(Color.WHITE);
  57. 		mPaint.setTypeface(Typeface.DEFAULT_BOLD);//当点中的时候变粗
  58. 	}
  59. 	
  60. 	@Override
  61. 	protected void onDraw(Canvas canvas) {
  62. 		
  63. 		for (int i = 0; i < LETTERS.length; i++) {
  64. 			String text = LETTERS[i];
  65. 			// 计算坐标
  66. 			int x = (int) (cellWidth / 2.0f - mPaint.measureText(text) / 2.0f);//先转成float再转成int，因为有可能丢失精度
  67. 			// 获取文本的高度
  68. 			Rect bounds = new Rect();// 矩形
  69. 			mPaint.getTextBounds(text, 0, text.length(), bounds);//字是矩形，通过矩形获得高
  70. 			int textHeight = bounds.height();
  71. 			int y = (int) (cellHeight / 2.0f + textHeight / 2.0f + i * cellHeight);
  72. 			
  73. 			// 根据按下的字母, 设置画笔颜色
  74. 			mPaint.setColor(touchIndex == i ? Color.GRAY : Color.WHITE);
  75. 			
  76. 			// 绘制文本A-Z
  77. 			canvas.drawText(text, x, y, mPaint);
  78. 		}
  79. 	}
  80. 	
  81. 	int touchIndex = -1;
  82. 	@Override
  83. 	public boolean onTouchEvent(MotionEvent event) {
  84. 		int index = -1;
  85. 		switch (MotionEventCompat.getActionMasked(event)) {
  86. 			case MotionEvent.ACTION_DOWN:
  87. 				// 获取当前触摸到的字母索引
  88. 				index = (int) (event.getY() / cellHeight);
  89. 				if(index >= 0 && index < LETTERS.length){
  90. 					// 判断是否跟上一次触摸到的一样
  91. 					if(index != touchIndex) {
  92. 						if(listener != null){
  93. 							listener.onLetterUpdate(LETTERS[index]);
  94. 						}
  95. 						Log.d(TAG, "onTouchEvent: " + LETTERS[index]);
  96. 						
  97. 						touchIndex = index;
  98. 					}
  99. 				}
  100. 				
  101. 				break;
  102. 			case MotionEvent.ACTION_MOVE:
  103. 				index = (int) (event.getY() / cellHeight);
  104. 				if(index >= 0 && index < LETTERS.length){
  105. 					// 判断是否跟上一次触摸到的一样
  106. 					if(index != touchIndex){
  107. 						
  108. 						if(listener != null){
  109. 							listener.onLetterUpdate(LETTERS[index]);
  110. 						}
  111. 						Log.d(TAG, "onTouchEvent: " + LETTERS[index]);
  112. 						
  113. 						touchIndex = index;
  114. 					}
  115. 				}
  116. 				break;
  117. 			case MotionEvent.ACTION_UP:
  118. 				touchIndex = -1;
  119. 				break;
  120. 	
  121. 			default:
  122. 				break;
  123. 		}
  124. 		invalidate();
  125. 		
  126. 		return true;
  127. 	}
  128. 	
  129. 	@Override
  130. 	protected void onSizeChanged(int w, int h, int oldw, int oldh) {
  131. 		super.onSizeChanged(w, h, oldw, oldh);
  132. 		// 获取单元格的宽和高
  133. 		
  134. 		cellWidth = getMeasuredWidth();
  135. 		
  136. 		int mHeight = getMeasuredHeight();
  137. 		cellHeight = mHeight * 1.0f / LETTERS.length;
  138. 		
  139. 	}
  140. 	
  141. 	
  142. }
PinyinUtils
  1. public class PinyinUtils {
  3. 	/**
  4. 	 * 根据传入的字符串(包含汉字),得到拼音
  5. 	 * 黑马 -> HEIMA
  6. 	 * 黑  马*& -> HEIMA
  7. 	 * 黑马f5 -> HEIMA
  8. 	 * @param str 字符串
  9. 	 * @return
  10. 	 */
  11. 	public static String getPinyin(String str) {
  12. 		
  13. 		HanyuPinyinOutputFormat format = new HanyuPinyinOutputFormat();
  14. 		format.setCaseType(HanyuPinyinCaseType.UPPERCASE);
  15. 		format.setToneType(HanyuPinyinToneType.WITHOUT_TONE);
  16. 		
  17. 		StringBuilder sb = new StringBuilder();
  18. 		
  19. 		char[] charArray = str.toCharArray();
  20. 		for (int i = 0; i < charArray.length; i++) {
  21. 			char c = charArray[i];
  22. 			// 如果是空格, 跳过
  23. 			if(Character.isWhitespace(c)){
  24. 				continue;
  25. 			}
  26. 			if(c >= -127 && c < 128){
  27. 				// 肯定不是汉字
  28. 				sb.append(c);
  29. 			}else {
  30. 				String s = "";
  31. 				try {
  32. 					// 通过char得到拼音集合. 单 -> dan, shan 
  33. 					s = PinyinHelper.toHanyuPinyinStringArray(c, format)[0];
  34. 					sb.append(s);
  35. 				} catch (BadHanyuPinyinOutputFormatCombination e) {
  36. 					e.printStackTrace();
  37. 					sb.append(s);
  38. 				}
  39. 			}
  40. 		}
  41. 		
  42. 		return sb.toString();
  43. 	}
  45. }
Person
  1. public class Person implements Comparable<Person>{//实现比较功能
  3. 	private String name;
  4. 	private String pinyin;
  6. 	public Person(String name) {
  7. 		super();
  8. 		this.name = name;
  9. 		this.pinyin = PinyinUtils.getPinyin(name);
  10. 	}
  11. 	
  12. 	public String getName() {
  13. 		return name;
  14. 	}
  15. 	public void setName(String name) {
  16. 		this.name = name;
  17. 	}
  18. 	public String getPinyin() {
  19. 		return pinyin;
  20. 	}
  21. 	public void setPinyin(String pinyin) {
  22. 		this.pinyin = pinyin;
  23. 	}
  25. 	@Override
  26. 	public int compareTo(Person another) {
  27. 		return this.pinyin.compareTo(another.getPinyin());
  28. 	}
  29. 	
  30. 	
  31. 	
  32. }
adapter布局
  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2.     android:layout_width="match_parent"
  3.     android:layout_height="match_parent"
  4.     android:orientation="vertical" >
  6.     <TextView
  7.         android:id="@+id/tv_index"
  8.         android:layout_width="match_parent"
  9.         android:layout_height="40dp"
  10.         android:background="#888888"
  11.         android:gravity="center_vertical"
  12.         android:paddingLeft="20dp"
  13.         android:text="A"
  14.         android:textColor="#ffffff"
  15.         android:textSize="20sp" />
  17.     <TextView
  18.         android:id="@+id/tv_name"
  19.         android:layout_width="match_parent"
  20.         android:layout_height="50dp"
  21.         android:gravity="center_vertical"
  22.         android:paddingLeft="20dp"
  23.         android:text="宋江"
  24.         android:textSize="24sp" />
  26. </LinearLayout>
HaoHanAdapter
  1. public class HaoHanAdapter extends BaseAdapter {
  3. 	private Context mContext;
  4. 	private ArrayList<Person> persons;
  6. 	public HaoHanAdapter(Context mContext, ArrayList<Person> persons) {
  7. 		this.mContext = mContext;
  8. 		this.persons = persons;
  9. 	}
  11. 	@Override
  12. 	public int getCount() {
  13. 		// TODO Auto-generated method stub
  14. 		return persons.size();
  15. 	}
  17. 	@Override
  18. 	public Object getItem(int position) {
  19. 		return persons.get(position);
  20. 	}
  22. 	@Override
  23. 	public long getItemId(int position) {
  24. 		return position;
  25. 	}
  27. 	@Override
  28. 	public View getView(int position, View convertView, ViewGroup parent) {
  29. 		
  30. 		View view = convertView;
  31. 		if(convertView == null){
  32. 			view = view.inflate(mContext, R.layout.item_list, null);
  33. 		}
  34. 		ViewHolder mViewHolder = ViewHolder.getHolder(view);
  35. 		
  36. 		Person p = persons.get(position);
  37. 		
  38. 		String str = null;
  39. 		String currentLetter = p.getPinyin().charAt(0) + "";
  40. 		// 根据上一个首字母,决定当前是否显示字母
  41. 		if(position == 0){
  42. 			str = currentLetter;
  43. 		}else {
  44. 			// 上一个人的拼音的首字母
  45. 			String preLetter = persons.get(position - 1).getPinyin().charAt(0) + "";
  46. 			if(!TextUtils.equals(preLetter, currentLetter)){
  47. 				str = currentLetter;
  48. 			}
  49. 		}
  50. 		
  51. 		// 根据str是否为空,决定是否显示索引栏
  52. 		mViewHolder.mIndex.setVisibility(str == null ? View.GONE : View.VISIBLE);
  53. 		mViewHolder.mIndex.setText(currentLetter);
  54. 		mViewHolder.mName.setText(p.getName());
  55. 		
  56. 		return view;
  57. 	}
  58. 	
  59. 	static class ViewHolder {
  60. 		TextView mIndex;
  61. 		TextView mName;
  63. 		public static ViewHolder getHolder(View view) {//了解这种写法
  64. 			Object tag = view.getTag();
  65. 			if(tag != null){
  66. 				return (ViewHolder)tag;
  67. 			}else {
  68. 				ViewHolder viewHolder = new ViewHolder();
  69. 				viewHolder.mIndex = (TextView) view.findViewById(R.id.tv_index);
  70. 				viewHolder.mName = (TextView) view.findViewById(R.id.tv_name);
  71. 				view.setTag(viewHolder);
  72. 				return viewHolder;
  73. 			}
  74. 		}
  75. 		
  76. 	}
  78. }
MainActivity
  1. public class MainActivity extends Activity {
  3. 	private ListView mMainList;
  4. 	private ArrayList<Person> persons;
  5. 	private TextView tv_center;
  7. 	@Override
  8. 	protected void onCreate(Bundle savedInstanceState) {
  9. 		super.onCreate(savedInstanceState);
  10. 		setContentView(R.layout.activity_main);
  11. 		
  12. 		QuickIndexBar bar = (QuickIndexBar) findViewById(R.id.bar);
  13. 		// 设置监听，和回调一个意思
  14. 		bar.setListener(new OnLetterUpdateListener() {
  15. 			@Override
  16. 			public void onLetterUpdate(String letter) {
  17. //				Utils.showToast(getApplicationContext(), letter);
  18. 				
  19. 				showLetter(letter);
  20. 				// 根据字母定位ListView, 找到集合中第一个以letter为拼音首字母的对象,得到索引
  21. 				for (int i = 0; i < persons.size(); i++) {
  22. 					Person person = persons.get(i);
  23. 					String l = person.getPinyin().charAt(0) + "";
  24. 					if(TextUtils.equals(letter, l)){
  25. 						// 匹配成功
  26. 						mMainList.setSelection(i);
  27. 						break;
  28. 					}
  29. 				}
  30. 			}
  31. 		});
  32. 		
  33. 		mMainList = (ListView) findViewById(R.id.lv_main);
  34. 		
  35. 		persons = new ArrayList<Person>();
  36. 		
  37. 		// 填充数据 , 排序
  38. 		fillAndSortData(persons);
  39. 		
  40. 		mMainList.setAdapter(new HaoHanAdapter(MainActivity.this , persons));
  41. 		
  42. 		tv_center = (TextView) findViewById(R.id.tv_center);
  43. 		
  44. 		
  45. 	}
  47. 	private Handler mHandler = new Handler();
  48. 	
  49. 	/**
  50. 	 * 显示字母
  51. 	 * @param letter
  52. 	 */
  53. 	protected void showLetter(String letter) {
  54. 		tv_center.setVisibility(View.VISIBLE);
  55. 		tv_center.setText(letter);
  56. 		
  57. 		mHandler.removeCallbacksAndMessages(null);
  58. 		mHandler.postDelayed(new Runnable() {
  59. 			@Override
  60. 			public void run() {
  61. 				tv_center.setVisibility(View.GONE);				
  62. 			}
  63. 		}, 2000);
  64. 		
  65. 	}
  67. 	private void fillAndSortData(ArrayList<Person> persons) {
  68. 		// 填充数据
  69. 		for (int i = 0; i < Cheeses.NAMES.length; i++) {
  70. 			String name = Cheeses.NAMES[i];
  71. 			persons.add(new Person(name));
  72. 		}
  73. 		
  74. 		// 进行排序
  75. 		Collections.sort(persons);
  76. 	}
  77. }








附件列表

     

    posted @ 2015-12-12 22:05  梦和远方  阅读(208)  评论(0)  编辑  收藏  举报