(三) 小说相关UI界面

一.
效果图：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="260dp"
    android:layout_height="185dp"
    android:background="@drawable/bg_search"
    android:gravity="center_horizontal"
    android:orientation="vertical"
    android:paddingBottom="16.5dp"
    android:paddingLeft="10.5dp"
    android:paddingRight="10.5dp"
    android:paddingTop="3.5dp"
    android:clickable="true">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical"
        android:paddingBottom="10dp"
        android:paddingTop="15dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:text="离线章节"
            android:textColor="@color/tv_btn_black"
            android:textSize="16sp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="1" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_marginRight="5dp"
                android:text="第"
                android:textColor="@color/tv_btn_black"
                android:textSize="16sp" />

            <EditText
                android:id="@+id/edt_start"
                android:layout_width="50dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:background="@drawable/bg_edit"
                android:lines="1"
                android:maxLength="4"
                android:textCursorDrawable="@drawable/shape_text_cursor"
                android:paddingBottom="4dp"
                android:paddingLeft="5dp"
                android:paddingRight="5dp"
                android:paddingTop="4dp"
                android:numeric="integer"
                android:inputType="number"
                android:textSize="14sp"
                android:textColor="@color/tv_btn_black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:text="章 至 第"
                android:textColor="@color/tv_btn_black"
                android:textSize="16sp" />

            <EditText
                android:id="@+id/edt_end"
                android:layout_width="50dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:background="@drawable/bg_edit"
                android:lines="1"
                android:textCursorDrawable="@drawable/shape_text_cursor"
                android:maxLength="4"
                android:paddingBottom="4dp"
                android:paddingLeft="5dp"
                android:paddingRight="5dp"
                android:paddingTop="4dp"
                android:numeric="integer"
                android:inputType="number"
                android:textSize="14sp"
                android:textColor="@color/tv_btn_black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_marginLeft="5dp"
                android:text="章"
                android:textColor="@color/tv_btn_black"
                android:textSize="16sp" />

            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="1" />
        </LinearLayout>
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:background="#c1c1c1" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/tv_cancel"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@drawable/selector_book_detail_shelf_bg"
            android:clickable="true"
            android:gravity="center"
            android:text="取消"
            android:textColor="#767676"
            android:textSize="15sp" />

        <TextView
            android:id="@+id/tv_download"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@drawable/selector_book_detail_read_bg"
            android:clickable="true"
            android:gravity="center"
            android:text="下载"
            android:textColor="#ffffff"
            android:textSize="15sp" />
    </LinearLayout>
</LinearLayout>

二.
效果图：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#ffffff">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_ib_pre2"
        android:clickable="true"
        android:paddingLeft="10dp"
        android:id="@+id/fl_content">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:layout_marginBottom="10dp"
            android:layout_marginTop="10dp"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/iv_cover"
                android:layout_width="60dp"
                android:layout_height="match_parent"
                android:scaleType="fitCenter"
                android:src="@drawable/doupo"
                android:transitionName="img_cover" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/tv_name"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:layout_marginRight="10dp"
                    android:ellipsize="end"
                    android:lines="1"
                    android:text="斗破苍穹"
                    android:textColor="#767676"
                    android:textSize="16sp"
                    android:layout_marginBottom="3dp"/>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="horizontal">

                    <LinearLayout
                        android:layout_width="0dp"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="10dp"
                        android:layout_weight="1"
                        android:orientation="vertical">
                        <View
                            android:layout_width="0dp"
                            android:layout_height="0dp"
                            android:layout_weight="1"/>
                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal"
                            android:layout_marginBottom="3dp">

                            <TextView
                                android:id="@+id/tv_author"
                                android:layout_width="wrap_content"
                                android:maxWidth="90dp"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center_vertical"
                                android:lines="1"
                                android:ellipsize="end"
                                android:text="柳下惠"
                                android:textColor="#aaaaaa"
                                android:textSize="12sp" />
                            <TextView
                                android:id="@+id/tv_origin"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center_vertical"
                                android:layout_marginLeft="5dp"
                                android:lines="1"
                                android:ellipsize="end"
                                android:textColor="#aaaaaa"
                                android:textSize="10sp" />
                        </LinearLayout>
                        <View
                            android:layout_width="0dp"
                            android:layout_height="0dp"
                            android:layout_weight="1"/>
                        <LinearLayout
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal">
                            <TextView
                                android:id="@+id/tv_state"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center_vertical"
                                android:background="@drawable/shape_search_history_roundrect"
                                android:paddingBottom="0.4dp"
                                android:layout_marginRight="5dp"
                                android:paddingLeft="2dp"
                                android:paddingRight="2dp"
                                android:paddingTop="0.4dp"
                                android:text="连载"
                                android:textColor="#ffffff"
                                android:textSize="12sp" />
                            <TextView
                                android:id="@+id/tv_kind"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center_vertical"
                                android:layout_marginRight="5dp"
                                android:background="@drawable/shape_search_history_roundrect"
                                android:lines="1"
                                android:paddingBottom="0.4dp"
                                android:paddingLeft="2dp"
                                android:paddingRight="2dp"
                                android:paddingTop="0.4dp"
                                android:text="现代都市"
                                android:textColor="#ffffff"
                                android:textSize="12sp" />
                            <TextView
                                android:id="@+id/tv_words"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center_vertical"
                                android:background="@drawable/shape_search_history_roundrect"
                                android:lines="1"
                                android:paddingBottom="0.4dp"
                                android:paddingLeft="2dp"
                                android:paddingRight="2dp"
                                android:paddingTop="0.4dp"
                                android:text="1.2万字"
                                android:textColor="#ffffff"
                                android:textSize="12sp" />
                        </LinearLayout>
                        <View
                            android:layout_width="0dp"
                            android:layout_height="0dp"
                            android:layout_weight="1"/>
                        <TextView
                            android:id="@+id/tv_lastest"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:lines="1"
                            android:text="最新章节:121章 成神"
                            android:textColor="#767676"
                            android:textSize="14sp" />
                    </LinearLayout>
                    <TextView
                        android:id="@+id/tv_addshelf"
                        android:layout_width="60dp"
                        android:layout_height="30dp"
                        android:layout_gravity="top"
                        android:layout_marginLeft="10dp"
                        android:layout_marginRight="10dp"
                        android:background="@drawable/selector_tv_addshelf"
                        android:gravity="center"
                        android:lines="1"
                        android:text="+书架"
                        android:textColor="@drawable/selector_tv_addshelf_text"
                        android:textSize="14sp" />
                </LinearLayout>
            </LinearLayout>
        </LinearLayout>
        <View
            android:layout_width="match_parent"
            android:layout_height="0.5dp"
            android:layout_gravity="bottom"
            android:background="#c1c1c1" />
    </FrameLayout>

