1、效果图如下：

字母索引.gif

2、实现

2.1自定义IndexesView_06继承View

public class IndexesView_06 extends View {
    private Paint paint;
    private String[] letterList = 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 = "IndexesView_06";
    private String mCurrentText;


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

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

    public IndexesView_06(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        paint = new Paint();
        paint.setAntiAlias(true);
        paint.setColor(Color.BLACK);
        paint.setTextSize(pxToSp(12));
    }


    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int textWidth = (int) paint.measureText("A");//A字母的宽度
        int width = textWidth + getPaddingLeft() + getPaddingRight();
        int height = MeasureSpec.getSize(heightMeasureSpec);

        setMeasuredDimension(width, height);
    }

    private float pxToSp(int sp) {
        return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, sp, getResources().getDisplayMetrics());
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //每个字母Item的高度
        int itemHeight = (getHeight() - getPaddingTop() - getPaddingBottom()) / letterList.length;
        for (int i = 0; i < letterList.length; i++) {
            //求文字的x 轴中心 ：item 的宽度/2 -字母的宽度/2
            int textWidth = (int) paint.measureText(letterList[i]);//A字母的宽度
            int letterCenterX = getWidth() / 2 - textWidth / 2;

            //文字的Y轴中心 ：第几个字母*字母Item的高度 + 字母一半的高度 和顶部的padding高度
            int letterCenterY = i * itemHeight + itemHeight / 2;
            //字体的基线
            Paint.FontMetrics fontMetrics = paint.getFontMetrics();
            int dy = (int) ((fontMetrics.bottom - fontMetrics.top) / 2 - fontMetrics.bottom);
            int baseLine = letterCenterY + dy;


            if (letterList[i].equals(mCurrentText)) {
                paint.setColor(Color.BLUE);
            } else {
                paint.setColor(Color.BLACK);
            }
            canvas.drawText(letterList[i], letterCenterX, baseLine, paint);
        }
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
            case MotionEvent.ACTION_MOVE:

                float eventY = event.getY();
                int itemHeight = (getHeight() - getPaddingTop() - getPaddingBottom()) / letterList.length;
                int currentCode = (int) eventY / itemHeight;

                if (currentCode < 0)
                    currentCode = 0;

                if (currentCode > letterList.length - 1)
                    currentCode = letterList.length - 1;

                mCurrentText = letterList[currentCode];

                if (listener != null) {
                    listener.touch(mCurrentText);
                }
                break;

            case MotionEvent.ACTION_UP:
                if (listener != null) {
                    listener.touch("");
                }
                mCurrentText="";

                break;
        }
        invalidate();
        return true;
    }

    private currentListener listener;

    public void setListener(currentListener listener) {
        this.listener = listener;
    }

    public interface currentListener {
        void touch(String text);
    }
}

2.2、使用

xml:

public class IndexeFragment_06 extends Fragment {
   private IndexesView_06 view_06;
   private TextView textView;
   private static final String TAG = "IndexeFragment_06";

   @Nullable
   @Override
   public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
       View view = inflater.inflate(R.layout.view_06, container, false);
       view_06 = view.findViewById(R.id.letter_view);
       textView = view.findViewById(R.id.letter_text);
       view_06.setListener(new IndexesView_06.currentListener() {
           @Override
           public void touch(String text) {
               textView.setText(text);
           }
       });
       return view;
   }

}

fragment:

public class IndexeFragment_06 extends Fragment {
    private IndexesView_06 view_06;
    private TextView textView;
    private static final String TAG = "IndexeFragment_06";

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.view_06, container, false);
        view_06 = view.findViewById(R.id.letter_view);
        textView = view.findViewById(R.id.letter_text);
        view_06.setListener(new IndexesView_06.currentListener() {
            @Override
            public void touch(String text) {
                textView.setText(text);
            }
        });
        return view;
    }

}
```