自定义控件:快速索引

快速索引在应用中很常见,在联系人,微信,省市列表,应用管理,文件管理等应用场景都可以看到快速索引的身影,本篇博客将讲解快速索引的自定义,从中你可以学到获取汉字首字母的方法,绘制字母时,纵坐标的计算方法

这里写图片描述

一、静态绘制

初始化数据

创建自定义控件QuickIndexBar 继承View

public class QuickIndexBar extends View {
        private Paint paint;
        // 字母数组
        private static final String[] LETTERS = new String[] { "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 QuickIndexBar(Context context) {
            this(context, null);
        }
        public QuickIndexBar(Context context, AttributeSet attrs) {
            this(context, attrs, 0);
        }
        public QuickIndexBar(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);
            paint = new Paint();
            // 设置抗锯齿,设置后画出来的边缘更加平滑
            paint.setAntiAlias(true);
            //设置字体为粗体
            paint.setTypeface(Typeface.DEFAULT_BOLD);
            // 设置字体颜色
            paint.setColor(Color.WHITE);
        }
        @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);
            //画文字的方法
            canvas.drawText("A", 10f, 10f, paint);
        }
    }
  • 第3-6 行初始化字母数组
  • 第7-12 行串连构造方法
  • 第15-21 行初始化画笔
  • 第27 行画文字的方法

将QuickIndexBar 布局到activity_main.xml 中

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.example.quickindexer.widget.QuickIndexBar
        android:id="@+id/quick_bar"
        android:layout_width="30dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:background="#ff0000"/>
</RelativeLayout>

计算字母坐标

这里写图片描述

画文字的x,y 坐标是文字左下角的位置

  1. 第一个字母的x 坐标则等于单元格宽度的一半减去文字宽度的一半,由于所有字母离左边的距离
    一样,所以x 不变int x = cellWidth/2 - textWidth/2
  2. 第一个字母的y 坐标则等于单元格高度的一半加上文字,第二个字母需要加上一个单元格的宽度
    由此类推int y = cellHeight/2 +textHeight/2 +i*cellHeight
  3. 单元格cellWidth 为QuickIndexBar 宽度,cellHeight 为QuickIndexBar 高度/字母数组的长度
@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //遍历字母数组,计算坐标,进行绘制
        for (int i = 0; i < LETTERS.length; i++) {
            String letter = LETTERS[i];
            //计算x 坐标
            float x = cellWidth*0.5f - paint.measureText(letter)*0.5f;
            //计算y 坐标
            Rect bounds = new Rect();
            //获取文本的矩形区域
            paint.getTextBounds(letter, 0, letter.length(), bounds);
            float y = cellHeight*0.5f + bounds.height()+ i*cellHeight;
            //绘制文本
            canvas.drawText(letter, x, y, paint);
        }
    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        //控件高度
        int height = getMeasuredHeight();
        //控件宽度,也为单元格宽度
        cellWidth = getMeasuredWidth();
        //单元格宽度,控件高度除以字母数组长度,此处需要用float 类型
        //10/3 = 3.333 如果用int 接收则为3,此时高度比实际分配的高度小,所以用float 接收
        cellHeight = height*1.0f/LETTERS.length;
    }
  • 第19-26 行获取单元的宽高,注意单元格高度需要用float 类型
  • 第8-12 行通过paint 测量文字的宽高,并计算出每个字母的坐标

Android drawText获取text宽度的三种方式

原文链接:http://blog.csdn.net/chuekup/article/details/7518239

String str = "Hello";  
canvas.drawText( str , x , y , paint);  
  
//1. 粗略计算文字宽度  
Log.d(TAG, "measureText=" + paint.measureText(str));  
  
//2. 计算文字所在矩形,可以得到宽高  
Rect rect = new Rect();  
paint.getTextBounds(str, 0, str.length(), rect);  
int w = rect.width();  
int h = rect.height();  
Log.d(TAG, "w=" +w+"  h="+h);  
  
//3. 精确计算文字宽度  
int textWidth = getTextWidth(paint, str);  
Log.d(TAG, "textWidth=" + textWidth);  
  
    public static int getTextWidth(Paint paint, String str) {  
        int iRet = 0;  
        if (str != null && str.length() > 0) {  
            int len = str.length();  
            float[] widths = new float[len];  
            paint.getTextWidths(str, widths);  
            for (int j = 0; j < len; j++) {  
                iRet += (int) Math.ceil(widths[j]);  
            }  
        }  
        return iRet;  
    }  

//4. mPaint.getTextSize();

二、响应触摸事件

重写onTouchEvent()方法,解析触摸事件

//初始值需要设置为-1,不能为0,因为按下第一个字母的索引是0
    private int lastIndex = -1;
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        float y ;
        int currentIndex;
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:

                y = event.getY();
                //根据y 计算当前按下的字母索引
                //例如:y = 21,cellHeight = 10 =>(int) (y/cellHeight)= 2
                currentIndex = (int) (y/cellHeight);
                if(lastIndex != currentIndex){
                    //判断计算出来的索引值,避免数组越界
                    if(0 <= currentIndex && currentIndex < LETTERS.length){
                        String letter = LETTERS[currentIndex];
                        Utils.showToast(getContext(), letter);
                        //记录上次按下的索引
                        lastIndex = currentIndex;
                    }
                }
                break;
            case MotionEvent.ACTION_MOVE:
                y = event.getY();
                //根据y 计算当前按下的字母索引
                //例如:y = 21,cellHeight = 10 =>(int) (y/cellHeight)= 2
                currentIndex = (int) (y/cellHeight);
                //判断计算出来的索引值,避免数组越界
                if(0 <= currentIndex && currentIndex < LETTERS.length){
                    String letter = LETTERS[currentIndex];
                    Utils.showToast(getContext(), letter);
                    //记录上次按下的索引
                    lastIndex = currentIndex;
                }
                break;
            case MotionEvent.ACTION_UP:
                //手指抬起时需要将记录的值设为-1,否则再次按下该字母不会弹出toast
                lastIndex = -1;
                break;

            default:
                break;
        }
        //事件已被处理,返回true
        return true;
    }
  • 第12 行通过触摸的y 值计算按下字母的索引值
  • 第19 行记录上次按下字母的索引值,通过判断上次按下字母的索引与本次按下字母的索引是否相同,如果不同才弹出toast,避免在同一个字母上来回移动也一直弹出toast
  • 第38 行手指抬起需要将lastIndex 还原为初始值
  • 第45 行一定要返回true,代表事件已被消费
  • 第17 行是单例Toast
