如何像在whatsapp中一样在CollapsingToolbarLayout中实现字幕 [英] How to implement a subtitle in CollapsingToolbarLayout like in the whatsapp

问题描述

我要实现的内容显示在图片上，详细信息页面副标题显示为由+91创建"

what i wanted to implement is shown on the picture ,the details page subtitle shown as" created by +91 "

目前，我只能实现title. 这是我用于创建标题的代码，我也需要创建一个子标题??

currently i am able to implement title only . this is my code used for creating the title i need to create a sub title too any idea ??

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:emojicon="http://schemas.android.com/tools"
android:id="@+id/root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusableInTouchMode="true">

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/linearLayout"
    android:fitsSystemWindows="true">


    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:layout_collapseMode="parallax" >

                <ImageView
                    android:id="@+id/event_image"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:fitsSystemWindows="true"
                    android:scaleType="centerCrop"
                    android:src="@drawable/ic_launcher"
                    android:transitionName="event_image"
                  />

                <FrameLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_alignParentBottom="true"
                    android:layout_alignParentEnd="true"
                    android:layout_alignParentRight="true"
                    android:layout_alignTop="@+id/img_event"
                    android:background="@drawable/gradient_black" >

                </FrameLayout>

            </RelativeLayout>

            <include
                android:id="@+id/tool_bar"
                layout="@layout/tool_bar" />

        </android.support.design.widget.CollapsingToolbarLayout>

推荐答案

您必须使用框架布局.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">

  <ImageView  
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 

    android:scaleType="center"
    android:src="@drawable/golden_gate" />

  <TextView
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginBottom="20dip"
    android:layout_gravity="center_horizontal|bottom"

    android:padding="12dip"

    android:background="#AA000000"
    android:textColor="#ffffffff"

    android:text="Golden Gate" />

</FrameLayout>

完整实现:​​
如何显示一个在我的情况下以编程方式在另一个布局之上?

Full implementation:
How to show one layout on top of the other programmatically in my case?

这篇关于如何像在whatsapp中一样在CollapsingToolbarLayout中实现字幕的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！