当前位置:阳光沙滩 >喜马拉雅 > 查看文章

喜马拉雅视频教程08-推荐完成了,我们去做一下详情界面

 

前面我们已经把推荐界面完成了,接下来的话,我们做详情页面吧。

喜马拉雅的内容结果是这样子的:

分类—->专辑列表—>单个专辑里的每一条节目内容

我们这里直接获取到的是推荐列表,并没有去获取分类,这个同学们可以去做一下哈。

我们获取到的是专辑列表,所以,接下来我们去获取单一专辑里的内容。

也就是获取到专辑里的详情。

当用户点击推荐里的item时,就会跳转到详情界面,获取到专辑里的内容。

//TODO:

详情请看视频吧。

喜马拉雅项目课程推荐界面跳转到详情界面-阳光沙滩出品

喜马拉雅项目详情界面加载图片和标题-阳光沙滩出品

毛玻璃效果地址

item的布局文件:

<?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="wrap_content"
    android:background="@drawable/selector_album_item_bg"
    android:gravity="center_vertical">

    <TextView
        android:id="@+id/item_id_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:padding="15dp"
        android:text="77"
        android:textSize="20sp"/>

    <LinearLayout
        android:id="@+id/title_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginTop="20dp"
        android:layout_toRightOf="@id/item_id_text"
        android:orientation="vertical">

        <TextView
            android:id="@+id/trick_title_text"
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:maxLines="2"
            android:text="彩蛋,这是我最好的和篇文章呢"
            android:textColor="@color/color_black"
            android:textSize="16sp"/>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:gravity="center_vertical"
            android:orientation="horizontal">

            <ImageView
                android:layout_width="10dp"
                android:layout_height="10dp"
                android:src="@mipmap/play_count_icon"/>

            <TextView
                android:id="@+id/track_play_count_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:text="245.3万"
                android:textSize="12sp"/>
        </LinearLayout>

    </LinearLayout>

    <TextView
        android:id="@+id/update_time_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="10dp"
        android:layout_toRightOf="@id/title_container"
        android:gravity="center"
        android:text="2018-09"/>

</RelativeLayout>

设置状态栏透明,全屏状态

 getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
        getWindow().setStatusBarColor(Color.TRANSPARENT);

素材标注地址

地址:lanhuapp.com
账号:lanhu@sunofbeaches.com
密码:lanhu123
同学们可以使用这个账号来获取到标注内容,我会持续更新UI的图。

欢迎打赏呀!

 

WeChat Image_20190525193414

为您推荐
各种观点