public class Utils {

        private static Toast toast;
        public static void showToast(Context context, String msg) {
            if (toast == null) {
                toast = Toast.makeText(context, "", Toast.LENGTH_SHORT);
            }
            toast.setText(msg);
            toast.show();
        }
    }

三、监听回调

定义监听回调接口

 private OnLetterUpdateListener onLetterUpdateListener;
    public OnLetterUpdateListener getOnLetterUpdateListener() {
        return onLetterUpdateListener;
    }
    public void setOnLetterUpdateListener(
            OnLetterUpdateListener onLetterUpdateListener) {
        this.onLetterUpdateListener = onLetterUpdateListener;
    }
    public interface OnLetterUpdateListener{
        public void onLetterUpdate(String letter);
    }

在弹出Toast 的地方替换成调用接口方法

public boolean onTouchEvent(MotionEvent event) {
        float y ;
        int currentIndex;
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                y = event.getY();
                //根据y 计算当前按下的字母索引
                //例如:y = 21,cellHeight = 10 =>(int) (y/cellHeight)= 2
                currentIndex = (int) (y/cellHeight);
                if(lastIndex != currentIndex){
                    //判断计算出来的索引值,避免数组越界
                    if(0 <= currentIndex && currentIndex < LETTERS.length){
                        String letter = LETTERS[currentIndex];
                        if(onLetterUpdateListener != null){
                            onLetterUpdateListener.onLetterUpdate(letter);
                        }

                        //记录上次按下的索引
                        lastIndex = currentIndex;
                    }
                }
                break;
            case MotionEvent.ACTION_MOVE:
                y = event.getY();
                //根据y 计算当前按下的字母索引
                //例如:y = 21,cellHeight = 10 =>(int) (y/cellHeight)= 2
                currentIndex = (int) (y/cellHeight);
                //判断计算出来的索引值,避免数组越界
                if(0 <= currentIndex && currentIndex < LETTERS.length){
                    String letter = LETTERS[currentIndex];
                    if(onLetterUpdateListener != null){
                        onLetterUpdateListener.onLetterUpdate(letter);
                    }
                    //记录上次按下的索引
                    lastIndex = currentIndex;
                }
                break;
            case MotionEvent.ACTION_UP:
                //手指抬起时需要将记录的值设为-1,否则再次按下该字母不会弹出toast
                lastIndex = -1;
                break;
            default:
                break;
        }
        //事件已被处理,返回true
        return true;
    }
  • 第14-16 调用回调接口方法,通知外面当前触摸的字母
  • 第30-32 调用回调接口方法,通知外面当前触摸的字母

主Activity 中给QuickIndexBar 设置回调监听

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        QuickIndexBar quickBar = (QuickIndexBar) findViewById(R.id.quick_bar);
        quickBar.setOnLetterUpdateListener(new OnLetterUpdateListener() {
            @Override
            public void onLetterUpdate(String letter) {
                Utils.showToast(getApplicationContext(), letter);
            }
        });
    }

四、根据拼音排序

1、创建PinyinUtil.java

GitHub上有可以将汉字转拼音的开源项目,TinyPinyinpinyin4j

汉字转拼音需要导入pinyin4j-2.5.0.jar

public class PinyinUtil {
        /**
         * 根据指定的汉字字符串, 返回其对应的拼音
         * @param string
         * @return
         */
        public static String getPinyin(String string) {
            // 黑-> HEI 马-> MA
            // 黑马*&^*
            // 黑123dfasdf 马
            HanyuPinyinOutputFormat format = new HanyuPinyinOutputFormat();
            // 不需要音标
            format.setToneType(HanyuPinyinToneType.WITHOUT_TONE);
            // 设置转换出大写字母
            format.setCaseType(HanyuPinyinCaseType.UPPERCASE);

            char[] charArray = string.toCharArray();

            StringBuilder sb = new StringBuilder();

            for (int i = 0; i < charArray.length; i++) {
                char c = charArray[i];

                // 如果是空格, 跳过当前循环
                if(Character.isWhitespace(c)){
                    continue;
                }

                if(c >= -128 && c < 127){
                    // 不可能是汉字, 直接拼接
                    sb.append(c);
                }else {
                    try {
                        // 获取某个字符对应的拼音. 可以获取到多音字. 单->DAN, SHAN
                        String s = PinyinHelper.toHanyuPinyinStringArray(c, format)[0];
                        sb.append(s);
                    } catch (BadHanyuPinyinOutputFormatCombination e) {

                        e.printStackTrace();
                    }
                }
            }
            return sb.toString();
        }
    }

2、填充ListView

用于填充ListView 的姓名数组

public class Cheeses {
        public static final String[] NAMES = new String[] { "宋江", "卢俊义", "吴用",
                "公孙胜", "关胜", "林冲", "秦明", "呼延灼", "花荣", "柴进", "李应", "朱仝", "鲁智
                深",
                "武松", "董平", "张清", "杨志", "徐宁", "索超", "戴宗", "刘唐", "李逵", "史进", "
                穆弘",
                "雷横", "李俊", "阮小二", "张横", "阮小五", " 张顺", "阮小七", "杨雄", "石秀", "
                解珍",
                " 解宝", "燕青", "朱武", "黄信", "孙立", "宣赞", "郝思文", "韩滔", "彭玘", "单廷珪
                ",
                "魏定国", "萧让", "裴宣", "欧鹏", "邓飞", " 燕顺", "杨林", "凌振", "蒋敬", "吕方
                ",
                "郭盛", "安道全", "皇甫端", "王英", "扈三娘", "鲍旭", "樊瑞", "孔明", "孔亮", "
                项充",
                "李衮", "金大坚", "马麟", "童威", "童猛", "孟康", "侯健", "陈达", "杨春", "郑天寿
                ",
                "陶宗旺", "宋清", "乐和", "龚旺", "丁得孙", "穆春", "曹正", "宋万", "杜迁", "薛永
                ", "施恩",
                "周通", "李忠", "杜兴", "汤隆", "邹渊", "邹润", "朱富", "朱贵", "蔡福", "蔡庆", "
                李立",
                "李云", "焦挺", "石勇", "孙新", "顾大嫂", "张青", "孙二娘", " 王定六", "郁保四", "
                白胜",
                "时迁", "段景柱" };
    }

将姓名转化为HaoHan 对象

public class HaoHan implements Comparable<HaoHan>{
        private String name;
        private String pinyin;
        public HaoHan(String name) {
            super();
            this.name = name;
            this.pinyin = PinyinUtil.getPinyin(name);
        }


        public String getName() {
            return name;
        }
        public void setName(String name) {
            this.name = name;
        }
        public String getPinyin() {
            return pinyin;
        }
        public void setPinyin(String pinyin) {
            this.pinyin = pinyin;
        }

        @Override
        public int compareTo(HaoHan another) {
            return this.pinyin.compareTo(another.pinyin);
        }
    }

第24-27 行实现Comparable 接口,用于排序操作
activity_main.xml 中添加ListView

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ListView
        android:id="@+id/lv"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </ListView>

    <com.example.quickindexer.widget.QuickIndexBar
        android:id="@+id/quick_bar"
        android:layout_width="30dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:background="#ff0000"/>
</RelativeLayout>

为ListView 创建数据适配器
ListView 条目的布局item_person.xml,每一个条目上都加上显示首字母的TextView

<?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_index"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:background="#666666"
        android:gravity="center_vertical"
        android:paddingLeft="15dp"
        android:text="A"
        android:textColor="#FFFFFF"
        android:textSize="18sp"/>

    <TextView
        android:id="@+id/tv_name"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center_vertical"
        android:paddingLeft="15dp"
        android:text="宋江"
        android:textSize="22sp"/>

</LinearLayout>

数据适配器代码

public class HaoHanAdapter extends BaseAdapter {
        private ArrayList<HaoHan> persons = new ArrayList<HaoHan>();
        private final Context context;

        public HaoHanAdapter(ArrayList<HaoHan> persons, Context context) {
            super();
            this.persons = persons;
            this.context = context;
        }
        @Override
        public int getItemViewType(int position) {
            // TODO Auto-generated method stub
            return super.getItemViewType(position);
        }
        @Override
        public int getViewTypeCount() {
            // TODO Auto-generated method stub
            return super.getViewTypeCount();

        }
        @Override
        public int getCount() {
            return persons.size();
        }
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            View view;
            if(convertView == null){
                view = View.inflate(context, R.layout.item_person, null);
            }else {
                view = convertView;
            }

            TextView tv_index = (TextView) view.findViewById(R.id.tv_index);
            TextView tv_name = (TextView) view.findViewById(R.id.tv_name);

            HaoHan haoHan = persons.get(position);

            // 当前首字母
            String currentStr = haoHan.getPinyin().charAt(0) + "";
            tv_index.setText(currentStr);
            tv_name.setText(haoHan.getName());

            return view;
        }
        @Override
        public Object getItem(int position) {
            return null;
        }
        @Override
        public long getItemId(int position) {
            return 0;
        }
    }

五、根据首字母分组

修改数据适配器的getView()方法

 @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View view;
        if(convertView == null){

            view = View.inflate(context, R.layout.item_person, null);
        }else {
            view = convertView;
        }

        TextView tv_index = (TextView) view.findViewById(R.id.tv_index);
        TextView tv_name = (TextView) view.findViewById(R.id.tv_name);

        HaoHan haoHan = persons.get(position);

        // 当前首字母
        String currentStr = haoHan.getPinyin().charAt(0) + "";

        String indexStr = null;
        // 如果是第一个, 直接显示
        if(position == 0){
            indexStr = currentStr;
        }else {
            // 判断当前首字母和上一个条目的首字母是否一致, 不一致时候显示.
            String lastStr = persons.get(position - 1).getPinyin().charAt(0) + "";
            if(!TextUtils.equals(lastStr, currentStr)){
                // 不一致时候赋值indexStr
                indexStr = currentStr;
            }

        }

        tv_index.setVisibility(indexStr != null ? View.VISIBLE : View.GONE);
        tv_index.setText(currentStr);
        tv_name.setText(haoHan.getName());

        return view;
    }

第16-32 行如果是第一行直接显示首字母条目,如果不是第一行判断当前首字母和上一个条目的首字母是否一致, 不一致时候显示,一致则隐藏

六、ListView 和自定义控件结合

修改回调接口代码,for 循环persons 集合找到与传回来的letter 值相同的索引值,ListView 直接滚动到对应位置即可

QuickIndexBar quickBar = (QuickIndexBar) findViewById(R.id.quick_bar);
    quickBar.setOnLetterUpdateListener(new OnLetterUpdateListener() {
        @Override
        public void onLetterUpdate(String letter) {
            Utils.showToast(MainActivity.this, letter);
            for (int i = 0; i < persons.size(); i++) {


                String l = persons.get(i).getPinyin().charAt(0) + "";
                if(TextUtils.equals(letter, l)){
                    // 找到第一个首字母是letter 条目.
                    lv.setSelection(i);
                    break;
                }
            }
        }
    });

七、细节优化置

置为当前选中的字母

