自定义视图，快速索引
先从自定义控件代码来看吧
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Toast;
/**
* 自定义View 快速索引
* @author 李帅帅
*
*/
public class QuickIndexView extends View {
public QuickIndexView(Context context, AttributeSet attrs) {
super(context, attrs);
paint = new Paint();
paint.setAntiAlias(true);
}
private float itemWidth;// item的宽度
private float itemHight;// item的高度
private String[] indexArr = { "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;
/**
* 测量
*/
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
itemWidth = this.getWidth();
itemHight = this.getHeight() / 26f;
}
/**
* 画图
*/
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
for (int i = 0; i < indexArr.length; i++) {
if (i != index) {// 如果i不等于选中的item时
paint.setColor(Color.BLACK);
paint.setTextSize(16);
} else {
paint.setColor(Color.RED);// 当前操作的字母
paint.setTextSize(25);
}
String word = indexArr[i];
// 得到word的宽高
Rect bounds = new Rect();
paint.getTextBounds(word, 0, word.length(), bounds);
int wordWidth = bounds.width();
int wordHight = bounds.height();
// 定义左下角的坐标
float x = itemWidth / 2 - wordWidth / 2;
float y = itemHight / 2 + wordHight / 2 + i * itemHight;
// 画出文本
canvas.drawText(word, x, y, paint);
}
}
private int index = -1;// 操作的字母下标
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:// 按下
case MotionEvent.ACTION_MOVE:// 移动
float eventY = event.getY();
int eventindex = (int) (eventY / itemHight);
if (index != eventindex) {// 如果操作的index变化了
// 强制更新
invalidate();
index = eventindex;
// 通知activity更新textView
if (onIndexChangeListener != null) {
if(index<26&&index>0){
onIndexChangeListener.OnIndexChanged(indexArr[index]);
}
}
}
break;
case MotionEvent.ACTION_UP:
index = -1;
invalidate();
//当离开的时候
if (onIndexChangeListener != null) {
// onIndexChangeListener.OnUp();
}
break;
default:
break;
}
return true;// 消费
}
/**
* 定义一个接口
*
* @author 李帅帅
*/
private OnIndexChangeListener onIndexChangeListener;
public interface OnIndexChangeListener {
// 当操作的下标改变时，按下时调用
public void OnIndexChanged(String word);
// //当离开时调用
// public void OnUp();
}
public void setOnIndexChangeListener(OnIndexChangeListener onIndexChangeListener) {
this.onIndexChangeListener = onIndexChangeListener;
}
}
第一步我们写一个类来继承View 然后在重写测量方法。再次方法中获得item的宽高
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
itemWidth = this.getWidth();
itemHight = this.getHeight() / 26f;
}第二步:就到我们从写绘制的方法了，在此方法中我们根据选中角标的位置来让绘制字母颜色，以及字母的宽高
private int index = -1;// 操作的字母下标
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
for (int i = 0; i < indexArr.length; i++) {
if (i != index) {// 如果i不等于选中的item时
paint.setColor(Color.BLACK);
paint.setTextSize(16);
} else {
paint.setColor(Color.RED);// 当前操作的字母
paint.setTextSize(25);
}
String word = indexArr[i];
// 得到word的宽高
Rect bounds = new Rect();
paint.getTextBounds(word, 0, word.length(), bounds);
int wordWidth = bounds.width();
int wordHight = bounds.height();
// 定义左下角的坐标
float x = itemWidth / 2 - wordWidth / 2;
float y = itemHight / 2 + wordHight / 2 + i * itemHight;
// 画出文本
canvas.drawText(word, x, y, paint);
}
}第三步: 也是最为重要的一步，就是onTouchEvent此方法了。在此方法中我们会判断down move up ,当我们按下和移动的时候动态的获得Y/itemheight ，这就是我们选中字母的坐标,如果选中的角标变化了，那么就调用这个invalidate();方法，让其强制重绘，当然在此方法中我们会写一个接口，供页面回调，也是参照源码监听来写的,up的时候也让其强制重绘，记得角标改成非法值.
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:// 按下
case MotionEvent.ACTION_MOVE:// 移动
float eventY = event.getY();
int eventindex = (int) (eventY / itemHight);
if (index != eventindex) {// 如果操作的index变化了
// 强制更新
invalidate();
index = eventindex;
// 通知activity更新textView
if (onIndexChangeListener != null) {
if(index<26&&index>0){
onIndexChangeListener.OnIndexChanged(indexArr[index]);
}
}
}
break;
case MotionEvent.ACTION_UP:
index = -1;
invalidate();
//当离开的时候
if (onIndexChangeListener != null) {
// onIndexChangeListener.OnUp();
}
break;
default:
break;
}
return true;// 消费
}最后这个是我们写的接口
/**
* 定义一个接口
*
* @author 李帅帅
*/
private OnIndexChangeListener onIndexChangeListener;
public interface OnIndexChangeListener {
// 当操作的下标改变时，按下时调用
public void OnIndexChanged(String word);
// //当离开时调用
// public void OnUp();
}
public void setOnIndexChangeListener(OnIndexChangeListener onIndexChangeListener) {
this.onIndexChangeListener = onIndexChangeListener;
}MainActivity的代码附上
/**
* 页面一
*
* @author admin
*
*/
public class OneFragment extends Fragment {
private TextView mTextView;
private QuickIndexView mQIV;
private ListView mListView;
private List<Friend> data = new ArrayList<Friend>();
private FriendAdapter adapter;
private Context mContext;
private Handler handler = new Handler() {
public void handleMessage(android.os.Message msg) {
// 隐藏自己
mTextView.setVisibility(View.GONE);
}
};
public OneFragment(FragmentActivity mContext) {
this.mContext = mContext;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_one, container, false);
initData();
initViews(view);
setListener();
return view;
}
/**
* 初始化试图
*/
private void initViews(View view) {
// 初始化
mTextView = (TextView) view.findViewById(R.id.tv_main_word);
mListView = (ListView) view.findViewById(R.id.lv_main);
mQIV = (QuickIndexView) view.findViewById(R.id.qiv_main);
// 显示列表
adapter = new FriendAdapter(mContext, data);
mListView.setAdapter(adapter);
}
/**
* 设置监听
*/
private void setListener() {
// 设置监听
mQIV.setOnIndexChangeListener(new QuickIndexView.OnIndexChangeListener() {
@Override
public void OnIndexChanged(String word) {
mTextView.setText(word);
mTextView.setVisibility(View.VISIBLE);
// 移除未处理的消息
handler.removeCallbacksAndMessages(null);
handler.sendEmptyMessageDelayed(1, 1000);
// 遍历data
for (int i = 0; i < data.size(); i++) {
// 得到首字母
String firstPinYin = data.get(i).getPinyin().substring(0, 1);
if (word.equals(firstPinYin)) {
mListView.setSelection(i);
return;
}
}
}
});
//设置点击监听
mListView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
Toast.makeText(mContext, data.get(arg2).getName(), 0).show();
}
});
}
/**
* 准备数据
*/
private void initData() {
data.add(new Friend("张晓飞"));
data.add(new Friend("杨光福"));
data.add(new Friend("胡继群"));
data.add(new Friend("刘畅"));
data.add(new Friend("钟泽兴"));
data.add(new Friend("尹革新"));
data.add(new Friend("安传鑫"));
data.add(new Friend("张骞壬"));
data.add(new Friend("温松"));
data.add(new Friend("李凤秋"));
data.add(new Friend("刘甫"));
data.add(new Friend("娄全超"));
data.add(new Friend("张猛"));
data.add(new Friend("王英杰"));
data.add(new Friend("李振南"));
data.add(new Friend("孙仁政"));
data.add(new Friend("唐春雷"));
data.add(new Friend("牛鹏伟"));
data.add(new Friend("姜宇航"));
data.add(new Friend("刘挺"));
data.add(new Friend("张洪瑞"));
data.add(new Friend("张建忠"));
data.add(new Friend("侯亚帅"));
data.add(new Friend("刘帅"));
data.add(new Friend("乔竞飞"));
data.add(new Friend("徐雨健"));
data.add(new Friend("吴亮"));
data.add(new Friend("王兆霖"));
data.add(new Friend("阿三"));
Collections.sort(data);
}
}注意:我这里是接着上一篇架构的第一个OneFragment写的，如果是Activity页面，那么onCreateView就相当于onCreate方法，就是加载一个布局,然后其他类似.
fragment_one.Xml 代码,就是main_activity.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="${relativePackage}.${activityClass}" >
<ListView
android:id="@+id/lv_main"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</ListView>
<com.example.fragmenttest.views.QuickIndexView
android:id="@+id/qiv_main"
android:layout_width="30dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:background="@android:color/transparent" />
<TextView
android:id="@+id/tv_main_word"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#66666666"
android:text="A"
android:textColor="#EADAA9"
android:textSize="40sp"
android:gravity="center"
android:visibility="gone"/>
</RelativeLayout>FriendAdapter代码
import java.util.List;
import com.example.fragmenttest.R;
import com.example.fragmenttest.model.Friend;
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
public class FriendAdapter extends BaseAdapter {
private List<Friend> mDatas;
private Context mContext;
public FriendAdapter(Context mContext, List<Friend> data) {
mDatas = data;
this.mContext = mContext;
}
@Override
public int getCount() {
return mDatas.size();
}
@Override
public Object getItem(int position) {
return mDatas.get(position);
}
@Override
public long getItemId(int position) {
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if (convertView == null) {
holder = new ViewHolder();
convertView = View.inflate(mContext, R.layout.item_one_fragment, null);
holder.wordTV = (TextView) convertView .findViewById(R.id.tv_main_word);
holder.nameTV = (TextView) convertView .findViewById(R.id.tv_item_name);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
Friend friend = mDatas.get(position);
String word = friend.getPinyin().substring(0, 1);
holder.wordTV.setText(word);
holder.nameTV.setText(friend.getName());
// 如果下标为0，那么让其显示
if (position == 0) {
holder.wordTV.setVisibility(View.VISIBLE);
} else {
// 取出上一个friend,并得到第一个word
String preWord = mDatas.get(position - 1).getPinyin().substring(0, 1);
if (word.equals(preWord)) {// 如果相同，那么就隐藏
holder.wordTV.setVisibility(View.GONE);
} else {// 如果不同，显示
holder.wordTV.setVisibility(View.VISIBLE);
}
}
return convertView;
}
class ViewHolder {
public TextView wordTV;
public TextView nameTV;
}
}
item_one_fragment布局代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/tv_main_word"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="A"
android:textSize="18sp"
android:background="#66666666"
android:padding="5dp"/>
<TextView
android:id="@+id/tv_item_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="阿三"
android:textSize="18sp"
android:padding="5dp"/>
</LinearLayout>忘记了一个重要的工具类,中文转换为字母,当然我们需要下载一个pinyin4j-2.5.0.jar包
import net.sourceforge.pinyin4j.PinyinHelper;
import net.sourceforge.pinyin4j.format.HanyuPinyinCaseType;
import net.sourceforge.pinyin4j.format.HanyuPinyinOutputFormat;
import net.sourceforge.pinyin4j.format.HanyuPinyinToneType;
import net.sourceforge.pinyin4j.format.exception.BadHanyuPinyinOutputFormatCombination;
/**
* 将汉字转换为拼音
* @author 李帅帅
*
*/
public class PinYinUtils {
/**
* 得到指定汉字的拼音
* 注意:不应该被频繁调用，它消耗一定内存
* @param hanzi
* @return
*/
public static String getPinYin(String hanzi){
String pinyin = "";
HanyuPinyinOutputFormat format = new HanyuPinyinOutputFormat();//控制转换是否大小写，是否带音标
format.setCaseType(HanyuPinyinCaseType.UPPERCASE);//大写
format.setToneType(HanyuPinyinToneType.WITHOUT_TONE);
//由于不能直接对多个汉字转换，只能对单个汉字转换
char[] arr = hanzi.toCharArray();
for (int i = 0; i < arr.length; i++) {
if(Character.isWhitespace(arr[i]))continue;//如果是空格，则不处理，进行下次遍历
//汉字是2个字节存储，肯定大于127，所以大于127就可以当为汉字转换
if(arr[i]>127){
try {
//由于多音字的存在，单 dan shan
String[] pinyinArr = PinyinHelper.toHanyuPinyinStringArray(arr[i], format);
if(pinyinArr!=null){
pinyin += pinyinArr[0];
}else {
pinyin += arr[i];
}
} catch (BadHanyuPinyinOutputFormatCombination e) {
e.printStackTrace();
//不是正确的汉字
pinyin += arr[i];
}
}else {
//不是汉字，
pinyin += arr[i];
}
}
return pinyin;
}
}
1847
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
