在TabBar布局上折叠工具栏文本

时间：2017-07-18 07:37:44

标签： android layout tabbar android-collapsingtoolbarlayout android-appbarlayout

我在Android中面临一些UI设计问题，我一直在寻找Stackoverflow其他来源，试图找到所缺少的内容，但直到现在我还在没有运气。

如果我用屏幕截图解释这个问题，我认为它会变得简单而且更好。我面临的问题是我在折叠工具栏上有一个文本布局（在AppBarLayout内部），当你收缩AppBarLayout时，有一个短暂的时刻，文本在我的TabLayout后面，导致TabBar的标题在前面折叠工具栏的标题：S。

这是我的结构：

enter image description here

这是打开活动时的外观（此时它非常完美）

enter image description here

但问题是，当您开始向上滚动并且折叠工具栏开始缩小时，折叠工具栏上的文本就在TabBar布局标题的正后方

enter image description here

正如我之前所说，这只发生在这一点上，因为如果你继续缩小，它会开始正常行动（将所有内容改为工具栏的颜色）

enter image description here

最后，它再次以正确的行为进入最终位置

enter image description here

我想我错过了一些东西，也许这是一件小事，但我无法弄清楚它是什么。

这是布局中的代码：

<?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:id="@+id/ntx_coordinator"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

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

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"

            app:collapsedTitleGravity="left"
            app:collapsedTitleTextAppearance="@style/CollapsingTextAppearance.Expanded"
            app:contentScrim="@color/netex_color_pink"
            app:expandedTitleGravity="center|top"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:expandedTitleMarginTop="16dip"
            app:expandedTitleTextAppearance="@style/CollapsingTextAppearance.Collapsed"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">


            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/netex_color_gray_bg"
                app:layout_collapseMode="parallax"
                tools:background="@color/yellow">

                <com.facebook.drawee.view.SimpleDraweeView
                    android:id="@+id/ntx_background"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentStart="true"
                    app:actualImageScaleType="centerCrop"
                    app:backgroundImage="@drawable/vector_container_plan_header"
                    app:layout_collapseMode="parallax"
                    app:placeholderImage="@drawable/vector_container_plan_header"
                    app:placeholderImageScaleType="centerCrop" />

                <com.facebook.drawee.view.SimpleDraweeView
                    android:id="@+id/ntx_profile_avatar"
                    android:layout_width="@dimen/netex_drawer_avatar_size_profile"
                    android:layout_height="@dimen/netex_drawer_avatar_size_profile"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true"
                    android:layout_gravity="center_horizontal"
                    android:layout_marginBottom="0dp"
                    android:layout_marginTop="80dip"
                    app:placeholderImage="@drawable/ic_user_64"
                    app:placeholderImageScaleType="centerCrop"
                    app:roundingBorderColor="@color/netex_color_gray_bg"
                    app:roundingBorderWidth="2dp"
                    tools:background="@color/green"
                    tools:placeholder="@drawable/plan_placeholder" />

                <TextView
                    android:id="@+id/txt_title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/ntx_profile_avatar"
                    android:paddingBottom="@dimen/netex_padding_medium"
                    android:paddingTop="@dimen/netex_padding_medium"
                    tools:text="iogjwerogi jioerwjgoiwerj oerwjgoiewrjgoijio jreog jojwer oj oijgj owerjgo iwjeroigj wroij owejoig wjeroigjeoi jioerj goi jeoigjwreoi rewogjtioryure igjiorthj iujeriheritohirthn irthsnbjrthkjg tmkhntjb l kxcjhjoigsdrjoi hjdriugjiothjoiuhjoidtjohjoih jogjhdjoijdojioi" />

                <Button
                    android:id="@+id/btn_enrol"
                    android:layout_width="wrap_content"
                    android:layout_height="36dip"
                    android:layout_below="@+id/txt_title"
                    android:layout_centerHorizontal="true"
                    android:layout_marginBottom="16dip"
                    tools:text="RESQUEST ENROLLEMNT" />

                <View
                    android:layout_width="match_parent"
                    android:layout_height="70dp"
                    android:layout_below="@+id/btn_enrol"
                    tools:background="@color/azure" />

            </RelativeLayout>

            <android.support.v7.widget.Toolbar
                android:id="@+id/ntx_toolbar"
                android:layout_width="match_parent"
                android:layout_height="96dp"
                android:gravity="top"
                android:minHeight="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

                <TextView
                    android:id="@+id/ntx_toolbar_title"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:ellipsize="end"
                    android:lines="1"
                    android:singleLine="true" />

            </android.support.v7.widget.Toolbar>

            <com.netexlearning.mobile.ntxlearningapp.ntxviewkit.ntxviews.NTXTabLayout
                android:id="@+id/ntx_tabs"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:layout_gravity="bottom"
                app:tabGravity="center"
                app:tabIndicatorColor="@color/white"
                app:tabMaxWidth="0dp"
                app:tabMode="fixed"
                app:tabTextColor="@color/white" />

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


    <com.netexlearning.mobile.ntxlearningapp.helpers.NTXViewPager
        android:id="@+id/ntx_viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/netex_color_gray_row"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:background="@color/red" />

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

如果有人能指出我正确的方向：）

非常感谢你提前

1 个答案:

答案 0 :(得分：0)

试试这个我的朋友

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
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.ncrypted.trademart.TmpAct">

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

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsingToolBar_hotel_home"
        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">

        <ImageView
            android:id="@+id/img_hotel_home"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            android:src="@drawable/disha2"
            app:layout_collapseMode="parallax" />

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

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

    <android.support.design.widget.TabLayout
        android:id="@+id/tablayoutymp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="fill"
        app:tabMode="fixed" />

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


<android.support.v4.view.ViewPager
    android:id="@+id/viewpagertmp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

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

如果有任何疑问，请询问我

相关问题
最新问题