Android仿微信实现首字母导航条

本文介绍android实现首字母导航条，先看张效果图，具体怎么实现看代码吧

具体的步骤

1.整体布局的显示
2. 实现a-z的分组
3. 自定义a-z的导航条
4. 中间显示/隐藏触摸到导航条具体的字母

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<linearlayout 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"
 android:background="#fff"
 android:orientation="vertical"
 tools:context="com.example.firstnavigation.mainactivity">


 <framelayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content">

  <!--listview-->

  <listview
   android:id="@+id/friend_listview"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:layout_gravity="center" />

  <!--中间显示的字母-->

  <textview
   android:id="@+id/tv_first"
   android:layout_width="80dp"
   android:layout_height="80dp"
   android:layout_gravity="center"
   android:text="a"
   android:textcolor="#ff0000"
   android:textsize="30sp"
   android:visibility="gone" />

   <!--自定义导航条-->

  <com.example.firstnavigation.slidview
   android:id="@+id/slidview"
   android:layout_width="30dp"
   android:layout_height="match_parent"
   android:layout_gravity="right|center" />
 </framelayout>
</linearlayout>

 item.xml —-》listview对应item

<?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:background="#fff"
 android:orientation="vertical">

 <!--首字母-->

 <textview
  android:id="@+id/tv"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="#9e9d9d"
  android:textcolor="#fff"
  android:textsize="16sp" />

 <!--首字母对应的首个汉字-->

 <textview
  android:id="@+id/name"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:textcolor="#262626"
  android:textsize="16sp" />
</linearlayout>

联系人bean

public class contact {
 //姓名
 private string name;
 //姓名的首字母
 private string firstword;

 public string getname() {
  return name;
 }

 public void setname(string name) {
  this.name = name;
 }

 public string getfirstword() {
  return firstword;
 }

 public void setfirstword(string ch) {
  this.firstword = ch;
 }
}

contactadapter.java

public class contactadapter extends baseadapter {
 private arraylist<contact> arraylist;
 private context context;
 private string pre = "a";

 public contactadapter(arraylist<contact> arraylist, context context) {
  this.arraylist = arraylist;
  this.context = context;
 }

 @override
 public int getcount() {
  return arraylist.size();
 }

 @override
 public object getitem(int position) {
  return arraylist.get(position);
 }

 @override
 public long getitemid(int position) {
  return position;
 }

 @override
 public view getview(int position, view convertview, viewgroup parent) {
  viewholder viewholder;
  if (convertview == null) {
   viewholder = new viewholder();
   convertview = layoutinflater.from(context).inflate(r.layout.item, parent, false);
   viewholder.tv_firstword = (textview) convertview.findviewbyid(r.id.tv);
   viewholder.name = (textview) convertview.findviewbyid(r.id.name);
   convertview.settag(viewholder);
  } else {
   viewholder = (viewholder) convertview.gettag();
  }
  viewholder.tv_firstword.settext(string.valueof(arraylist.get(position).getfirstword()));
  viewholder.name.settext(arraylist.get(position).getname());
  /**
   * 分组:根据汉字的首字母
   */
  viewholder.tv_firstword.setvisibility(!arraylist.get(position).getfirstword().equals(pre) ? view.visible : view.gone);
  pre = arraylist.get(position).getfirstword();
  return convertview;
 }

 class viewholder {
  textview tv_firstword;
  textview name;
 }

mainactivity

public class mainactivity extends appcompatactivity {
 private listview listview;
 private textview tv_first;
 private arraylist<contact> contacts;
 private slidview slidview;

 @override
 protected void oncreate(bundle savedinstancestate) {
  super.oncreate(savedinstancestate);
  setcontentview(r.layout.activity_main);
  initview();
  initdata();
 }

 private void initview() {
  listview = (listview) findviewbyid(r.id.friend_listview);
  tv_first = (textview) findviewbyid(r.id.tv_first);
  slidview = (slidview) findviewbyid(r.id.slidview);
  slidview.setfirstlistener(new ontouchfirstlistener() {
   @override
   public void ontouch(string str) {
    tv_first.setvisibility(view.visible);
    tv_first.settext(str);
    for (int i = 0; i < contacts.size(); i++) {
     if (str.equals(contacts.get(i).getfirstword())) {
      listview.setselection(i);
     }
    }
   }

   @override
   public void onrelease() {
    new handler().postdelayed(new runnable() {
     @override
     public void run() {
      tv_first.setvisibility(view.gone);
     }
    }, 300);
   }
  });
 }

 private void initdata() {
  contacts = new arraylist<>();
  //获取字符数组资源
  string[] attrs = getresources().getstringarray(r.array.myfriend);
  contact contact;
  for (int i = 0; i < attrs.length; i++) {
   contact = new contact();
   contact.setname(attrs[i]);
   contact.setfirstword(getpinyinheadchar(attrs[i], 2));
   contacts.add(contact);
  }
  //排序a-z
  collections.sort(contacts, new comparator<contact>() {
   @override
   public int compare(contact lhs, contact rhs) {
    return lhs.getfirstword().compareto(rhs.getfirstword());
   }
  });
  contactadapter contactadapter = new contactadapter(contacts, this);
  listview.setadapter(contactadapter);
 }

 /**
  * 提取汉字的首字母，如果里面含有费中文字符则忽略之；如果全为非中文则返回""。
  *
  * @param casetype 当为1时获取的首字母为小写，否则为大写。
  */
 public static string getpinyinheadchar(string zn_str, int casetype) {
  if (zn_str != null && !zn_str.trim().equalsignorecase("")) {
   char[] strchar = zn_str.tochararray();
   // 汉语拼音格式输出类
   hanyupinyinoutputformat hanyupinoutputformat = new hanyupinyinoutputformat();
   // 输出设置，大小写，音标方式等
   if (1 == casetype) {
    hanyupinoutputformat.setcasetype(hanyupinyincasetype.lowercase);
   } else {
    hanyupinoutputformat.setcasetype(hanyupinyincasetype.uppercase);
   }
   hanyupinoutputformat.settonetype(hanyupinyintonetype.without_tone);
   hanyupinoutputformat.setvchartype(hanyupinyinvchartype.with_v);
   stringbuffer pystringbuffer = new stringbuffer();
   char c = strchar[0];
   char pyc;
   if (string.valueof(c).matches("[\\u4e00-\\u9fa5]+")) {//是中文或者a-z或者a-z转换拼音
    try {
     string[] pystirngarray = pinyinhelper.tohanyupinyinstringarray(strchar[0], hanyupinoutputformat);
     if (null != pystirngarray && pystirngarray[0] != null) {
      pyc = pystirngarray[0].charat(0);
      pystringbuffer.append(pyc);
     }
    } catch (badhanyupinyinoutputformatcombination e) {
     e.printstacktrace();
    }
   }
   return pystringbuffer.tostring();
  }
  return null;
 }

提取首字母需要用到pingyin4j.jar，小编在这不提供，大家可以在网上下载

//自定义字母导航控件
public class slidview extends view {
 private string[] strs = {"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;
 private ontouchfirstlistener listener;

 public slidview(context context) {
  this(context, null);
 }

 public slidview(context context, attributeset attrs) {
  this(context, attrs, 0);
 }

 public slidview(context context, attributeset attrs, int defstyleattr) {
  super(context, attrs, defstyleattr);
  paint = new paint();
  paint.setantialias(true);
  paint.setcolor(color.gray);
  paint.settypeface(typeface.default_bold);

 }

 // px---->sp
 protected int sp2px(int spval) {
  return (int) typedvalue.applydimension(typedvalue.complex_unit_sp, spval, getresources().getdisplaymetrics());
 }

 @override
 protected void ondraw(canvas canvas) {
  super.ondraw(canvas);
  for (int i = 0; i < strs.length; i++) {
   paint.setcolor(i == index ? color.red : color.black);
   paint.settextsize(i == index ? sp2px(18) : sp2px(16));
   int x = (int) (getwidth() - paint.measuretext(strs[i])) / 2;
   int y = getheight() / strs.length * (i + 1);
   canvas.drawtext(strs[i], x, y, paint);
  }
 }

 int index = -1; //获取触摸到字母索引的位置

 //触碰事件
 //按下，松开，拖动
 @override
 public boolean ontouchevent(motionevent event) {
  switch (event.getaction()) {
   case motionevent.action_down:
   case motionevent.action_move:
    float y = event.gety();
    this.setbackgroundcolor(color.gray);
    //获取触摸到字母的位置
    index = (int) y * strs.length / getheight();
    listener.ontouch(strs[index]);
    break;
   case motionevent.action_up:
    this.setbackgroundcolor(android.r.color.transparent);
    index = -1;
    listener.onrelease();
    break;
  }
  //重绘
  invalidate();
  return true;
 }

 public void setfirstlistener(ontouchfirstlistener listener) {
  this.listener = listener;
 }
}


/**
 * ontouchfirstlistener 接口
 * ontouch：触摸到了那个字母
 * onrelease:up释放时中间显示的字母需要设置为gone
 */
public interface ontouchfirstlistener {
 void ontouch(string ch);
 void onrelease();
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。