public boolean onTouchEvent(MotionEvent event) {
        float y ;
        int currentIndex;
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                y = event.getY();
                //根据y 计算当前按下的字母索引
                //例如:y = 21,cellHeight = 10 =>(int) (y/cellHeight)= 2
                currentIndex = (int) (y/cellHeight);
                if(lastIndex != currentIndex){
                    //判断计算出来的索引值,避免数组越界
                    if(0 <= currentIndex && currentIndex < LETTERS.length){
                        String letter = LETTERS[currentIndex];
                        if(onLetterUpdateListener != null){
                            onLetterUpdateListener.onLetterUpdate(letter);
                        }
                        //记录上次按下的索引
                        lastIndex = currentIndex;
                    }
                }
                break;
            case MotionEvent.ACTION_MOVE:
                y = event.getY();
                //根据y 计算当前按下的字母索引
                //例如:y = 21,cellHeight = 10 =>(int) (y/cellHeight)= 2
                currentIndex = (int) (y/cellHeight);
                //判断计算出来的索引值,避免数组越界
                if(0 <= currentIndex && currentIndex < LETTERS.length){
                    String letter = LETTERS[currentIndex];
                    if(onLetterUpdateListener != null){
                        onLetterUpdateListener.onLetterUpdate(letter);
                    }
                    //记录上次按下的索引
                    lastIndex = currentIndex;
                }
                break;
            case MotionEvent.ACTION_UP:
                //手指抬起时需要将记录的值设为-1,否则再次按下该字母不会弹出toast
                lastIndex = -1;
                break;

            default:
                break;
        }
        //重绘一次界面,会再次调用onDraw()方法,通过判断lastIndex 的值,把按下的字母置为灰色
        invalidate();
        //事件已被处理,返回true
        return true;
    }

第46 行为新增代码,此时lastIndex 为当前按下的字母索引,调用一次invalidate()方法,会再次调用onDraw()方法,在onDraw()方法中通过判断lastIndex 的值,把当前按下的字母置为灰色

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //遍历字母数组,计算坐标,进行绘制
        for (int i = 0; i < LETTERS.length; i++) {
            String letter = LETTERS[i];
            //计算x 坐标
            float x = cellWidth*0.5f - paint.measureText(letter)*0.5f;
            //计算y 坐标
            Rect bounds = new Rect();
            //获取文本的矩形区域
            paint.getTextBounds(letter, 0, letter.length(), bounds);
            float y = cellHeight*0.5f + bounds.height()+ i*cellHeight;
            //把当前选中的字母置为灰色
            if(lastIndex == i){
                paint.setColor(Color.GRAY);
            }else{
                paint.setColor(Color.WHITE);
            }
            //绘制文本
            canvas.drawText(letter, x, y, paint);
        }
    }

第13-18 行如果当前字母的索引是选中的,则将画笔颜色改为灰色,没有选中的将画笔改为白色

把回调方法中Toast 的显示方式改为TextView 显示

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ListView
        android:id="@+id/lv"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </ListView>

    <TextView
        android:id="@+id/tv_center"
        android:layout_width="160dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        android:background="@drawable/shape_tv_center"
        android:gravity="center"
        android:text="A"
        android:textColor="#ffffff"
        android:textSize="32sp"
        android:visibility="gone"/>

    <com.example.quickindexer.widget.QuickIndexBar
        android:id="@+id/quick_bar"
        android:layout_width="30dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:background="#ff0000"/>
</RelativeLayout>
  • 第11-21 行在屏幕中间添加一个提示框,默认情况为不显示
  • 第16 行提示框的背景文件,需要在res 下新建一个drawable 文件夹,将shape_tv_center.xml 放在此文件夹下
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle" >
    <!-- android:shape="rectangle" 该形状为矩形-->
    <solid android:color="#66000000" /><!--填充颜色-->
    <corners android:radius="20dp" /><!--圆角半径-->
</shape>

修改回调接口中字母提示方式

//屏幕中间的提示框
    tvCenter = (TextView) findViewById(R.id.tv_center);
    quickBar.setOnLetterUpdateListener(new OnLetterUpdateListener() {
        @Override
        public void onLetterUpdate(String letter) {
            //Utils.showToast(MainActivity.this, letter);
            //将Toast 改成文本提示框
            showLetter(letter);
            for (int i = 0; i < persons.size(); i++) {
                String l = persons.get(i).getPinyin().charAt(0) + "";
                if(TextUtils.equals(letter, l)){
                    // 找到第一个首字母是letter 条目.
                    lv.setSelection(i);
                    break;
                }
            }
        }
    });
    private Handler mHandler = new Handler();
    /**
     * 在屏幕中间显示一个字母提示
     * @param letter
     */
    private void showLetter(String letter) {
        tvCenter.setText(letter);
        tvCenter.setVisibility(View.VISIBLE);
        //移除所有的消息及任务
        mHandler.removeCallbacksAndMessages(null);
        //用消息机制延迟隐藏提示框
        mHandler.postDelayed(new Runnable() {
            @Override
            public void run() {
                //2 秒后隐藏提示框
                tvCenter.setVisibility(View.GONE);
            }
        }, 2000);
    }
  • 第6-8 行将Toast 提示改为文本框提示
  • 第28-36 行用消息机制延迟隐藏文本提示框,如果快速滑动showLetter()方法会频繁调用,会有多个延迟任务在消息队列中,其实当前延迟任务之前的任务都是没有必要执行的,所以可以先移除队列中所有的任务再将本次任务添加到队列中

QuickIndexBar

/**
 * 快速索引
 * 
 * 用于根据字母快速定位联系人
 * @author AllenIverson
 *
 */
public class QuickIndexBar extends View {
    
