Android仿微信通訊錄列表側(cè)邊欄效果-創(chuàng)新互聯(lián)

先看Android仿微信通訊錄列表側(cè)邊欄效果圖

成都創(chuàng)新互聯(lián)公司主營(yíng)吉水網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,成都app開(kāi)發(fā),吉水h5重慶小程序開(kāi)發(fā)搭建,吉水網(wǎng)站營(yíng)銷推廣歡迎吉水等地區(qū)企業(yè)咨詢

這是比較常見(jiàn)的效果了吧

列表根據(jù)首字符的拼音字母來(lái)排序，且可以通過(guò)側(cè)邊欄的字母索引來(lái)進(jìn)行定位。

實(shí)現(xiàn)這樣一個(gè)效果并不難，只要自定義一個(gè)索引View，然后引入一個(gè)可以對(duì)漢字進(jìn)行拼音解析的jar包——pinyin4j-2.5.0即可

首先，先來(lái)定義側(cè)邊欄控件View，只要直接畫(huà)出來(lái)即可。

字母選中項(xiàng)會(huì)變?yōu)榧t色，且滑動(dòng)時(shí)背景會(huì)變色，此時(shí)SideBar并不包含居中的提示文本

public class SideBar extends View {

  private Paint paint = new Paint();

  private int choose = -1;

  private boolean showBackground;

  public static String[] letters = {"#", "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 OnChooseLetterChangedListener onChooseLetterChangedListener;

  public SideBar(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
  }

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

  public SideBar(Context context) {
    super(context);
  }

  protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    if (showBackground) {
      canvas.drawColor(Color.parseColor("#D9D9D9"));
    }
    int height = getHeight();
    int width = getWidth();
    //平均每個(gè)字母占的高度
    int singleHeight = height / letters.length;
    for (int i = 0; i < letters.length; i++) {
      paint.setColor(Color.BLACK);
      paint.setAntiAlias(true);
      paint.setTextSize(25);
      if (i == choose) {
        paint.setColor(Color.parseColor("#FF2828"));
        paint.setFakeBoldText(true);
      }
      float x = width / 2 - paint.measureText(letters[i]) / 2;
      float y = singleHeight * i + singleHeight;
      canvas.drawText(letters[i], x, y, paint);
      paint.reset();
    }
  }

  @Override
  public boolean dispatchTouchEvent(MotionEvent event) {
    int action = event.getAction();
    float y = event.getY();
    int oldChoose = choose;
    int c = (int) (y / getHeight() * letters.length);
    switch (action) {
      case MotionEvent.ACTION_DOWN:
        showBackground = true;
        if (oldChoose != c && onChooseLetterChangedListener != null) {
          if (c > -1 && c < letters.length) {
            onChooseLetterChangedListener.onChooseLetter(letters[c]);
            choose = c;
            invalidate();
          }
        }
        break;
      case MotionEvent.ACTION_MOVE:
        if (oldChoose != c && onChooseLetterChangedListener != null) {
          if (c > -1 && c < letters.length) {
            onChooseLetterChangedListener.onChooseLetter(letters[c]);
            choose = c;
            invalidate();
          }
        }
        break;
      case MotionEvent.ACTION_UP:
        showBackground = false;
        choose = -1;
        if (onChooseLetterChangedListener != null) {
          onChooseLetterChangedListener.onNoChooseLetter();
        }
        invalidate();
        break;
    }
    return true;
  }

  @Override
  public boolean onTouchEvent(MotionEvent event) {
    return super.onTouchEvent(event);
  }

  public void setOnTouchingLetterChangedListener(OnChooseLetterChangedListener onChooseLetterChangedListener) {
    this.onChooseLetterChangedListener = onChooseLetterChangedListener;
  }

  public interface OnChooseLetterChangedListener {

    void onChooseLetter(String s);

    void onNoChooseLetter();

  }

}

分享文章：Android仿微信通訊錄列表側(cè)邊欄效果-創(chuàng)新互聯(lián)
文章鏈接：http://muchs.cn/article28/hoojp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供手機(jī)網(wǎng)站建設(shè)、網(wǎng)站導(dǎo)航、商城網(wǎng)站、網(wǎng)站排名、網(wǎng)站內(nèi)鏈、品牌網(wǎng)站設(shè)計(jì)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)