26
2017
09

Android评论功能

Android评论功能

最近有个评论功能的需求,便学习了下,做个demo练练手,话说这也开启了我自定义view学习的旅途了吧,ok,先看下效果图吧

点击回复展开/收起回复列表


代码实现

整个项目的结构图大家先看下,文尾附源码链接
这里写图片描述

布局文件xml

这个主要是用到自定义view知识,其中评论,回复分别是一个自定义view,布局都差不多,评论的xml代码如下:

<LinearLayout               xmlns:android="http://schemas.android.com/apk/res/android"      xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
    >
 <LinearLayout
    android:id="@+id/ll_comment_item"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
 <com.example.studycommentdemo.testcommentdemo.CircleImageView
        android:id="@+id/iv_avater"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:src="@mipmap/touxiang"
        app:civ_border_color="#FFEEEEEE"
        app:civ_border_width="1dp" />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:orientation="vertical">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp">
            <TextView
                android:id="@+id/tv_comment_username"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Geek"
                android:textColor="#8290AF" />
            <TextView
                android:id="@+id/tv_comment_reply_time"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="10dp"
                android:text="33分钟前"
                android:layout_alignParentTop="true"
                android:layout_alignParentEnd="true" />
        </RelativeLayout>
        <TextView
            android:id="@+id/tv_comment_content"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/tv_comment_username"
            android:textSize="16sp"
            android:layout_marginLeft="5dp"
            android:layout_marginTop="2dp"
            android:text="66666" />
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="15dp"
            >
            <TextView
                android:id="@+id/tv_comment_reply"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:layout_marginLeft="5dp"
                android:paddingRight="10dp"
                android:text="回复"
                android:textSize="10dp" />        
            <TextView
                android:id="@+id/tv_comment_favor_count"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_toLeftOf="@id/tv_comment_reply"
                android:text="点赞"
                android:textSize="10dp" />
        </RelativeLayout>
    </LinearLayout>
</LinearLayout>
<com.example.studycommentdemo.testcommentdemo.FloorView
    android:id="@+id/comment_floor"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:visibility="gone"
    />
<View
    android:id="@+id/lin_comment"
    android:layout_width="match_parent"
    android:layout_height="1dip"
    android:layout_marginBottom="4dip"
    android:layout_marginTop="4dip"
    android:background="@color/im_line_color" />
</LinearLayout>

(2)Activity文件

public class CommentItemView extends LinearLayout {
private List<FloorView> floorViewList;
private FloorView floorView;//回复控件
private TextView tvUsername;//用户名
private TextView tvReply;//回复
private TextView tvReplyTime;//回复时间
private TextView tvFavorCount;
private TextView tvCommentContent;//评论内容
private Comment mComment;
private List<Comment> mDatas;
private List<Comment> mReplyDatas;
private LayoutInflater layoutInflater ;

public CommentItemView(Context context) {
    this(context, null);
}
public CommentItemView(Context context, @Nullable AttributeSet attrs) {
    this(context, attrs, 0);
}

public CommentItemView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    this(context, attrs, defStyleAttr, 0);
}

public CommentItemView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
    super(context, attrs, defStyleAttr);
}

public List<Comment> getDatas(){
    return mDatas;
}
//设置数据
public void setDatas(List<Comment> mdatas){
    if(mdatas == null ){
        mdatas = new ArrayList<Comment>();
    }
    this.mDatas = mdatas;
    notifyDataSetChanged();//添加view
}

public void notifyDataSetChanged(){
    removeAllViews();
    if(mDatas == null || mDatas.size() == 0){
        return;
    }
    floorViewList = new ArrayList<FloorView>();
    LinearLayout.LayoutParams layoutParams = new                                                LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, 
    ViewGroup.LayoutParams.WRAP_CONTENT);

    for(int i=0; i<mDatas.size(); i++){
        final int index = i;
        View  view = getView(index);//构建评论view
        if(view == null){
            throw new NullPointerException("listview item layout is null, 
            please check getView()...");
        }        
        addView(view, index, layoutParams);   //添加评论view     
    }
}
//点击评论中的回复决定是否显示回复 根据position来确定
public void replyVisibile(int position){      
    FloorView floorView = floorViewList.get(position);
    if (floorView.getVisibility() == VISIBLE){
        floorView.setVisibility(GONE);
    }else{
        floorView.setVisibility(VISIBLE);
    }

}
//获取评论view
private View getView(final int position){
    if(layoutInflater == null){
        layoutInflater = LayoutInflater.from(getContext());
    }

    int paddingRightandleft =  getResources().getDimensionPixelOffset(
              R.dimen.activity_horizontal_margin_rightandleft);

    int paddingTop = getResources().getDimensionPixelOffset(
    R.dimen.activity_horizontal_margin_top);    

    setOrientation(VERTICAL);

    setPadding(paddingRightandleft, paddingTop, 
    paddingRightandleft,paddingTop);

    tvUsername = (TextView) 
    convertView.findViewById(R.id.tv_comment_username);

    tvReply = (TextView) 
    convertView.findViewById(R.id.tv_comment_reply);

    tvReplyTime = (TextView) 
    convertView.findViewById(R.id.tv_comment_reply_time);

    tvCommentContent = 
   (TextView)convertView.findViewById(R.id.tv_comment_content);

    floorViewList.add(floorView);
    final Comment comment = mDatas.get(position);
    tvUsername.setText(comment.getmUsername());
    tvReply.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View v) {
            replyVisibile(position);//显示回复
            Toast.makeText(getContext(), "comment"+position, Toast.LENGTH_SHORT).show();             
        }
    });
    tvReplyTime.setText(comment.getmReplyTime());
    tvCommentContent.setText(comment.getmCommentContent());
    //添加回复数据
    floorView.setComment(comment);
    return convertView;
}
}

回复的view和这个差不多,这里就不贴出来了。
需要注意的是评论回复之间是一对多的关系,即一条评论可以有多条回复,所以设置回复数据时需要找到当前的评论的position,根据position来设置回复相应的点击事件,其他的应该就没什么了,相信看注释应该都能看懂

源码下载地址:

Android评论demo

上一篇:Android Studio Generate Signed APK 错误汇总 下一篇:ViewPager+动态加载网络图片