    private static final String[] LETTERS = new String[]{
        "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 static final String TAG = "TAG";
    
    private Paint mPaint;

    private int cellWidth;

    private float cellHeight;
    
    /**
     * 暴露一个字母的监听
     */
    public interface OnLetterUpdateListener{
        void onLetterUpdate(String letter);
    }
    private OnLetterUpdateListener listener;
    
    public OnLetterUpdateListener getListener() {
        return listener;
    }
    /**
     * 设置字母更新监听
     * @param listener
     */
    public void setListener(OnLetterUpdateListener listener) {
        this.listener = listener;
    }

    public QuickIndexBar(Context context) {
        this(context, null);
    }

    public QuickIndexBar(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public QuickIndexBar(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setColor(Color.WHITE);
        mPaint.setTypeface(Typeface.DEFAULT_BOLD);
    }
    
    @Override
    protected void onDraw(Canvas canvas) {
        
        for (int i = 0; i < LETTERS.length; i++) {
            String text = LETTERS[i];
            // 计算坐标
            int x = (int) (cellWidth / 2.0f - mPaint.measureText(text) / 2.0f);
            // 获取文本的高度
            Rect bounds = new Rect();// 矩形
            mPaint.getTextBounds(text, 0, text.length(), bounds);
            int textHeight = bounds.height();
            int y = (int) (cellHeight / 2.0f + textHeight / 2.0f + i * cellHeight);
            
            // 根据按下的字母, 设置画笔颜色
            mPaint.setColor(touchIndex == i ? Color.GRAY : Color.WHITE);
            
            // 绘制文本A-Z
            canvas.drawText(text, x, y, mPaint);
        }
    }
    
    int touchIndex = -1;
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        int index = -1;
        switch (MotionEventCompat.getActionMasked(event)) {
            case MotionEvent.ACTION_DOWN:
                // 获取当前触摸到的字母索引
                index = (int) (event.getY() / cellHeight);
                if(index >= 0 && index < LETTERS.length){
                    // 判断是否跟上一次触摸到的一样
                    if(index != touchIndex) {
                        if(listener != null){
                            listener.onLetterUpdate(LETTERS[index]);
                        }
                        Log.d(TAG, "onTouchEvent: " + LETTERS[index]);
                        
                        touchIndex = index;
                    }
                }
                
                break;
            case MotionEvent.ACTION_MOVE:
                index = (int) (event.getY() / cellHeight);
                if(index >= 0 && index < LETTERS.length){
                    // 判断是否跟上一次触摸到的一样
                    if(index != touchIndex){
                        
                        if(listener != null){
                            listener.onLetterUpdate(LETTERS[index]);
                        }
                        Log.d(TAG, "onTouchEvent: " + LETTERS[index]);
                        
                        touchIndex = index;
                    }
                }
                break;
            case MotionEvent.ACTION_UP:
                touchIndex = -1;
                break;
    
            default:
                break;
        }
        invalidate();
        
        return true;
    }
    
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        // 获取单元格的宽和高
        
        cellWidth = getMeasuredWidth();
        
        int mHeight = getMeasuredHeight();
        cellHeight = mHeight * 1.0f / LETTERS.length;
        
    }
}

MainActivity

public class MainActivity extends Activity {

    private ListView mMainList;
    private ArrayList<Person> persons;
    private TextView tv_center;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        QuickIndexBar bar = (QuickIndexBar) findViewById(R.id.bar);
        // 设置监听
        bar.setListener(new OnLetterUpdateListener() {
            @Override
            public void onLetterUpdate(String letter) {
//              Utils.showToast(getApplicationContext(), letter);
                
                showLetter(letter);
                // 根据字母定位ListView, 找到集合中第一个以letter为拼音首字母的对象,得到索引
                for (int i = 0; i < persons.size(); i++) {
                    Person person = persons.get(i);
                    String l = person.getPinyin().charAt(0) + "";
                    if(TextUtils.equals(letter, l)){
                        // 匹配成功
                        mMainList.setSelection(i);
                        break;
                    }
                }
            }
        });
        
        mMainList = (ListView) findViewById(R.id.lv_main);
        
        persons = new ArrayList<Person>();
        
        // 填充数据 , 排序
        fillAndSortData(persons);
        
        mMainList.setAdapter(new HaoHanAdapter(MainActivity.this , persons));
        
        tv_center = (TextView) findViewById(R.id.tv_center);
        
        
    }

    private Handler mHandler = new Handler();
    
    /**
     * 显示字母
     * @param letter
     */
    protected void showLetter(String letter) {
        tv_center.setVisibility(View.VISIBLE);
        tv_center.setText(letter);
        
        mHandler.removeCallbacksAndMessages(null);
        mHandler.postDelayed(new Runnable() {
            @Override
            public void run() {
                tv_center.setVisibility(View.GONE);             
            }
        }, 2000);
        
    }

    private void fillAndSortData(ArrayList<Person> persons) {
        // 填充数据
        for (int i = 0; i < Cheeses.NAMES.length; i++) {
            String name = Cheeses.NAMES[i];
            persons.add(new Person(name));
        }
        
        // 进行排序
        Collections.sort(persons);
    }
}

HaoHanAdapter

public class HaoHanAdapter extends BaseAdapter {

    private Context mContext;
    private ArrayList<Person> persons;

    public HaoHanAdapter(Context mContext, ArrayList<Person> persons) {
        this.mContext = mContext;
        this.persons = persons;
    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return persons.size();
    }

    @Override
    public Object getItem(int position) {
        return persons.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        
        View view = convertView;
        if(convertView == null){
            view = view.inflate(mContext, R.layout.item_list, null);
        }
        ViewHolder mViewHolder = ViewHolder.getHolder(view);
        
        Person p = persons.get(position);
        
        String str = null;
        String currentLetter = p.getPinyin().charAt(0) + "";
        // 根据上一个首字母,决定当前是否显示字母
        if(position == 0){
            str = currentLetter;
        }else {
            // 上一个人的拼音的首字母
            String preLetter = persons.get(position - 1).getPinyin().charAt(0) + "";
            if(!TextUtils.equals(preLetter, currentLetter)){
                str = currentLetter;
            }
        }
        
        // 根据str是否为空,决定是否显示索引栏
        mViewHolder.mIndex.setVisibility(str == null ? View.GONE : View.VISIBLE);
        mViewHolder.mIndex.setText(currentLetter);
        mViewHolder.mName.setText(p.getName());
        
        return view;
    }
    
    static class ViewHolder {
        TextView mIndex;
        TextView mName;

        public static ViewHolder getHolder(View view) {
            Object tag = view.getTag();
            if(tag != null){
                return (ViewHolder)tag;
            }else {
                ViewHolder viewHolder = new ViewHolder();
                viewHolder.mIndex = (TextView) view.findViewById(R.id.tv_index);
                viewHolder.mName = (TextView) view.findViewById(R.id.tv_name);
                view.setTag(viewHolder);
                return viewHolder;
            }
        }
        
    }
}

FancyListIndexer

public class FancyIndexer extends View {
    
    
    public interface OnTouchLetterChangedListener {
        public void onTouchLetterChanged(String s);
    }
    
