Android添加@联系人功能

Android添加@联系人功能

年后聊天项目加了个@联系人功能的需求，网上找了几个Demo都不尽人意，按照需求需要处理的细节很多觉得稍显繁复，后来想到@功能也就和短信的添加收件人的功能差不多，就自己动手写了一个，这里分享出来给以供参考！

效果图



需求分析

@联系人高亮

数据保存和还原

检测用户输入@跳转到联系人选择

@块删除时作为一个整体删除，用户点击时光标不可出现在@块内部

点击@块跳转

思路整理

看似功能并不复杂，但实际操作起来就会发现蜀道之难啊，数据高亮这点简单不必细说，数据的保存和还原只需要根据数据规则利用正则表达式处理即可，需求要求@块作为一个整体删除，同时光标不可以出现在@块内部，网上一般的思路是使用ForegroundColorSpan来高亮突出@块，同时重写EditeText的方法监听输入和删除，虽然也能达到效果但是需要写的代码有点多，这时候想到能不能像处理表情一样使用一个类似于ImageSpan的东西来做呢，但是@后的数据多变并不确定，所以需要自定义一个ImageSpan能根据内容变化,这样只需要自定义一个Span类型就可以，不用特意处理删除光标等问题。

代码实现

自定义Span

这个自定义的ViewSpan来自短信项目的收件人控件，继承自ReplacementSpan，当控件显示的时候会使用指定的View替代指定的字符串显示，而当getText().toString()的时候获得是原始字符串。

public class ViewSpan extends ReplacementSpan {
protected View view;
private int maxWidth;

public ViewSpan(View v, int maxWidth) {
super();
this.maxWidth = maxWidth;
view = v;
view.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
}

private void prepView() {
int widthSpec = View.MeasureSpec.makeMeasureSpec(maxWidth, View.MeasureSpec.AT_MOST);
int heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);

view.measure(widthSpec, heightSpec);
view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
}
@Override
public void draw(@NonNull Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom,@NonNull Paint paint) {
prepView();

canvas.save();
//Centering the token looks like a better strategy that aligning the bottom
int padding = (bottom - top - view.getBottom()) / 2;
canvas.translate(x, bottom - view.getBottom() - padding);
//这一句是重点，将view画在指定canvas上
view.draw(canvas);
canvas.restore();
}
@Override
public int getSize(@NonNull Paint paint, CharSequence charSequence, int i, int i2, Paint.FontMetricsInt fm) {
prepView();

if (fm != null) {
//We need to make sure the layout allots enough space for the view
int height = view.getMeasuredHeight();
int need = height - (fm.descent - fm.ascent);
if (need > 0) {
int ascent = need / 2;
//This makes sure the text drawing area will be tall enough for the view
fm.descent += need - ascent;
fm.ascent -= ascent;
fm.bottom += need - ascent;
fm.top -= need / 2;
}
}

return view.getRight();
}
}

数据的存储和还原

这里使用正则表达式匹配@字符串，规则是"@user:"+手机号，这个可以根据情况随便改

//匹配的正则
public static final String regEx = "(.|\\n)*@user:1[3,5,7,8]\\d{9}(.|\\n)*";
//分割字符串的正则
public static final String splitRegex = "@user:1[3,5,7,8]\\d{9}";

生成Span的方法

public static SpannableString getSpan(final TextView textView, String usrStr){
final String phone = usrStr.split(":")[1];
String str;
User user = findUser(phone);
if(user == null){
str = "@" + phone;
}else {
str = "@" + user.name;
}
SpannableString spanText = new SpannableString(usrStr);
TextView spanTv = (TextView) LayoutInflater.from(textView.getContext()).inflate(R.layout.item_at, (ViewGroup) textView.getParent(), false);
spanTv.setText(str);
//第二个参数其实应该是用textView的最大宽度，这里的300是随便写的
ViewSpan span = new ViewSpan(spanTv,300);
spanText.setSpan(span, 0, spanText.length(), Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
//添加点击事件
ClickableSpan clickableSpan = new ClickableSpan() {
@Override
public void onClick(View widget) {
Toast.makeText(textView.getContext(), phone, Toast.LENGTH_SHORT).show();
}
};
spanText.setSpan(clickableSpan,0, spanText.length(), Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
return spanText;
}

显示数据

根据正则表达式匹配分割字符串然后截取替换再重新组合

public static void setText(TextView textView, String str){
if(str.matches(regEx)){
textView.setText("");
String[] splitStrs = str.split(splitRegex);
int num = splitStrs.length;
int temp = 0;
for(int i =0; i < num; i++){
textView.append(splitStrs[i]);
if((i+1) != num){
int n = splitStrs[i].length();
n += temp;
int m = str.indexOf(splitStrs[i+1], n);
String usr = str.substring(n, m);
temp = n + usr.length();
textView.append(getSpan(textView,usr));
Log.d("@Span",usr);
}
}
}else{
textView.setText(str);
}
}

如果要获取textView中的原始字符串只需要使用

textView.getText().toString()

即可。

监听EditText的输入事件当用户输入@的时候跳转到联系人选择

editText.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}

@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
Log.d("onTextChanged","start="+start+" before="+before+" count="+count);
if(start==s.length()-1 && s.toString().endsWith("@")){
//TODO 用户输入@
}
}

@Override
public void afterTextChanged(Editable s) {
}
});

==注意事项==

如果要给@块添加点击事件需要添加下面的代码

//TextView
textView.setMovementMethod(LinkMovementMethod.getInstance());
//EditText
editText.setMovementMethod(LinkMovementMethod.getInstance());

如果有保存草稿的功能，当草稿以“@”结尾的时候，还原草稿不应该触发EditText的监听，所以应该在还原草稿之后再添加监听事件，这个时候如果已经添加了TextWatcher的话应该先调用

editText.removeTextChangedListener()

移除监听。

Demo下载地地址 http://download.csdn.net/detail/w804518214/9758786

下载到的文件是个AndroidStudio Module请在你自己的新建工程内选择import module;