类似微信5.x朋友圈的弹出框评论功能
时间:2014-09-23 17:50:15
收藏:0
阅读:393
实现对一个主题评论并显示评论列表,首先想到的是需要使用ListView控件,
下面是layout下的xml布局文件:
<?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" android:background="@drawable/list_selector" android:orientation="horizontal" android:padding="5dip" > <LinearLayout android:id="@+id/thumbnail" android:layout_width="120dip" android:layout_height="120dip" android:layout_alignParentLeft="true" android:layout_marginRight="5dip" android:background="@drawable/image_bg" android:padding="1dip" > <ImageView android:id="@+id/group_image" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="centerInside" android:src="@drawable/copyright" /> </LinearLayout> <TextView android:id="@+id/group_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignTop="@+id/thumbnail" android:layout_toRightOf="@+id/thumbnail" android:text="测试朋友圈评论功能" android:textColor="#040404" android:textSize="15sp" android:textStyle="bold" android:typeface="sans" /> <TextView android:id="@+id/group_content" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@+id/thumbnail" android:text="狗狗见到蟒,冲过去照头上就舔" android:textAppearance="?android:attr/textAppearanceLarge" android:textColor="#343434" android:textSize="12sp" /> <ImageView android:id="@+id/group_discuss_popup" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignRight="@+id/group_content" android:layout_below="@+id/group_content" android:background="@drawable/coment_pressed" /> <TextView android:id="@+id/group_createtime" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBottom="@+id/TextView09" android:layout_toLeftOf="@+id/group_discuss_popup" android:gravity="right" android:text="2014-08-24 15:45" android:textColor="#10bcc9" android:textSize="12sp" android:textStyle="bold" /> <RelativeLayout android:id="@+id/rl_bottom" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" > <Button android:id="@+id/group_discuss_submit" android:layout_width="60dp" android:layout_height="40dp" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="10dp" android:background="@drawable/chat_send_button_bg" android:onClick="discussSubmit" android:text="发送" android:textSize="20sp" /> <EditText android:id="@+id/group_discuss" android:layout_width="fill_parent" android:layout_height="40dp" android:layout_centerVertical="true" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:layout_toLeftOf="@id/group_discuss_submit" android:hint="评论" android:singleLine="true" android:textSize="18sp" > <requestFocus /> </EditText> </RelativeLayout> <ListView android:id="@+id/group_discuss_list" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_below="@+id/group_discuss_popup" android:layout_marginTop="14dp" android:divider="#b5b5b5" android:dividerHeight="1dp" android:listSelector="@drawable/list_selector" /> <TextView android:id="@+id/TextView09" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBottom="@+id/thumbnail" android:layout_marginBottom="40dp" android:layout_toRightOf="@+id/thumbnail" android:text="时间:" android:textColor="#040404" android:textSize="12sp" android:textStyle="bold" android:typeface="sans" /> </RelativeLayout>
然后在Activity类的onCreate方法里,获取ListView的实例,并对每一个item增加监听器
//为防止layout界面上的EditText在进入页面时就弹出输入法,隐藏软键盘 getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN); listView = (ListView)findViewById(R.id.group_discuss_list); this.discussOnItemClickListener();
每一个item增加监听器的方法discussOnItemClickListener()
/**
* 评论列表被单击后的事件监听
*/
private void discussOnItemClickListener() {
//为评论的每一行添加单击事件
listView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,int position, long id) {
//获得父贴的发帖人
Map<String, String> posMap = discussList.get(position);
//设置pusername
pname = posMap.get("username");
//取得填写评论editText的实例
EditText disInputText = (EditText)findViewById(R.id.group_discuss);
disInputText.setHint("回复" + pname);
disInputText.requestFocus();
}
});
}
接下来重点说说单击评论图标之后的弹出框,同样在Activity类的onCreate方法中,给评论图标增加onclick监听器,然后增加两个弹出项赞,评论,并且给这两个item增加监听,代码如下:
groupPopup = (ImageView) findViewById(R.id.group_discuss_popup); groupPopup.setOnClickListener(titlePopupOnclick); titlePopup = new TitlePopup(this, Utils.dip2px(this, 165), Utils.dip2px(this, 40)); titlePopup.addAction(new ActionItem(this, "赞", R.drawable.circle_praise)); titlePopup.addAction(new ActionItem(this, "评论",R.drawable.circle_comment)); titlePopup.setItemOnClickListener(this);
监听的方法实现
/**
* 单击评论按钮,弹出菜单的item click 监听
*/
@Override
public void onItemClick(ActionItem actionItem,int position) {
//position,0-赞;1-评论
switch(position){
case 0://赞
break;
case 1://评论
EditText disInputText = (EditText)findViewById(R.id.group_discuss);
disInputText.requestFocus();
break;
default:
break;
}
}
很简单,就是当单击item里的评论时,请求EditText输入框的焦点,调出输入法.
最后我们来说说添加评论功能,demo只是模拟添加了一些评论,真实环境下显然首先需要向服务端提交数据,然后从服务端请求评论列表.demo中只是在Activity类里维护一个全局List简单代替.然后使用一个BaseAdapter的实现类,实现其getView方法来显示出来.
Map<String, String> map = new HashMap<String, String>();
//给map设置要显示的值
map.put("distime", DateUtils.formaterDate2YMDHm(new Date(System.currentTimeMillis())));
map.put("content", content);
//设置父贴的发帖人信息
map.put("puid", puid + "");
map.put("pname", pname);
//设置自己的信息
map.put("uid", uid + "");
map.put("username", username);
discussList.add(map);
ListLazyAdapter adapter = new ListLazyAdapter(this, discussList);
listView.setAdapter(adapter); //设置adapter
基本上就以上三部分主要功能,可以实现一个简单的单击显示弹出框之后的评论功能.
效果图如下:


本文示例源代码下载地址:
http://download.csdn.net/detail/gaolu/7963061
评论(0)