    private static final String TAG = "FancyIndexer";
    
    /////////////////////////////////////////////////////////////////////////
    
    //Properties
    // 向右偏移多少画字符, default 30
    float mWidthOffset = 30.0f;
    
    // 最小字体大小
    int mMinFontSize = 24;
    
    // 最大字体大小
    int mMaxFontSize = 48;
    
    // 提示字体大小
    int mTipFontSize = 52;
    
    // 提示字符的额外偏移
    float mAdditionalTipOffset = 20.0f;
    
    // 贝塞尔曲线控制的高度
    float mMaxBezierHeight = 150.0f;
    
    // 贝塞尔曲线单侧宽度
    float mMaxBezierWidth = 240.0f;
    
    // 贝塞尔曲线单侧模拟线量
    int  mMaxBezierLines = 32;
    
    // 列表字符颜色
    int  mFontColor = 0xffffffff;
    
    // 提示字符颜色
//  int  mTipFontColor = 0xff3399ff;
    int  mTipFontColor = 0xffd33e48;
    
    /////////////////////////////////////////////////////////////////////////
    
    private OnTouchLetterChangedListener mListener;
    
    private final String[] ConstChar = {"#","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 mChooseIndex = -1;
    Paint mPaint = new Paint();
    PointF mTouch = new PointF();
    
    PointF[] mBezier1;
    PointF[] mBezier2;
    
    float mLastOffset[] = new float[ConstChar.length]; // 记录每一个字母的x方向偏移量, 数字<=0
    PointF mLastFucusPostion = new PointF();
    
    Scroller mScroller;
    boolean mAnimating = false;
    float mAnimationOffset;
    
    boolean mHideAnimation = false;
    int mAlpha = 255; 
    
    Handler mHideWaitingHandler = new Handler() {
        
        @Override
        public void handleMessage(Message msg) {
            if( msg.what == 1 )
            {
//              mScroller.startScroll(0, 0, 255, 0, 1000);
                mHideAnimation = true;
                mAnimating = false;
                FancyIndexer.this.invalidate();
                return;
            }
            super.handleMessage(msg);
        }
    };
    
    public FancyIndexer(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        initData(context, attrs);
    }

    public FancyIndexer(Context context, AttributeSet attrs) {
        super(context, attrs);
        initData(context, attrs);
    }

    public FancyIndexer(Context context) {
        super(context);
        initData(null, null);
    }
    
    private void initData(Context context, AttributeSet attrs) {
        
        if( context != null && attrs != null ) {
            
            TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.FancyIndexer, 0, 0);
            
            mWidthOffset    = a.getDimension(R.styleable.FancyIndexer_widthOffset, mWidthOffset);
            mMinFontSize    = a.getInteger(R.styleable.FancyIndexer_minFontSize, mMinFontSize);
            mMaxFontSize    = a.getInteger(R.styleable.FancyIndexer_maxFontSize, mMaxFontSize);
            mTipFontSize    = a.getInteger(R.styleable.FancyIndexer_tipFontSize, mTipFontSize);
            mMaxBezierHeight = a.getDimension(R.styleable.FancyIndexer_maxBezierHeight, mMaxBezierHeight);
            mMaxBezierWidth = a.getDimension(R.styleable.FancyIndexer_maxBezierWidth, mMaxBezierWidth);         
            mMaxBezierLines =  a.getInteger(R.styleable.FancyIndexer_maxBezierLines, mMaxBezierLines);
            mAdditionalTipOffset = a.getDimension(R.styleable.FancyIndexer_additionalTipOffset, mAdditionalTipOffset);
            mFontColor = a.getColor(R.styleable.FancyIndexer_fontColor, mFontColor);
            mTipFontColor = a.getColor(R.styleable.FancyIndexer_tipFontColor, mTipFontColor);
            a.recycle();
        }
        mScroller = new Scroller( getContext() );
        mTouch.x = 0;
        mTouch.y = -10*mMaxBezierWidth;
        
        mBezier1 = new PointF[mMaxBezierLines];
        mBezier2 = new PointF[mMaxBezierLines];
        
        calculateBezierPoints();
        
    }
    
    @Override
    protected void onDraw(Canvas canvas) {
        
        // 控件宽高
        int height = getHeight();
        int width = getWidth();

        // 单个字母高度
        float singleHeight = height / (float)ConstChar.length;
        
        int workHeight = 0;
        
        if( mAlpha == 0 )
            return;
        
        mPaint.reset();
        
        int saveCount = 0;
        
        if( mHideAnimation )
        {
            saveCount = canvas.save();
            canvas.saveLayerAlpha( 0, 0, width, height, mAlpha, Canvas.ALL_SAVE_FLAG );
        }
        
        for(int i=0;i<ConstChar.length;i++) {
            
           mPaint.setColor(mFontColor);
           mPaint.setAntiAlias(true);
           
           float xPos = width - mWidthOffset;
           float yPos = workHeight + singleHeight/2;
           
           //float adjustX = adjustXPos( yPos, i == mChooseIndex );
           // 根据当前字母y的位置计算得到字体大小
           int fontSize = adjustFontSize(i, yPos ); 
           mPaint.setTextSize(fontSize);
           
           // 添加一个字母的高度
           workHeight += singleHeight;
           
           // 绘制字母
           drawTextInCenter(canvas, ConstChar[i], xPos + ajustXPosAnimation(i,  yPos )  , yPos );
           
           // 绘制的字母和当前触摸到的一致, 绘制红色被选中字母
           if(i == mChooseIndex) {
               mPaint.setColor( mTipFontColor );
               mPaint.setFakeBoldText(true);
               mPaint.setTextSize( mTipFontSize );
               yPos = mTouch.y;
               
               float pos = 0;
               
               if( mAnimating || mHideAnimation ) {
                   pos = mLastFucusPostion.x;
                   yPos = mLastFucusPostion.y;
               } else {
                   pos = xPos + ajustXPosAnimation(i, yPos ) - mAdditionalTipOffset;
                   mLastFucusPostion.x = pos;
                   mLastFucusPostion.y = yPos;
               }
                   
               drawTextInCenter(canvas, ConstChar[i], pos, yPos );
//             mPaint.setStrokeWidth(5);
//             canvas.drawLine(0, yPos, width, yPos, mPaint);
           }
           mPaint.reset();
        }
        
        if( mHideAnimation ) 
        {
            canvas.restoreToCount(saveCount);
        }
       
    }
    
