10. 视频模块（一）之视频列表

上一节对欢迎模块进行了综述(可参见 8. 视频模块 进行了解)，接下来将从视频模块开始详细介绍：

• 视频模块（一）之统计
• [视频模块（二）之统计详情]

知识点

• 掌握“视频列表”界面的开发
• 实现下拉刷新功能

主要功能：

• 展示各学科经典视频，点击条目中的视频会进入对应的“视频”详情界面；
• 在该节目可以播放视频、展示视频简介与视频目录；
• 调整播放画面的尺寸和视频清晰度等。

视频列表

任务综述：
“视频列表”界面主要展示各学科的视频信息，该列表的数据从Tomcat服务器上获取，然后经过JSON解析把数据显示到“视频列表”界面上。

1. “视频列表”界面

任务分析：
“视频列表”界面主要用于展示各学科的视频信息，“视频列表”界面的效果如图所示。

“视频列表”界面

任务实施：
（1）创建“视频列表”界面：fragment_video.xml。

（2）放置界面控件。在布局文件中，放置一个PullToRefreshView控件用于显示下拉刷新，一个WrapRecyclerView控件用于加载视频列表信息。

fragment_video.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <com.itheima.PullToRefreshView
        android:id="@+id/pull_to_refresh"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#f6f6f6">
        <com.itheima.topline.view.WrapRecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:divider="@null"
            android:dividerHeight="0dp"
            android:fadingEdge="none" />
    </com.itheima.PullToRefreshView>
</LinearLayout>

2. “视频列表”界面Item

任务分析：
由于“视频列表”界面用到了WrapRecyclerView控件，因此需要为该控件创建一个Item界面，界面效果如图所示。

“视频列表”界面Item

任务实施
（1）创建“视频列表”界面Item：video_list_item.xml。

（2）导入界面图片（1个,media_play_icon.png）。

（3）放置界面控件。
2个ImageView控件分别用于显示视频图片和视频播放图标。