前端时间刚好需要做一个类似于QQ空间的社区分享功能,说说内容包含文字(话题,内容),视频,图片,还需包含点赞,评论,位置信息等功能。就采用LIstview做了一个,先来看下效果,GIF格式太大,CSDN传不了,请移步Gitee连接:GIF效果
1。先来分析一下ListView中每一个条目包含的控件,请看下图
序号1:头,像ImageView,自定义为圆形即可。
序号2:用户名TextView;
序号3:发布时间,TextView;
序号4:说说文字部分,TextView;
序号5:说说中视频或图片部分,Videoview;
序号6:点赞信息,TextView,动态添加;
序号7:位置信息,TextView;
序号8/9/10:点赞,评论,转发,均为ImageView;
序号11:评论区、TextView动态添加;
序号12:评论框,EditText,其右侧图片是通过drawableRight设置的,事件监听会在后面详细说;
上面图中漏了一个,在视频正中央还需要有一个播放按钮,为ImageView,通过切换ImageView中图片实现播放与暂停切换。
2。确定好有哪些控件后,我们用xml实现布的局,文件命名为video_brower_item.xml,代码如下:
& lt; & # 63; xml version=" 1.0 " encoding=" utf - 8 " & # 63;比;
& lt; FrameLayout xmlns: android=" http://schemas.android.com/apk/res/android "
android: layout_width=" match_parent "
android: layout_height=" match_parent "
xmlns:应用=" http://schemas.android.com/apk/res-auto "比;
LinearLayout & lt;
android: id=癅 + id/mContainer”
android: layout_width=" match_parent "
android: layout_height=" match_parent "
android:取向=按怪薄?
android: paddingLeft=" 10 dp”
android: paddingRight=" 10 dp”
android: paddingTop=" 10 dp”
android:背景=癅android:颜色/白”比;
LinearLayout & lt;
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
面向android:="水平"比;
& lt; com.xiaok.winterolympic.custom.CircleImageView
android: id=癅 + id/video_avatar”
android: layout_width=" 45 dp "
android: layout_height=" 45 dp "
android: src=" https://www.yisu.com/zixun/@drawable head_picture "/比;
& lt; TextView
android: id=癅 + id/video_username”
android: layout_width=" wrap_content "
android: layout_height=" wrap_content "
android:文本=" xiaok "
android:输入textColor=" # 000000 "
android: layout_marginStart=" 15 dp "
android: textSize=" 24 sp "
android: textStyle=按蟮ā?比;
& lt; TextView
android: id=癅 + id/video_date”
android: layout_width=" wrap_content "
android: layout_height=" wrap_content "
android: layout_marginStart=" 20 dp”
android: textSize=" 14 sp "
android:文本="刚刚”/比;
& lt;/LinearLayout>
& lt; TextView
android: id=癅 + id/video_descripation”
android: layout_width=" wrap_content "
android: layout_height=" wrap_content "
android: layout_marginTop=" 15 dp "
android: textSize=" 16 sp "
android:输入textColor=" # 000000 "
android:文本=" #共迎冬冬号奥奥”/比;
& lt; VideoView
android: id=癅 + id/video_view”
android: layout_width=" match_parent "
android: layout_height=" 230 dp”
android: layout_marginTop=?5 dp/比;
& lt;使用
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
面向android:="水平"比;
& lt; TextView
android: id=癅 + id/video_position”
android: layout_width=" wrap_content "
android: layout_height=" wrap_content "
android:文本="北京市朝阳区”
android: layout_marginTop=" 12 dp "
android: layout_alignParentStart=" true "
android: layout_marginBottom=" 10 dp/比;
& lt; ImageView
android: id=癅 + id/video_iv_good”
android: src=" https://www.yisu.com/zixun/@mipmap video_share_good "
android: layout_toStartOf=癅 + id/video_iv_comment”
android: layout_marginEnd=" 20 dp/比;
& lt; ImageView
android: id=癅 + id/video_iv_comment”
android: src=" https://www.yisu.com/zixun/@mipmap video_share_comment "
android: layout_toStartOf=癅 + id/video_iv_share”
android: layout_marginEnd=" 20 dp/比;
& lt; ImageView
android: id=癅 + id/video_iv_share”
android: src=" https://www.yisu.com/zixun/@mipmap video_share_share "
android: layout_alignParentEnd=" true "
android: layout_marginEnd=" 10 dp/比;
& lt;/RelativeLayout>
EditText & lt;
android: id=癅 + id/video_et_comment”
android: layout_width=" match_parent "
android: layout_height=" 40 dp "
android:提示="评论”
android: textSize=" 14 sp "
android: layout_marginBottom=" 20 dp”
android: drawableRight=癅drawable/video_send_picture”/比;
& lt;/LinearLayout>
& lt; ImageView
android: id=癅 + id/video_play”
android: layout_width=" wrap_content "
android: layout_height=" wrap_content "
android: src=" https://www.yisu.com/zixun/@mipmap ic_record_play "
android: layout_gravity=" center_horizontal "
android: layout_marginTop=" 192 dp/比;
& lt;/FrameLayout>