    /**
     * @param canvas 画板
     * @param string 被绘制的字母
     * @param xCenter 字母的中心x方向位置
     * @param yCenter 字母的中心y方向位置
     */
    private void drawTextInCenter(Canvas canvas, String string, float xCenter, float yCenter) {

        FontMetrics fm = mPaint.getFontMetrics();
        //float fontWidth = paint.measureText(string);
        float fontHeight = mPaint.getFontSpacing();
        
        float drawY = yCenter + fontHeight/2 - fm.descent;
        
        if( drawY < -fm.ascent -fm.descent )
            drawY = -fm.ascent -fm.descent;
        
        if( drawY > getHeight() )
            drawY = getHeight() ;
        
        mPaint.setTextAlign(Align.CENTER);
        
        canvas.drawText(string, xCenter, drawY, mPaint);
    }
    
    private int adjustFontSize(int i, float yPos ) {
        
        // 根据水平方向偏移量计算出一个放大的字号
        float adjustX = Math.abs(ajustXPosAnimation(i,  yPos ));
        
        int adjustSize =(int)( (mMaxFontSize - mMinFontSize ) * adjustX / (float)mMaxBezierHeight) + mMinFontSize;
        
        return adjustSize;
    }
    
    /**
     * x 方向的向左偏移量
     * @param i 当前字母的索引
     * @param yPos y方向的初始位置
     * @return
     */
    private float ajustXPosAnimation (int i, float yPos ) {

        float offset ;
        if( this.mAnimating || this.mHideAnimation ) {
            // 正在动画中或在做隐藏动画
            offset = mLastOffset[i];
            if( offset !=0.0f ) {
                offset += this.mAnimationOffset;
                if( offset > 0)
                    offset = 0;
            }
        } else {
            
            // 根据当前字母y方向位置, 计算水平方向偏移量
            offset = adjustXPos( yPos );
            
            // 当前触摸的x方向位置
            float xPos = mTouch.x  ;
            
            float width = getWidth() - mWidthOffset;
            width = width - 60;
            
            // 字母绘制时向左偏移量 进行修正, offset需要是<=0的值
            if( offset != 0.0f  && xPos > width )
                offset +=  ( xPos - width );
            if( offset > 0)
                offset = 0;
            
            mLastOffset[i] = offset;
        }
        return offset;
    }
    
    private float adjustXPos(float yPos ) {
    
        float dis = yPos - mTouch.y; // 字母y方向位置和触摸时y值坐标的差值, 距离越小, 得到的水平方向偏差越大 
        if( dis > -mMaxBezierWidth  && dis < mMaxBezierWidth ) {
            // 在2个贝赛尔曲线宽度范围以内 (一个贝赛尔曲线宽度是指一个山峰的一边)

            // 第一段 曲线
            if( dis > mMaxBezierWidth/4 ) {
                for( int i = mMaxBezierLines-1; i>0 ; i-- ) {
                    // 从下到上, 逐个计算
                    
                    if( dis == -mBezier1[i].y ) // 落在点上
                        return mBezier1[i].x;
                    
                    // 如果距离dis落在两个贝塞尔曲线模拟点之间, 通过三角函数计算得到当前dis对应的x方向偏移量
                    if( dis > -mBezier1[i].y && dis < -mBezier1[i-1].y ) {
                        return (dis + mBezier1[i].y) * ( mBezier1[i-1].x - mBezier1[i].x ) / ( -mBezier1[i-1].y + mBezier1[i].y ) + mBezier1[i].x;
                    }
                }
                return mBezier1[0].x;
            }
            
            // 第三段 曲线, 和第一段曲线对称
            if( dis < -mMaxBezierWidth/4 ) {
                for( int i = 0; i< mMaxBezierLines-1; i++ ) {
                    // 从上到下
                    
                    if( dis == mBezier1[i].y ) // 落在点上
                        return mBezier1[i].x;

                    // 如果距离dis落在两个贝塞尔曲线模拟点之间, 通过三角函数计算得到当前dis对应的x方向偏移量
                    if( dis > mBezier1[i].y && dis < mBezier1[i+1].y ) {
                        return (dis - mBezier1[i].y )* (mBezier1[i+1].x - mBezier1[i].x ) / ( mBezier1[i+1].y - mBezier1[i].y ) + mBezier1[i].x;
                    }
                }
                return mBezier1[mMaxBezierLines-1].x;
            }
            
            // 第二段 峰顶曲线
            for( int i = 0; i< mMaxBezierLines-1; i++ ) {
                
                if( dis == mBezier2[i].y )
                    return mBezier2[i].x;

                // 如果距离dis落在两个贝塞尔曲线模拟点之间, 通过三角函数计算得到当前dis对应的x方向偏移量
                if( dis > mBezier2[i].y && dis < mBezier2[i+1].y ) {
                    return ( dis - mBezier2[i].y) * ( mBezier2[i+1].x - mBezier2[i].x ) / (mBezier2[i+1].y - mBezier2[i].y ) + mBezier2[i].x;
                }
            }   
            return mBezier2[mMaxBezierLines-1].x;       

        }
        
        return 0.0f;
    }

    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
        final int action = event.getAction();
        final float y = event.getY();
        final int oldmChooseIndex = mChooseIndex;
        final OnTouchLetterChangedListener listener = mListener;
        final int c = (int) (y/getHeight()*ConstChar.length);
        