</FrameLayout>

三.
效果图：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <LinearLayout
        android:layout_width="260dp"
        android:layout_height="180dp"
        android:orientation="vertical"
        android:paddingTop="3.5dp"
        android:paddingLeft="10.5dp"
        android:paddingRight="10.5dp"
        android:paddingBottom="16.5dp"
        android:background="@drawable/bg_search"
        android:gravity="center_horizontal">
        <TextView
            android:id="@+id/tv_book_name"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:maxLines="2"
            android:gravity="center"
            android:textSize="16sp"
            android:text="是否将《斗破苍穹》放入书架？"
            android:padding="10dp"
            android:textColor="#343434"/>
        <View
            android:layout_width="match_parent"
            android:layout_height="0.5dp"
            android:background="#c1c1c1"/>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:orientation="horizontal">
            <TextView
                android:id="@+id/tv_exit"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:textColor="#767676"
                android:text="退出阅读"
                android:gravity="center"
                android:textSize="15sp"
                android:clickable="true"
                android:background="@drawable/selector_book_detail_shelf_bg"/>
            <TextView
                android:id="@+id/tv_addshelf"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="放入书架"
                android:gravity="center"
                android:textColor="#ffffff"
                android:clickable="true"
                android:textSize="15sp"
                android:background="@drawable/selector_book_detail_read_bg"/>
        </LinearLayout>
    </LinearLayout>
</FrameLayout>

四.
效果图：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:paddingBottom="16.5dp"
        android:paddingTop="3.5dp"
        android:paddingLeft="9.5dp"
        android:paddingRight="10.5dp"
        android:background="@drawable/bg_search">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            android:layout_gravity="center_vertical"
            android:paddingRight="10dp">
            <LinearLayout
                android:id="@+id/ll_download"
                android:layout_width="0dp"
                android:layout_weight="999"
                android:layout_height="match_parent"
                android:orientation="horizontal"
                android:layout_gravity="center_vertical">
                <ImageView
                    android:id="@+id/iv_cover"
                    android:layout_width="45dp"
                    android:layout_gravity="center"
                    android:layout_height="match_parent"
                    android:src="@drawable/doupo"/>
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical"
                    android:paddingLeft="10dp"
                    android:paddingRight="10dp">
                    <View
                        android:layout_width="0dp"
                        android:layout_height="7dp"/>
                    <TextView
                        android:id="@+id/tv_name"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textColor="@color/tv_btn_black"
                        android:textSize="13sp"
                        android:text="《斗破苍穹》"
                        android:singleLine="true"
                        android:ellipsize="end"/>
                    <View
                        android:layout_width="0dp"
                        android:layout_height="0dp"
                        android:layout_weight="2"/>
                    <TextView
                        android:id="@+id/tv_chapter_name"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textColor="@color/tv_btn_normal_black"
                        android:textSize="11sp"
                        android:text="十分燃，想看热血小说请进"
                        android:ellipsize="end"
                        android:maxLines="2"/>
                    <View
                        android:layout_width="0dp"
                        android:layout_height="0dp"
                        android:layout_weight="3"/>
                </LinearLayout>
            </LinearLayout>
            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="1"/>
            <TextView
                android:id="@+id/tv_download"
                android:layout_width="70dp"
                android:layout_height="30dp"
                android:text="开始下载"
                android:layout_gravity="center_vertical"
                android:gravity="center"
                android:textColor="#ffffff"
                android:clickable="true"
                android:textSize="12sp"
                android:background="@drawable/selector_bg_download"/>
            <View
                android:layout_width="5dp"
                android:layout_height="0dp"/>
            <TextView
                android:id="@+id/tv_cancel"
                android:layout_width="70dp"
                android:layout_height="30dp"
                android:textColor="#767676"
                android:text="取消下载"
                android:layout_gravity="center_vertical"
                android:gravity="center"
                android:textSize="12sp"
                android:clickable="true"
                android:background="@drawable/selector_bg_download_cancel"/>

            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="1"/>
        </LinearLayout>
        <TextView
            android:id="@+id/tv_none"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:clickable="true"
            android:text="暂无任务"
            android:gravity="center"
            android:textColor="@color/tv_btn_black"
            android:textSize="14sp"
            android:visibility="gone"
            android:background="#ffffff"/>
        <View
            android:layout_width="match_parent"
            android:layout_height="0.7dp"
            android:background="#c1c1c1"
            android:layout_gravity="bottom"/>
    </FrameLayout>
</FrameLayout>

五.
效果图：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical">
    <View
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:background="@drawable/bg_shadow2" />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:background="#ffffff"
        android:paddingTop="15dp"
        android:paddingBottom="15dp">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="35dp"
            android:orientation="horizontal"
            android:layout_gravity="center">
            <TextView
                android:layout_width="80dp"
                android:layout_height="match_parent"
                android:textSize="14sp"
                android:textColor="#adadad"
                android:gravity="center"
                android:text="字号"
                android:layout_gravity="center_vertical"/>
            <FrameLayout
                android:id="@+id/fl_smaller"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@drawable/selector_pop_font_bg">
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="-"
                    android:layout_gravity="center"
                    android:textColor="#767676"
                    android:textSize="22sp"/>
            </FrameLayout>
            <TextView
                android:id="@+id/tv_dur_textsize"
                android:layout_width="50dp"
                android:layout_height="match_parent"
                android:textSize="14sp"
                android:textColor="#767676"
                android:text="18"
                android:gravity="center"
                android:singleLine="true"
                android:layout_gravity="center" />
            <FrameLayout
                android:id="@+id/fl_bigger"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@drawable/selector_pop_font_bg">
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="+"
                    android:layout_gravity="center"
                    android:textColor="#767676"
                    android:textSize="22sp"/>
            </FrameLayout>
            <TextView
                android:id="@+id/tv_textsize_default"
                android:layout_width="70dp"
                android:layout_height="match_parent"
                android:textSize="14sp"
                android:textColor="@drawable/selector_pop_font_color"
                android:gravity="center"
                android:text="默认"
                android:layout_gravity="center_vertical"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="45dp"
            android:orientation="horizontal"
            android:layout_gravity="center"
            android:layout_marginTop="15dp">
            <TextView
                android:layout_width="80dp"
                android:layout_height="match_parent"
                android:textSize="14sp"
                android:textColor="#adadad"
                android:gravity="center"
                android:text="背景"
                android:layout_gravity="center_vertical"
                android:paddingLeft="20dp"
                android:paddingRight="20dp"/>

            <de.hdodenhof.circleimageview.CircleImageView
                android:id="@+id/civ_bg_white"
                android:layout_width="45dp"
                android:layout_height="45dp"
                android:src="@drawable/icon_readbook_white"
                app:civ_border_width="1dp"
                app:civ_border_color="#00000000"/>

            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="1"/>
            <de.hdodenhof.circleimageview.CircleImageView
                android:id="@+id/civ_bg_yellow"
                android:layout_width="45dp"
                android:layout_height="45dp"
                android:src="@drawable/icon_readbook_yellow"
                app:civ_border_width="1dp"
                app:civ_border_color="#F3B63F"/>
            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="1"/>
            <de.hdodenhof.circleimageview.CircleImageView
                android:id="@+id/civ_bg_green"
                android:layout_width="45dp"
                android:layout_height="45dp"
                android:src="@drawable/icon_readbook_green"
                app:civ_border_width="1dp"
                app:civ_border_color="#00000000"/>
            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="1"/>
            <de.hdodenhof.circleimageview.CircleImageView
                android:id="@+id/civ_bg_black"
                android:layout_width="45dp"
                android:layout_height="45dp"
                android:src="@drawable/icon_readbook_black"
                app:civ_border_width="1dp"
                app:civ_border_color="#00000000"/>
            <View
                android:layout_width="50dp"
                android:layout_height="0dp"/>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

“@drawable/selector_pop_font_bg”：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/shape_pop_font_bg_nor" android:state_pressed="false" android:state_enabled="true"/>
    <item android:drawable="@drawable/shape_pop_font_bg_pre" android:state_pressed="true" android:state_enabled="true"/>
    <item android:drawable="@drawable/shape_pop_font_bg_pre" android:state_enabled="false"/>
</selector>