如何将徽标保留在折叠工具栏上方

时间:2017-12-29 20:02:20

标签: android kotlin

我在kotlin编程,我在折叠工具栏时遇到问题,我的主要观点如下

Main View

滚动我的徽标时会出现在折叠工具栏后面,如下图所示

When Scrolling

<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="false">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginLeft="12dp"
        android:layout_marginRight="12dp"
        android:layout_marginBottom="56dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="120dp">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            style="@style/Widget.QueComer.CollapsingToolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

            <LinearLayout
                style="@style/Widget.QueComer.CollapsingToolbarContent"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.65">
            </LinearLayout>


            <!-- Wrap this view: -->
            <android.support.v7.widget.Toolbar
                android:id="@+id/app_bar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin" />

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

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

    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/header_logo"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_gravity="center"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:contentDescription="@string/app_name"
            android:cropToPadding="false"
            android:scaleType="fitCenter"
            android:src="@mipmap/ic_logo"
            app:layout_collapseMode="parallax"
            app:layout_collapseParallaxMultiplier="0.3"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@mipmap/ic_logo" />
    </android.support.constraint.ConstraintLayout>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="#ffffff"
        android:theme="@style/ThemeOverlay.QueComer.BottomNavigation"
        app:menu="@menu/menu_quecomer">

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

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

我需要将徽标放在栏前面,如下图所示

result Image

使用photoshop编辑结果图像

1 个答案:

答案 0 :(得分:0)

尝试将ImageView放在您的CollapsingToolbarLayout中,如下所示:

<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="false">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginLeft="12dp"
        android:layout_marginRight="12dp"
        android:layout_marginBottom="56dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="120dp">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            style="@style/Widget.QueComer.CollapsingToolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

            <LinearLayout
                style="@style/Widget.QueComer.CollapsingToolbarContent"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.65">

            <ImageView
            android:id="@+id/header_logo"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_gravity="center"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:contentDescription="@string/app_name"
            android:cropToPadding="false"
            android:scaleType="fitCenter"
            android:src="@mipmap/ic_logo"
            app:layout_collapseMode="parallax"
            app:layout_collapseParallaxMultiplier="0.3"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@mipmap/ic_logo" />

            </LinearLayout>

            <!-- Wrap this view: -->
            <android.support.v7.widget.Toolbar
                android:id="@+id/app_bar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin" />

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

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

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="#ffffff"
        android:theme="@style/ThemeOverlay.QueComer.BottomNavigation"
        app:menu="@menu/menu_quecomer">

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

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