        switch (action) {
            case MotionEvent.ACTION_DOWN:
                
                if( this.getWidth() > mWidthOffset ) {
                    if ( event.getX() < this.getWidth() - mWidthOffset )
                        return false;
                }
                
                mHideWaitingHandler.removeMessages(1);
                
                mScroller.abortAnimation();
                mAnimating = false;
                mHideAnimation = false;
                mAlpha = 255;
                
                mTouch.x = event.getX();
                mTouch.y = event.getY();
                
                if(oldmChooseIndex != c && listener != null){
                    if(c > 0 && c< ConstChar.length){
                        listener.onTouchLetterChanged(ConstChar[c]);
                        mChooseIndex = c;
                    }
                }
                invalidate();               
                break;
            case MotionEvent.ACTION_MOVE:
                mTouch.x = event.getX();
                mTouch.y = event.getY();
                invalidate();
                if(oldmChooseIndex != c && listener != null){

                    if(c >= 0 && c< ConstChar.length){
                        listener.onTouchLetterChanged(ConstChar[c]);
                        mChooseIndex = c;
                    }
                }
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_CANCEL:

                mTouch.x = event.getX();
                mTouch.y = event.getY();

                //this.mChooseIndex = -1;
                
                mScroller.startScroll(0, 0, (int)mMaxBezierHeight, 0, 2000);
                mAnimating = true;
                postInvalidate();
                break;
        }
        return true;
    }
    
    @Override
    public void computeScroll() {
        super.computeScroll();
        if (mScroller.computeScrollOffset()) {
            if( mAnimating ) {
                float x = mScroller.getCurrX();
                mAnimationOffset = x;               
            } else if( mHideAnimation ) {
                mAlpha = 255 - (int) mScroller.getCurrX();
            }
            invalidate();
        } else if( mScroller.isFinished() ) {
            if( mAnimating ) {
                mHideWaitingHandler.sendEmptyMessage(1);
            } else if( mHideAnimation ) {
                mHideAnimation = false;
                this.mChooseIndex = -1;
                mTouch.x = -10000;
                mTouch.y = -10000;
            }

        }
    }
    public void setOnTouchLetterChangedListener( OnTouchLetterChangedListener listener) {
        this.mListener = listener;
    }

    /**
     * 计算出所有贝塞尔曲线上的点 
     * 个数为 mMaxBezierLines * 2 = 64
     */
    private void calculateBezierPoints() {
        
        PointF mStart = new PointF();   // 开始点
        PointF mEnd = new PointF();     // 结束点
        PointF mControl = new PointF(); // 控制点
        
        
        // 计算第一段红色部分 贝赛尔曲线的点
        // 开始点
        mStart.x = 0.0f;
        mStart.y = -mMaxBezierWidth;

        // 控制点
        mControl.x = 0.0f;
        mControl.y = -mMaxBezierWidth/2;
        
        // 结束点
        mEnd.x = - mMaxBezierHeight / 2;
        mEnd.y = - mMaxBezierWidth / 4;
        
        mBezier1[0] = new PointF();
        mBezier1[mMaxBezierLines-1] = new PointF();
        
        mBezier1[0].set(mStart);
        mBezier1[mMaxBezierLines-1].set(mEnd);
        
        for( int i = 1; i< mMaxBezierLines -1; i++ ) {
            
            mBezier1[i] = new PointF();
            
            mBezier1[i].x = calculateBezier( mStart.x, mEnd.x, mControl.x, i / (float) mMaxBezierLines );
            mBezier1[i].y = calculateBezier( mStart.y, mEnd.y, mControl.y, i / (float) mMaxBezierLines );
            
        }

        // 计算第二段蓝色部分 贝赛尔曲线的点
        mStart.y = -mMaxBezierWidth / 4;
        mStart.x = -mMaxBezierHeight / 2;
        
        mControl.y = 0.0f;
        mControl.x = -mMaxBezierHeight;

        mEnd.y = mMaxBezierWidth / 4;
        mEnd.x = -mMaxBezierHeight / 2;
        
        mBezier2[0] = new PointF();
        mBezier2[mMaxBezierLines-1] = new PointF();

        mBezier2[0].set(mStart);
        mBezier2[mMaxBezierLines-1].set(mEnd);
        
        for( int i = 1; i< mMaxBezierLines -1 ; i++ ) {
            
            mBezier2[i]= new PointF();
            mBezier2[i].x = calculateBezier( mStart.x, mEnd.x, mControl.x,  i / (float) mMaxBezierLines );
            mBezier2[i].y = calculateBezier( mStart.y, mEnd.y, mControl.y,  i / (float) mMaxBezierLines );
        }
    }

    /**
     * 贝塞尔曲线核心算法
     * @param start
     * @param end
     * @param control
     * @param val
     * @return
     * 公式及动图, 维基百科: https://en.wikipedia.org/wiki/B%C3%A9zier_curve
     * 中文可参考此网站: http://blog.csdn.net/likendsl/article/details/7852658
     * 
     */
    private float calculateBezier(float start, float end, float control, float val) {
        
        float t = val;
        float s = 1-t;
        
        float ret = start * s * s + 2 * control * s * t + end * t * t;
        
        return ret;
    }   
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 151,829评论 1 331
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 64,603评论 1 273
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 101,846评论 0 226
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 42,600评论 0 191
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 50,780评论 3 272
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 39,695评论 1 192
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,136评论 2 293
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 29,862评论 0 182
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 33,453评论 0 229
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 29,942评论 2 233
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,347评论 1 242
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 27,790评论 2 236
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,293评论 3 221
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 25,839评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,448评论 0 181
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 34,564评论 2 249
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 34,623评论 2 249

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 170,472评论 25 707
  • 一、Android开发初体验 二、Android与MVC设计模式模型对象存储着应用的数据和业务逻辑。模型类通常用来...
    为梦想战斗阅读 831评论 0 3
  • “篾络迎霜野柿红",艳而不俗的柿子又在秋风瑟瑟中挂满条条疏枝。 据说柿子树能经受约零下18度的严寒,可谓坚韧不拔。...
    然依紫阅读 604评论 10 14
  • 2017年11月18号 星期天 晴 今天是星期六,终于不用早早起床了,大宝睡到快八点...
    星曦宝贝阅读 98评论 0 0
  • 1、如果你能控制住你的注意力,你就能更好地掌控自己的生产力。在信息沟通方式多种多样的今天,能有片刻自己的时光真的是...
    文砚阅读 149评论 0 0