需要一个依赖,导入把中文转为拼音的功能
implementation 'com.belerweb:pinyin4j:2.5.1'
在values创建一个attrs
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="SideBar">
<attr name="scaleSize" format="integer"/>
<attr name="scaleItemCount" format="integer"/>
<attr name="scaleWidth" format="dimension"/>
</declare-styleable>
</resources>
两个工具类,直接复制粘贴就行
import net.sourceforge.pinyin4j.PinyinHelper;
import net.sourceforge.pinyin4j.format.HanyuPinyinCaseType;
import net.sourceforge.pinyin4j.format.HanyuPinyinOutputFormat;
import net.sourceforge.pinyin4j.format.HanyuPinyinToneType;
/**
* 汉字转换位汉语拼音,英文字符不变
*/
public class Cn2Spell {
public static StringBuffer sb = new StringBuffer();
/**
* 获取汉字字符串的首字母,英文字符不变
* 例如:阿飞→af
*/
public static String getPinYinHeadChar(String chines) {
sb.setLength(0);
char[] chars = chines.toCharArray();
HanyuPinyinOutputFormat defaultFormat = new HanyuPinyinOutputFormat();
defaultFormat.setCaseType(HanyuPinyinCaseType.LOWERCASE);
defaultFormat.setToneType(HanyuPinyinToneType.WITHOUT_TONE);
for (int i = 0; i < chars.length; i++) {
if (chars[i] > 128) {
try {
sb.append(PinyinHelper.toHanyuPinyinStringArray(chars[i], defaultFormat)[0].charAt(0));
} catch (Exception e) {
e.printStackTrace();
}
} else {
sb.append(chars[i]);
}
}
return sb.toString();
}
/**
* 获取汉字字符串的第一个字母
*/
public static String getPinYinFirstLetter(String str) {
sb.setLength(0);
char c = str.charAt(0);
String[] pinyinArray = PinyinHelper.toHanyuPinyinStringArray(c);
if (pinyinArray != null) {
sb.append(pinyinArray[0].charAt(0));
} else {
sb.append(c);
}
return sb.toString();
}
/**
* 获取汉字字符串的汉语拼音,英文字符不变
*/
public static String getPinYin(String chines) {
sb.setLength(0);
char[] nameChar = chines.toCharArray();
HanyuPinyinOutputFormat defaultFormat = new HanyuPinyinOutputFormat();
defaultFormat.setCaseType(HanyuPinyinCaseType.LOWERCASE);
defaultFormat.setToneType(HanyuPinyinToneType.WITHOUT_TONE);
for (int i = 0; i < nameChar.length; i++) {
if (nameChar[i] > 128) {
try {
sb.append(PinyinHelper.toHanyuPinyinStringArray(nameChar[i], defaultFormat)[0]);
} catch (Exception e) {
e.printStackTrace();
}
} else {
sb.append(nameChar[i]);
}
}
return sb.toString();
}
}
import android.annotation.SuppressLint;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.TextView;
import com.example.wechat.R;
@SuppressLint("AppCompatCustomView")
public class SideBar extends TextView {
private 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 Paint textPaint;
private Paint bigTextPaint;
private Paint scaleTextPaint;
private Canvas canvas;
private int itemH;
private int w;
private int h;
/**
* 普通情况下字体大小
*/
float singleTextH;
/**
* 缩放离原始的宽度
*/
private float scaleWidth;
/**
* 滑动的Y
*/
private float eventY = 0;
/**
* 缩放的倍数
*/
private int scaleSize = 1;
/**
* 缩放个数item,即开口大小
*/
private int scaleItemCount = 6;
private ISideBarSelectCallBack callBack;
public SideBar(Context context) {
this(context, null);
}
public SideBar(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public SideBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(attrs);
}
private void init(AttributeSet attrs) {
if (attrs != null) {
TypedArray ta = getContext().obtainStyledAttributes(attrs, R.styleable.SideBar);
scaleSize = ta.getInteger(R.styleable.SideBar_scaleSize, 1);
scaleItemCount = ta.getInteger(R.styleable.SideBar_scaleItemCount, 6);
scaleWidth = ta.getDimensionPixelSize(R.styleable.SideBar_scaleWidth, dp(100));
ta.recycle();
}
textPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
textPaint.setColor(getCurrentTextColor());
textPaint.setTextSize(getTextSize());
textPaint.setTextAlign(Paint.Align.CENTER);
bigTextPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
bigTextPaint.setColor(getCurrentTextColor());
bigTextPaint.setTextSize(getTextSize() * (scaleSize + 3));
bigTextPaint.setTextAlign(Paint.Align.CENTER);
scaleTextPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
scaleTextPaint.setColor(getCurrentTextColor());
scaleTextPaint.setTextSize(getTextSize() * (scaleSize + 1));
scaleTextPaint.setTextAlign(Paint.Align.CENTER);
}
public void setDataResource(String[] data) {
letters = data;
invalidate();
}
public void setOnStrSelectCallBack(ISideBarSelectCallBack callBack) {
this.callBack = callBack;
}
/**
* 设置字体缩放比例
*
* @param scale
*/
public void setScaleSize(int scale) {
scaleSize = scale;
invalidate();
}
/**
* 设置缩放字体的个数,即开口大小
*
* @param scaleItemCount
*/
public void setScaleItemCount(int scaleItemCount) {
this.scaleItemCount = scaleItemCount;
invalidate();
}
private int dp(int px) {
final float scale = getContext().getResources().getDisplayMetrics().density;
return (int) (px * scale + 0.5f);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
if (event.getX() > (w - getPaddingRight() - singleTextH - 10)) {
eventY = event.getY();
invalidate();
return true;
} else {
eventY = 0;
invalidate();
break;
}
case MotionEvent.ACTION_CANCEL:
eventY = 0;
invalidate();
return true;
case MotionEvent.ACTION_UP:
if (event.getX() > (w - getPaddingRight() - singleTextH - 10)) {
eventY = 0;
invalidate();
return true;
} else
break;
}
return super.onTouchEvent(event);
}
@Override
protected void onDraw(Canvas canvas) {
this.canvas = canvas;
DrawView(eventY);
}
private void DrawView(float y) {
int currentSelectIndex = -1;
if (y != 0) {
for (int i = 0; i < letters.length; i++) {
float currentItemY = itemH * i;
float nextItemY = itemH * (i + 1);
if (y >= currentItemY && y < nextItemY) {
currentSelectIndex = i;
if (callBack != null) {
callBack.onSelectStr(currentSelectIndex, letters[i]);
}
//画大的字母
Paint.FontMetrics fontMetrics = bigTextPaint.getFontMetrics();
float bigTextSize = fontMetrics.descent - fontMetrics.ascent;
canvas.drawText(letters[i], w - getPaddingRight() - scaleWidth - bigTextSize, singleTextH + itemH * i, bigTextPaint);
}
}
}
drawLetters(y, currentSelectIndex);
}
private void drawLetters(float y, int index) {
//第一次进来没有缩放情况,默认画原图
if (index == -1) {
w = getMeasuredWidth();
h = getMeasuredHeight();
itemH = h / letters.length;
Paint.FontMetrics fontMetrics = textPaint.getFontMetrics();
singleTextH = fontMetrics.descent - fontMetrics.ascent;
for (int i = 0; i < letters.length; i++) {
canvas.drawText(letters[i], w - getPaddingRight(), singleTextH + itemH * i, textPaint);
}
//触摸的时候画缩放图
} else {
//遍历所有字母
for (int i = 0; i < letters.length; i++) {
//要画的字母的起始Y坐标
float currentItemToDrawY = singleTextH + itemH * i;
float centerItemToDrawY;
if (index < i)
centerItemToDrawY = singleTextH + itemH * (index + scaleItemCount);
else
centerItemToDrawY = singleTextH + itemH * (index - scaleItemCount);
float delta = 1 - Math.abs((y - currentItemToDrawY) / (centerItemToDrawY - currentItemToDrawY));
float maxRightX = w - getPaddingRight();
//如果大于0,表明在y坐标上方
scaleTextPaint.setTextSize(getTextSize() + getTextSize() * delta);
float drawX = maxRightX - scaleWidth * delta;
//超出边界直接花在边界上
if (drawX > maxRightX)
canvas.drawText(letters[i], maxRightX, singleTextH + itemH * i, textPaint);
else
canvas.drawText(letters[i], drawX, singleTextH + itemH * i, scaleTextPaint);
}
}
}
public interface ISideBarSelectCallBack {
void onSelectStr(int index, String selectStr);
}
}
前期工作做好了,然后界面
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/userlist"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.example.wechat.util.SideBar
android:id="@+id/sidebar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:paddingRight="10dp"
android:textColor="@color/colorGreen"
android:textSize="15sp" />
</RelativeLayout>
item,这个根布局需要用相对布局,线性布局老是有bug,我也不知道原因,反正换成相对布局就正常显示了
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="@+id/letterlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorLightGray">
<TextView
android:id="@+id/letter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="6dp"
android:text="A"
android:textColor="#646262"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:id="@+id/layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/letterlayout"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.example.wechat.util.RoundImageView
android:id="@+id/header"
android:layout_width="55dp"
android:layout_height="55dp"
android:layout_margin="5dp"
android:src="@drawable/head_test" />
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:padding="10dp"
android:text="@string/app_name"
android:textColor="@color/colorBlack"
android:textSize="20sp" />
</LinearLayout>
<View
android:id="@+id/underline"
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:layout_below="@id/name"
android:layout_marginLeft="60dp"
android:background="@color/colorLightGray"/>
</LinearLayout>
</RelativeLayout>
User在这个功能里用到的属性只有name,headerid,pinyin和start,两个接口一个是用来传递消息,一个用来排序
package com.example.wechat.bean;
import com.example.wechat.util.Cn2Spell;
import java.io.Serializable;
import java.util.Date;
public class User implements Serializable, Comparable<User> {
String name; //名字
String content; //内容
String time; //日期
int headerid; //头像
String pinyin; //中文转换为拼音
String start; //首字母
public User(String name, String content, String time, int headerid) {
this.name = name;
this.content = content;
this.time = time;
this.headerid = headerid;
}
public User(String name,int headerid) {
this.headerid = headerid;
this.name = name;
pinyin = Cn2Spell.getPinYin(name);
start = pinyin.substring(0, 1).toUpperCase();
if (!start.matches("[A-Z]")) {
start = "#";
}
}
public void setPinyin(String pinyin) {
this.pinyin = pinyin;
}
public void setStart(String start) {
this.start = start;
}
public String getPinyin() {
return pinyin;
}
public String getStart() {
return start;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
public String getTime() {
return time;
}
public void setTime(String time) {
this.time = time;
}
public int getHeaderid() {
return headerid;
}
public void setHeaderid(int headerid) {
this.headerid = headerid;
}
@Override
public int compareTo(User user) {
if (start.equals("#") && !user.getStart().equals("#")) {
return 1;
} else if (!start.equals("#") && user.getStart().equals("#")) {
return -1;
} else {
return pinyin.compareToIgnoreCase(user.getPinyin());
}
}
}
Adapter,里面有一点逻辑判断什么时候显示字母的View,什么时候显示下划线,很简单的逻辑一看就懂
package com.example.wechat.adapter;
import android.content.Context;
import android.content.Intent;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;
import com.example.wechat.R;
import com.example.wechat.activity.ItemDetail;
import com.example.wechat.bean.User;
import com.example.wechat.util.RoundImageView;
import java.util.ArrayList;
import java.util.List;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
public class FriendAdapter extends RecyclerView.Adapter<FriendAdapter.ViewHolder> {
List<User> users = new ArrayList<>();
Context context;
LayoutInflater inflater;
public FriendAdapter(List<User> users, Context context) {
this.users = users;
this.context = context;
inflater = LayoutInflater.from(context);
}
@NonNull
@Override
public FriendAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = inflater.inflate(R.layout.friend_item, null);
ViewHolder viewHolder = new ViewHolder(view);
return viewHolder;
}
@Override
public void onBindViewHolder(@NonNull FriendAdapter.ViewHolder holder, final int position) {
final User user = users.get(position);
holder.name.setText(user.getName());
holder.header.setImageResource(user.getHeaderid());
holder.view.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(context, ItemDetail.class);
intent.putExtra("user_data",user);
context.startActivity(intent);
}
});
String mark = user.getStart();
if (position == getPosition(mark)){
holder.letterlayout.setVisibility(View.VISIBLE);
holder.letter.setText(user.getStart());
}else {
holder.letterlayout.setVisibility(View.GONE);
}
if (position!=getItemCount()-1&&user.getStart().equalsIgnoreCase(users.get(position+1).getStart())){
holder.underline.setVisibility(View.VISIBLE);
}else {
holder.underline.setVisibility(View.GONE);
}
}
private int getPosition(String mark) {
for (int i=0;i<getItemCount();i++){
if (users.get(i).getStart().equalsIgnoreCase(mark)){
return i;
}
}
return -1;
}
@Override
public int getItemCount() {
return users.size();
}
public class ViewHolder extends RecyclerView.ViewHolder {
LinearLayout letterlayout;
TextView letter;
TextView name;
RoundImageView header;
View view;
View underline;
public ViewHolder(@NonNull View itemView) {
super(itemView);
view = itemView;
underline = itemView.findViewById(R.id.underline);
letterlayout = itemView.findViewById(R.id.letterlayout);
letter = itemView.findViewById(R.id.letter);
name = itemView.findViewById(R.id.name);
header = itemView.findViewById(R.id.header);
}
}
}
Fragment
package com.example.wechat.fragment;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import com.example.wechat.R;
import com.example.wechat.adapter.FriendAdapter;
import com.example.wechat.bean.User;
import com.example.wechat.util.SideBar;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
public class FriendFragment extends Fragment {
RecyclerView userlist;
SideBar sideBar;
FriendAdapter friendAdapter;
List<User> users = new ArrayList<>();
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.friendfragment, container, false);
userlist = view.findViewById(R.id.userlist);
sideBar = view.findViewById(R.id.sidebar);
users.clear();
initData();
initView();
return view;
}
private void initView() {
LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getContext());
userlist.setLayoutManager(linearLayoutManager);
friendAdapter = new FriendAdapter(users, getContext());
userlist.setAdapter(friendAdapter);
sideBar.setOnStrSelectCallBack(new SideBar.ISideBarSelectCallBack() {
@Override
public void onSelectStr(int index, String selectStr) {
for (int i = 0; i < users.size(); i++) {
if (selectStr.equalsIgnoreCase(users.get(i).getStart())){
userlist.scrollToPosition(i);
return;
}
}
}
});
}
private void initData() {
users.add(new User("丽丽",R.drawable.head_test));
users.add(new User("妈妈",R.drawable.mama));
users.add(new User("爸爸",R.drawable.baba));
users.add(new User("#xx",R.drawable.head_test));
users.add(new User("虹猫",R.drawable.head_test));
users.add(new User("蓝兔",R.drawable.head_test));
users.add(new User("阿牛",R.drawable.head_test));
users.add(new User("CK",R.drawable.head_test));
users.add(new User("灯虎",R.drawable.head_test));
users.add(new User("尔康",R.drawable.head_test));
users.add(new User("凡哥",R.drawable.head_test));
users.add(new User("Gr",R.drawable.head_test));
users.add(new User("123阿斯顿",R.drawable.head_test));
Collections.sort(users);
}
}