避免ViewPager下工具栏会 [英] Avoid ViewPager going under Toolbar
本文介绍了避免ViewPager下工具栏会的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
根据
这回答我试图让我的使用案例的解决方案。而是采用了折叠工具栏我使用的是常规的之一，但与 TabLayout 。然而，对于 TabLayout 我需要使用 ViewPager ，我不知道在哪里把它放在以避免麻烦与的FrameLayout 。 ViewPager在我的主机片段，当其布局取代的FrameLayout，内容去的工具栏和TabLayout下方出于某种原因...
我试图把它的线下
＆LT;包括布局=@布局/ content_main/＆GT;
在的app_bar_main.xml ，但它搞砸了我的UI。
真正的问题是，如果我需要为我的一个片段和的FrameLayout我需要一个ViewPager我TabLayout，我该如何实施解决方案？
您可以看到，我提出的观点有点使工具栏隐藏。这种方式是可以看到的ViewPager占用空间甚至低于工具栏（当它是可见的）
![屏幕截图](\"http://i.stack.imgur.com/hc41a.png\")
当前的尝试 - appbar_content （工具栏只是一个工具栏在不同的布局）：
＆LT;？XML版本=1.0编码=UTF-8＆GT？;
＆LT; android.support.design.widget.CoordinatorLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
的xmlns：程序=http://schemas.android.com/apk/res-auto
的xmlns：工具=http://schemas.android.com/tools
机器人：layout_width =match_parent
机器人：layout_height =match_parent
工具：上下文=MainActivity。＆GT;＆LT; android.support.design.widget.AppBarLayout
机器人：ID =@ + ID / appBarLayout 机器人：layout_width =match_parent
机器人：layout_height =WRAP_CONTENT＆GT; ＆LT;包括布局=@布局/工具栏/＆GT; ＆LT; android.support.design.widget.TabLayout
机器人：知名度=看得见
机器人：ID =@ + ID / tabLayout
机器人：layout_width =match_parent
机器人：layout_height =？ATTR / actionBarSize
机器人：背景=@彩色/水鸭
应用：tabGravity =补
应用：tabIndicatorColor =@彩色/ purple800
应用：tabIndicatorHeight =4DP
应用：itemIconTint =@彩色/ tabicons
应用：tabMode =固定
应用：tabSelectedTextColor =@彩色/ tealfifty
应用：tabTextAppearance =@风格/ TabCapsFalse
应用：tabTextColor =@色/铁/＆GT;
＆LT; /android.support.design.widget.AppBarLayout>
＆LT;包括布局=@布局/ content_main/＆GT;＆LT; /android.support.design.widget.CoordinatorLayout>
content_main （删除NestedScrollView因为它搞砸了一切，把我的整个片段认为自己像一个小框（50×50也许大小）在屏幕的中间）
＆LT;？XML版本=1.0编码=UTF-8＆GT？;
＆LT;的FrameLayout机器人：ID =@ + ID / content_main_frame
机器人：layout_width =match_parent
机器人：layout_height =match_parent
的xmlns：机器人=http://schemas.android.com/apk/res/android/＆GT;
我的 DrawerLayout
＆LT; android.support.v4.widget.DrawerLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
的xmlns：程序=http://schemas.android.com/apk/res-auto
机器人：ID =@ + ID /抽屉
机器人：layout_width =match_parent
机器人：layout_height =match_parent
机器人：fitsSystemWindows =真正的＆GT;＆LT;包括
布局=@布局/ appbar_content
机器人：layout_width =match_parent
机器人：layout_height =match_parent/＆GT; ＆LT; android.support.design.widget.NavigationView
机器人：fitsSystemWindows =真
机器人：ID =@ + ID / nvView
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =match_parent
机器人：layout_gravity =开始
机器人：背景=@彩色/ tealfifty
应用：itemBackground =@绘制/ drawer_item
应用：itemTextColor =@彩色/ drawer_item
应用：itemIconTint =@彩色/ drawer_item
应用：headerLayout =@布局/ drawer_header
应用：菜单=@菜单/ navigation_view_items/＆GT;
＆LT; /android.support.v4.widget.DrawerLayout>
解决方案
很多挣扎后，我发现，把一个NestedScrollView我的FrameLayout内分配layout_behaviour我的FrameLayout作出滚动视图继承它，现在它的所有作品就像一个魅力！
这是我的DrawerLayout
＆LT; android.support.v4.widget.DrawerLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
的xmlns：程序=http://schemas.android.com/apk/res-auto
机器人：ID =@ + ID /抽屉
机器人：layout_width =match_parent
机器人：layout_height =match_parent
机器人：fitsSystemWindows =真正的＆GT;＆LT;包括
布局=@布局/ appbar_content
机器人：layout_width =match_parent
机器人：layout_height =match_parent/＆GT; ＆LT; android.support.design.widget.NavigationView
机器人：fitsSystemWindows =真
机器人：ID =@ + ID / nvView
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =match_parent
机器人：layout_gravity =开始
机器人：背景=@彩色/ tealfifty
应用：itemBackground =@绘制/ drawer_item
应用：itemTextColor =@彩色/ drawer_item
应用：itemIconTint =@彩色/ drawer_item
应用：headerLayout =@布局/ drawer_header
应用：菜单=@菜单/ navigation_view_items/＆GT;
＆LT; /android.support.v4.widget.DrawerLayout>
appbar_content.xml
＆LT;？XML版本=1.0编码=UTF-8＆GT？;
＆LT; android.support.design.widget.CoordinatorLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
的xmlns：程序=http://schemas.android.com/apk/res-auto
的xmlns：工具=http://schemas.android.com/tools
机器人：layout_width =match_parent
机器人：layout_height =match_parent
工具：上下文=MainActivity。＆GT;＆LT; android.support.design.widget.AppBarLayout
机器人：ID =@ + ID / appBarLayout
机器人：layout_width =match_parent
机器人：layout_height =WRAP_CONTENT＆GT; ＆LT;包括布局=@布局/工具栏/＆GT; ＆LT; android.support.design.widget.TabLayout
机器人：知名度=看得见
机器人：ID =@ + ID / tabLayout
机器人：layout_width =match_parent
机器人：layout_height =？ATTR / actionBarSize
机器人：背景=@彩色/水鸭
应用：tabGravity =补
应用：tabIndicatorColor =@彩色/ purple800
应用：tabIndicatorHeight =4DP
应用：itemIconTint =@彩色/ tabicons
应用：tabMode =固定
应用：tabSelectedTextColor =@彩色/ tealfifty
应用：tabTextAppearance =@风格/ TabCapsFalse
应用：tabTextColor =@色/铁/＆GT;
＆LT; /android.support.design.widget.AppBarLayout>＆LT;的FrameLayout机器人：ID =@ + ID / content_main_frame
机器人：layout_width =match_parent
机器人：layout_height =match_parent
的xmlns：机器人=http://schemas.android.com/apk/res/android
应用：layout_behavior =@字符串/ appbar_scrolling_view_behavior
的xmlns：程序=http://schemas.android.com/apk/res-auto
工具：舒=@布局/ appbar_content
的xmlns：工具=http://schemas.android.com/tools＆GT;
＆LT; android.support.v4.widget.NestedScrollView
机器人：ID =@ + ID / scroll_content
机器人：layout_width =match_parent
机器人：layout_height =match_parent/＆GT;
＆LT; /＆的FrameLayout GT;
＆LT; android.support.design.widget.FloatingActionButton
机器人：ID =@ + ID / FAB
机器人：知名度=隐形
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_margin =16DP
机器人：可点击=真
机器人：SRC =@绘制/ addico
应用：layout_anchor =@ ID / content_main_frame
应用：layout_anchorGravity =底部|结束/＆GT;
Based on
this answer I tried to make a solution for my Use Case. Instead of using a Collapsing toolbar I'm using a regular one but with a TabLayout. However, for the TabLayout I need to use a ViewPager and I have no idea where to place it in order to avoid trouble with the FrameLayout. ViewPager was in my Host Fragment and when its layout replaced the FrameLayout, the content went below the Toolbar and TabLayout for some reason...
I tried putting it below that line
<include layout="@layout/content_main" />
in the app_bar_main.xml but it messed up my UI.
The real question is, if I need a FrameLayout for my fragments and I need a ViewPager for my TabLayout, how do I implement a solution?
You can see that I moved the view a bit so that the Toolbar hides. This way it's visible the ViewPager takes up space even below the Toolbar (when it's visible)
Current attempt - appbar_content (Toolbar is just a Toolbar in separate layout):
<?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"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="@layout/toolbar" />
<android.support.design.widget.TabLayout
android:visibility="visible"
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/teal"
app:tabGravity="fill"
app:tabIndicatorColor="@color/purple800"
app:tabIndicatorHeight="4dp"
app:itemIconTint="@color/tabicons"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/tealfifty"
app:tabTextAppearance="@style/TabCapsFalse"
app:tabTextColor="@color/iron" />
</android.support.design.widget.AppBarLayout>
<include layout="@layout/content_main" />
</android.support.design.widget.CoordinatorLayout>
content_main (removed NestedScrollView as it screwed up everything, put my whole fragment view like in a small frame(maybe 50x50 size) in the middle of the screen)
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:id="@+id/content_main_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android" />
My DrawerLayout:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<include
layout="@layout/appbar_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:fitsSystemWindows="true"
android:id="@+id/nvView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="@color/tealfifty"
app:itemBackground="@drawable/drawer_item"
app:itemTextColor="@color/drawer_item"
app:itemIconTint="@color/drawer_item"
app:headerLayout="@layout/drawer_header"
app:menu="@menu/navigation_view_items" />
</android.support.v4.widget.DrawerLayout>
解决方案
After a lot of struggling, I found that putting a NestedScrollView inside my FrameLayout and assigning a layout_behaviour to my FrameLayout made the Scroll View inherit it and now it all works like a charm!
This is my DrawerLayout:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<include
layout="@layout/appbar_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:fitsSystemWindows="true"
android:id="@+id/nvView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="@color/tealfifty"
app:itemBackground="@drawable/drawer_item"
app:itemTextColor="@color/drawer_item"
app:itemIconTint="@color/drawer_item"
app:headerLayout="@layout/drawer_header"
app:menu="@menu/navigation_view_items" />
</android.support.v4.widget.DrawerLayout>
appbar_content.xml
<?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"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="@layout/toolbar" />
<android.support.design.widget.TabLayout
android:visibility="visible"
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/teal"
app:tabGravity="fill"
app:tabIndicatorColor="@color/purple800"
app:tabIndicatorHeight="4dp"
app:itemIconTint="@color/tabicons"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/tealfifty"
app:tabTextAppearance="@style/TabCapsFalse"
app:tabTextColor="@color/iron" />
</android.support.design.widget.AppBarLayout>
<FrameLayout android:id="@+id/content_main_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:showIn="@layout/appbar_content"
xmlns:tools="http://schemas.android.com/tools">
<android.support.v4.widget.NestedScrollView
android:id="@+id/scroll_content"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:visibility="invisible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:clickable="true"
android:src="@drawable/addico"
app:layout_anchor="@id/content_main_frame"
app:layout_anchorGravity="bottom|end" />
这篇关于避免ViewPager下工具栏会的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
