前言:在上一篇文章中,记录了一种利用流式布局+自定义TextView实现的点赞列表,但是这话方式实现的效果并不是很好(对齐问题)。那么今天,就把项目中使用的方式摘出来单独写一个demo记录一下。
今天仅仅利用一个自定义TextView实现点赞列表,首先我们要明确实现哪些效果:展示点赞列表,并实现点击点赞人名字获取到其用户Id,用于跳转至其个人资料。
接下来,就一步步的实现这一功能(创建项目什么的就不写了);
Step1,自定义TextView
创建GiveLikeView继承自TextView,重写其构造函数。之后定义一个上下文Context和一个列表,定义两个方法用于绑定数据以及界面渲染,分别是bindData、与notifyDataChanged,代码如下:
public class GiveLikeView extends TextView{ private Context mContext; private List<Like> list; public GiveLikeView(Context context) { this(context, null); } public GiveLikeView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public GiveLikeView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); mContext = context; } //绑定数据 public void bindData(List<Like> list){ this.list = list; } //界面渲染 public void notifyDataChanged() { if (list == null || list.size() <= 0) { return; } SpannableStringBuilder builder = new SpannableStringBuilder(); builder.append(getIcon()); for (int i = 0; i < list.size(); i++) { Like item = list.get(i); builder.append(getClickedTxt(item)); if (i != list.size() - 1) { builder.append(" , "); } else { builder.append("赞了一个!"); } } setText(builder); setMovementMethod(LinkMovementMethod.getInstance()); } private SpannableString getClickedTxt(final Like item) { SpannableString str = new SpannableString(item.userName); ClickableSpan span = new ClickableSpan() { @Override public void onClick(View widget) { Log.e("userId",item.userId+"#"); } @Override public void updateDrawState(TextPaint ds) { super.updateDrawState(ds); // 设置文字颜色 ds.setColor(Color.parseColor("#3CB371")); ds.setUnderlineText(false); ds.clearShadowLayer(); } }; str.setSpan(span, 0, str.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); return str; } //插入图标 private SpannableString getIcon() { String str = " "; SpannableString icon = new SpannableString(str); icon.setSpan(new ImageSpan(getContext(), R.mipmap.dz1, DynamicDrawableSpan.ALIGN_BASELINE), 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); return icon; } }
Step2,使用GiveLikeView
在界面布局文件中添加一个GiveLikeView并设置其宽度为match_parent,高度包括内容,设置字体大小为18像素,代码如下:
<com.example.administrator.givelikedemo.GiveLikeView android:id="@+id/gl_view" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="clip_vertical" android:textSize="18sp"/>
Step3,绑定数据
在这里我们自己定义一个List,添加一些虚假数据:
gv = findViewById(R.id.gl_view); //模拟数据 for(int i = 0;i<20;i++){ Like like = new Like(); like.userId = i; like.userName = "User"+i; list.add(like); } gv.bindData(list); gv.notifyDataChanged();
Step4,效果图