Question

https://i.stack.imgur.com/j1sPI.png

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="20dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="#80000000"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

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

                <ImageView
                    android:id="@+id/user_profile_empty"
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/secondaryPhotoWidth"
                    android:scaleType="centerCrop"
                    android:visibility="gone" />

                <android.support.v4.view.ViewPager
                    android:id="@+id/photo_pager"
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/secondaryPhotoWidth" />

                <com.ogaclejapan.smarttablayout.SmartTabLayout xmlns:android="http://schemas.android.com/apk/res/android"
                    xmlns:app="http://schemas.android.com/apk/res-auto"
                    android:id="@+id/viewpagertab"
                    android:layout_width="wrap_content"
                    android:layout_height="@dimen/Profile.List.Item.Edit.Margin.Left"
                    android:layout_alignBottom="@+id/photo_pager"
                    android:layout_alignRight="@+id/photo_pager"
                    android:layout_gravity="bottom"
                    android:layout_marginBottom="@dimen/Profile.List.Item.Edit.Margin.Left"
                    android:layout_marginRight="@dimen/Profile.List.Item.Edit.Margin.Left"
                    android:layout_marginTop="@dimen/Profile.List.Item.Edit.Margin.Left"
                    app:stl_customTabTextLayoutId="@layout/custom_tab_circle"
                    app:stl_dividerColor="@color/transparent"
                    app:stl_dividerThickness="0dp"
                    app:stl_indicatorColor="@color/Sapio.RED"
                    app:stl_indicatorCornerRadius="@dimen/Profile.List.Item.Edit.Margin.Left"
                    app:stl_indicatorInterpolation="linear"
                    app:stl_indicatorThickness="@dimen/Profile.List.Item.Edit.Margin.Left"
                    app:stl_underlineColor="@color/transparent"
                    app:stl_underlineThickness="0dp" />

            </RelativeLayout>

                <!--<android.support.v7.widget.Toolbar-->
                    <!--android:id="@+id/MyToolbar"-->
                    <!--android:layout_width="match_parent"-->
                    <!--android:layout_height="80dp"-->
                    <!--app:layout_collapseMode="parallax"/>-->

                <RelativeLayout
                    android:id="@+id/likeIgnore_name_view"
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/secondaryPhotoWidth">

                <LinearLayout
                    android:id="@+id/like_ignor_view_upper"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_alignParentBottom="true"
                    android:layout_marginBottom="20dp"
                    android:layout_marginRight="15dp"
                    android:orientation="horizontal">

                    <ImageView
                        android:id="@+id/skip_button"
                        android:layout_width="45dp"
                        android:layout_height="45dp"
                        android:src="@drawable/close" />

                    <ImageView
                        android:id="@+id/superLikeImage"
                        android:layout_width="45dp"
                        android:layout_height="45dp"
                        android:layout_marginLeft="@dimen/Default.PaddingMargin.Small"
                        android:src="@drawable/super_like" />

                    <ImageView
                        android:id="@+id/like_button"
                        android:layout_width="45dp"
                        android:layout_height="45dp"
                        android:layout_marginLeft="@dimen/Default.PaddingMargin.Small"
                        android:src="@drawable/heart" />

                </LinearLayout>

                <LinearLayout
                    android:id="@+id/nameView"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentBottom="true"
                    android:layout_marginBottom="20dp"
                    android:layout_marginLeft="25dp"
                    android:orientation="horizontal">

                    <LinearLayout
                        android:id="@+id/nameView_margin"
                        android:layout_width="80dp"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal"
                        android:visibility="visible" />

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

                        <TextView
                            android:id="@+id/name"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_gravity="center"
                            android:paddingLeft="@dimen/abc_action_bar_subtitle_bottom_margin_material"
                            android:paddingRight="@dimen/abc_action_bar_subtitle_bottom_margin_material"
                            android:layout_weight="1"
                            android:gravity="center"
                            android:singleLine="true"
                            android:text="abc,31"
                            android:textColor="@color/Header.Text"
                            android:textSize="@dimen/Registration.Button.TextSize"
                            android:textStyle="bold" />

                        <TextView
                            android:id="@+id/distance"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_gravity="center"
                            android:paddingLeft="@dimen/abc_action_bar_subtitle_bottom_margin_material"
                            android:paddingRight="@dimen/abc_action_bar_subtitle_bottom_margin_material"
                            android:layout_weight="1"
                            android:gravity="center"
                            android:singleLine="true"
                            android:text="abc,31"
                            android:textColor="@color/Header.Text"
                            android:textSize="@dimen/Registration.Button.TextSize" />


                    </LinearLayout>


                </LinearLayout>

                <Button
                    android:id="@+id/refine_matches_view"
                    style="@style/TextAppearanceThin"
                    android:layout_width="wrap_content"
                    android:layout_height="30dp"
                    android:layout_alignParentLeft="true"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="15dp"
                    android:layout_marginTop="20dp"
                    android:background="@drawable/filter_shape"
                    android:gravity="center"
                    android:minHeight="0dp"
                    android:text="@string/filter"
                    android:textAllCaps="false"
                    android:textColor="@android:color/white"
                    android:textSize="@dimen/LoginScreen.Button.TextSize"
                    android:visibility="visible" />

                <ImageButton
                    android:id="@+id/more_button"
                    android:layout_width="wrap_content"
                    android:layout_height="30dp"
                    android:layout_alignParentRight="true"
                    android:layout_marginRight="15dp"
                    android:layout_marginTop="20dp"
                    android:background="@drawable/ic_more_vert_white_36dp"
                    android:gravity="center"
                    android:minHeight="0dp"
                    android:src="@drawable/filter_shape"
                    android:visibility="visible" />

            </RelativeLayout>

            <android.support.v7.widget.Toolbar
                android:id="@+id/MyToolbar"
                android:layout_width="match_parent"
                android:layout_height="80dp"
                app:layout_collapseMode="parallax"/>

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

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

    <ImageView
        android:id="@+id/user_photo"
        android:layout_width="80dp"
        android:layout_height="80dp"

        android:layout_marginLeft="15dp"
        android:gravity="center_vertical"
        android:scaleType="fitCenter"
        android:src="@drawable/match_bg"
        android:visibility="visible"
        app:elevation="10dp"
        app:layout_anchor="@id/nameView"
        app:layout_anchorGravity="bottom"/>


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

<include
    android:id="@+id/empty_profile_view"
    layout="@layout/section_empty_list"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

</RelativeLayout>

请帮我从布局中实现上述类型。正如我上面尝试过的那样，当滚动图像视图进入工具栏内部时，图像视图的一半不可见。

Answer 1

您可以点按此链接。
http://www.journaldev.com/13927/android-collapsingtoolbarlayout-example

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.journaldev.collapsingtoolbarlayout.ScrollingActivity">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/app_bar_height"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">

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


            <ImageView
                android:id="@+id/expandedImage"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:scaleType="centerCrop"
                android:src="@drawable/photo"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.7" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

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

    <include layout="@layout/content_scrolling" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/fab_margin"
        app:layout_anchor="@id/app_bar"
        app:layout_anchorGravity="bottom|end"
        app:srcCompat="@android:drawable/ic_dialog_info" />

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

希望你能帮助它。

Answer 2

实际上，appbar已经具有高度，这就是为什么它让所有视图都进入其中。

所以你需要给app：elevation =＆＃34; 0dp＆＃34;到appbar布局。它让所有其他观点自由地保持自我。

如何使用折叠工具栏实现此布局

2 个答案: