Android自定义控件5----继承View通讯录索引功能之3在按下或和移动时显示更新提示字母

来源：互联网发布：广州知行通航编辑：程序博客网时间：2024/06/11 00:56

效果图：

项目结构：

核心代码：

自定义控件

IndexView

package com.example;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Rect;import android.graphics.Typeface;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import com.orhanobut.logger.Logger;/** * 自定义通讯录 */public class IndexView extends View {    /**     * 每条的宽和高     */    private int itemWidth;    private int itemHeight;    private Paint paint;    private String[] words = {"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 IndexView(Context context, AttributeSet attrs) {        super(context, attrs);        paint = new Paint();        //设置颜色        paint.setColor(Color.WHITE);        //设置抗锯齿        paint.setAntiAlias(true);        //设置粗体字        paint.setTypeface(Typeface.DEFAULT_BOLD);//      设置字体大小        paint.setTextSize(DensityUtil.dip2px(context,20));    }    /**     * 测量方法     *     * @param widthMeasureSpec     * @param heightMeasureSpec     */    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        itemWidth = getMeasuredWidth();        itemHeight = getMeasuredHeight() / words.length;        Logger.t("111").d("onMeasure>>>");    }    /**     * 绘制     * @param canvas     */    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        Logger.t("111").d("onDraw>>>");        for (int i = 0; i < words.length; i++) {            if(touchIndex ==i){                //设置灰色                paint.setColor(Color.GRAY);            }else{                //设置白色                paint.setColor(Color.WHITE);            }            String word = words[i];//A            Rect rect = new Rect();            //画笔            //0,1的取一个字母            paint.getTextBounds(word, 0, 1, rect);            //字母的高和宽            int wordWidth = rect.width();            int wordHeight = rect.height();            //计算每个字母在视图上的坐标位置            float wordX = itemWidth / 2 - wordWidth / 2;            float wordY = itemHeight / 2 + wordHeight / 2 + i * itemHeight;            canvas.drawText(word, wordX, wordY, paint);        }    }    /**     * 字母的下标位置     */    private int touchIndex = -1;    /**     * 设置事件     * 按下的字母背景设置成灰色，放开时所有字母的背景设置为白色     * 手指按下文字变色     * 1.重写onTouchEvent(),返回true,在down/move的过程中计算     * int touchIndex = Y / itemHeight; 强制绘制     * <p/>     * 2.在onDraw()方法对于的下标设置画笔变色     * <p/>     * 3.在up的时候     * touchIndex  = -1；     * 强制绘制     *     * @param event     * @return     */    @Override    public boolean onTouchEvent(MotionEvent event) {        super.onTouchEvent(event);        switch (event.getAction()) {            case MotionEvent.ACTION_DOWN:            case MotionEvent.ACTION_MOVE:                float Y = event.getY();                int index = (int) (Y/itemHeight);//字母索引                if(index != touchIndex){                    touchIndex = index;                    invalidate();//强制绘制onDraw();                    if(onIndexChangeListener != null&& touchIndex < words.length){                        onIndexChangeListener.onIndexChange(words[touchIndex]);                    }                }                break;            case MotionEvent.ACTION_UP:                touchIndex = -1;                invalidate();//强制绘制onDraw();                break;        }        return true;    }    /**     * 接口回调     * 字母下标索引变化的监听器     */    public interface OnIndexChangeListener{        /**         * 当字母下标位置发生变化的时候回调         * @param word 字母（A~Z）         */        void onIndexChange(String word);    }    private OnIndexChangeListener onIndexChangeListener;    /**     * 设置字母下标索引变化的监听     * @param onIndexChangeListener     */    public void setOnIndexChangeListener(OnIndexChangeListener onIndexChangeListener) {        this.onIndexChangeListener = onIndexChangeListener;    }}
MainActivity中
package com.example;import android.app.Activity;import android.os.Handler;import android.os.Message;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.widget.ListView;import android.widget.TextView;/** * 在按下或和移动时显示更新提示字母 */public class MainActivity extends Activity {    private ListView lv_main;    private TextView tv_word;    private IndexView iv_words;    private Handler handler = new Handler(){        @Override        public void handleMessage(Message msg){            switch (msg.what) {                case  1://                  关闭显示的字母提示                    tv_word.setVisibility(View.GONE);                    break;            }        }    };    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();        myOnclick();    }    private void myOnclick() {//      IndexView中回调出来的点击事件        iv_words.setOnIndexChangeListener(new IndexView.OnIndexChangeListener() {            @Override            public void onIndexChange(String word) {//              显示提示框                tv_word.setVisibility(View.VISIBLE);                tv_word.setText(word+"");                handler.removeCallbacksAndMessages(null);                handler.sendEmptyMessageDelayed(1,3000);            }        });    }    private void initView() {        lv_main = (ListView) findViewById(R.id.lv_main);        tv_word = (TextView) findViewById(R.id.tv_word);        iv_words = (IndexView) findViewById(R.id.iv_words);    }}
activity_main.xml中
<?xml version="1.0" encoding="utf-8"?><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="com.example.mytongxunlu.MainActivity">    <ListView        android:id="@+id/lv_main"        android:layout_width="match_parent"        android:layout_height="match_parent" />    <TextView        android:id="@+id/tv_word"        android:layout_width="80dp"        android:layout_height="80dp"        android:layout_centerInParent="true"        android:background="#44000000"        android:gravity="center"        android:text="A"        android:textColor="#000000"        android:textSize="30sp"        android:visibility="gone" />    <com.example.IndexView        android:id="@+id/iv_words"        android:layout_width="30dp"        android:layout_height="match_parent"        android:layout_alignParentRight="true"        android:background="#ff0000"        /></RelativeLayout>
工具类
DensityUtil
package com.example;import android.content.Context;/** * 工具类 dp 的单位 转成为 px */public class DensityUtil {    /**     * 根据手机的分辨率从 dp 的单位 转成为 px(像素)     */    public static int dip2px(Context context, float dpValue) {        final float scale = context.getResources().getDisplayMetrics().density;        return (int) (dpValue * scale + 0.5f);    }    /**     * 根据手机的分辨率从 px(像素) 的单位 转成为 dp     */    public static int px2dip(Context context, float pxValue) {        final float scale = context.getResources().getDisplayMetrics().density;        return (int) (pxValue / scale + 0.5f);    }}

源码下载：

Myself ---- mytongxunlu3

http://download.csdn.net/download/zhaihaohao1/10111351

参考视频：

http://www.gulixueyuan.com/course/124/learn#lesson/1925

阅读全文

0 0