为什么在 NavigationView 中滚动取决于外部 xml 元素?
Why is scrolling in NavigationView dependent on outside xml elements?
我将 table 的内容菜单放在右侧的 NavigationView 中。这是我的有效代码:
<android.support.v4.widget.DrawerLayout
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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:layout_gravity="right"
tools:openDrawer="start">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/top_nav_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<!-- The main content gets loaded in here. -->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/grandparent_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="my.Activity">
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="@+id/toc_drawer_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:fitsSystemWindows="true"
app:headerLayout="@layout/burger_menu_header"
app:theme="@style/TableOfContents_TextAppearance"
app:menu="@menu/burger_menu_drawer_items"
>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
在以前版本的代码中,我在主要内容保持 LinearLayout 上方设置了 NavigationView。像这样:
<android.support.v4.widget.DrawerLayout
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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:layout_gravity="right"
tools:openDrawer="start">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/top_nav_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.NavigationView
android:id="@+id/toc_drawer_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:fitsSystemWindows="true"
app:headerLayout="@layout/burger_menu_header"
app:theme="@style/TableOfContents_TextAppearance"
app:menu="@menu/burger_menu_drawer_items"
>
</android.support.design.widget.NavigationView>
<!-- The main content gets loaded in here. -->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/grandparent_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="my.Activity">
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
</LinearLayout>
</android.support.v4.widget.DrawerLayout>
在那个版本中,系统(在模拟器和硬件测试设备上)显示右侧抽屉,并显示菜单的前几个元素,但我无法滚动到菜单底部。如果我在 xml 代码中手动打开滚动条,它会出现,但它不知道除了立即可见之外还有任何内容。
我的问题是为什么?使滚动魔法起作用的幕后绘图逻辑是什么?
为了完整起见,burger_menu_header.xml 看起来像这样:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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="wrap_content"
android:background="@drawable/toc_nav_bar"
android:gravity="bottom"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:theme="@style/ThemeOverlay.AppCompat.Dark">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="@dimen/nav_header_vertical_spacing"
android:text="Table of Contents"
android:textAppearance="@style/TextAppearance.AppCompat.Body1"/>
</LinearLayout>
和 burger_menu_drawer_items.xml 看起来像:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/nav_chapter_0"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Introduction"/>
<item
android:id="@+id/nav_chapter_1"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 1 - The Adventure"/>
<item
android:id="@+id/nav_chapter_2"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 2 - Our Heroes Go Sailing"/>
<item
android:id="@+id/nav_chapter_3"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 3 - The Ship Is LostAtSeaFarAway"/>
<item
android:id="@+id/nav_chapter_4"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 4 - Skipper Wins!"/>
<item
android:id="@+id/nav_chapter_5"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 5"/>
<item
android:id="@+id/nav_chapter_6"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 6"/>
<item
android:id="@+id/nav_chapter_7"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 7"/>
<item
android:id="@+id/nav_chapter_8"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 8"/>
<item
android:id="@+id/nav_chapter_9"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 9"/>
<item
android:id="@+id/nav_chapter_10"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 10"/>
<item
android:id="@+id/nav_chapter_11"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 11 - No Way Is This Happening, She Cried"/>
<item
android:id="@+id/nav_chapter_12"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 12 - The End?"/>
<item
android:id="@+id/nav_chapter_13"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 13 - But Wait..."/>
<item
android:id="@+id/nav_chapter_14"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 14 - But Wait..."/>
<item
android:id="@+id/nav_chapter_15"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 14 - Nah, It Was Nothing"/>
</menu>
大约
Z-Index
哥谭绿。
<item num1
<item num2 is above 1
<item num3 is above 2
So it is important that the item that needs touch or focus gets the
touch or focus. This is determined first by z-index. In the example
above item 3 has the greatest z-index and gets first attempt at
handling the touch before it is passed to item 2 and then if item 2
doesn't handle the touch it will go to item 1.
想象一下你有
<content>
<drawerNav>
drawerNav 首次尝试处理触摸并将 open/close 等触摸或滑动。如果不需要处理,它将传递到内容视图。
现在让我们考虑一下
<drawerNav>
<content>
内容是全屏的,每次都会消耗触摸,永远不会传递到抽屉,所以抽屉只能通过汉堡菜单工作,而不是滑动,即使那样也很不确定。
如您所见,它与通过 zindex 的触摸处理顺序有关。
我将 table 的内容菜单放在右侧的 NavigationView 中。这是我的有效代码:
<android.support.v4.widget.DrawerLayout
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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:layout_gravity="right"
tools:openDrawer="start">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/top_nav_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<!-- The main content gets loaded in here. -->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/grandparent_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="my.Activity">
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="@+id/toc_drawer_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:fitsSystemWindows="true"
app:headerLayout="@layout/burger_menu_header"
app:theme="@style/TableOfContents_TextAppearance"
app:menu="@menu/burger_menu_drawer_items"
>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
在以前版本的代码中,我在主要内容保持 LinearLayout 上方设置了 NavigationView。像这样:
<android.support.v4.widget.DrawerLayout
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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:layout_gravity="right"
tools:openDrawer="start">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/top_nav_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.NavigationView
android:id="@+id/toc_drawer_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:fitsSystemWindows="true"
app:headerLayout="@layout/burger_menu_header"
app:theme="@style/TableOfContents_TextAppearance"
app:menu="@menu/burger_menu_drawer_items"
>
</android.support.design.widget.NavigationView>
<!-- The main content gets loaded in here. -->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/grandparent_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="my.Activity">
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
</LinearLayout>
</android.support.v4.widget.DrawerLayout>
在那个版本中,系统(在模拟器和硬件测试设备上)显示右侧抽屉,并显示菜单的前几个元素,但我无法滚动到菜单底部。如果我在 xml 代码中手动打开滚动条,它会出现,但它不知道除了立即可见之外还有任何内容。
我的问题是为什么?使滚动魔法起作用的幕后绘图逻辑是什么?
为了完整起见,burger_menu_header.xml 看起来像这样:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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="wrap_content"
android:background="@drawable/toc_nav_bar"
android:gravity="bottom"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:theme="@style/ThemeOverlay.AppCompat.Dark">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="@dimen/nav_header_vertical_spacing"
android:text="Table of Contents"
android:textAppearance="@style/TextAppearance.AppCompat.Body1"/>
</LinearLayout>
和 burger_menu_drawer_items.xml 看起来像:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/nav_chapter_0"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Introduction"/>
<item
android:id="@+id/nav_chapter_1"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 1 - The Adventure"/>
<item
android:id="@+id/nav_chapter_2"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 2 - Our Heroes Go Sailing"/>
<item
android:id="@+id/nav_chapter_3"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 3 - The Ship Is LostAtSeaFarAway"/>
<item
android:id="@+id/nav_chapter_4"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 4 - Skipper Wins!"/>
<item
android:id="@+id/nav_chapter_5"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 5"/>
<item
android:id="@+id/nav_chapter_6"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 6"/>
<item
android:id="@+id/nav_chapter_7"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 7"/>
<item
android:id="@+id/nav_chapter_8"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 8"/>
<item
android:id="@+id/nav_chapter_9"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 9"/>
<item
android:id="@+id/nav_chapter_10"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 10"/>
<item
android:id="@+id/nav_chapter_11"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 11 - No Way Is This Happening, She Cried"/>
<item
android:id="@+id/nav_chapter_12"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 12 - The End?"/>
<item
android:id="@+id/nav_chapter_13"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 13 - But Wait..."/>
<item
android:id="@+id/nav_chapter_14"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 14 - But Wait..."/>
<item
android:id="@+id/nav_chapter_15"
android:icon="@drawable/ic_radio_button_unchecked_black_24dp"
android:title="Chapter 14 - Nah, It Was Nothing"/>
</menu>
大约
Z-Index
哥谭绿。
<item num1
<item num2 is above 1
<item num3 is above 2
So it is important that the item that needs touch or focus gets the touch or focus. This is determined first by z-index. In the example above item 3 has the greatest z-index and gets first attempt at handling the touch before it is passed to item 2 and then if item 2 doesn't handle the touch it will go to item 1.
想象一下你有
<content>
<drawerNav>
drawerNav 首次尝试处理触摸并将 open/close 等触摸或滑动。如果不需要处理,它将传递到内容视图。
现在让我们考虑一下
<drawerNav>
<content>
内容是全屏的,每次都会消耗触摸,永远不会传递到抽屉,所以抽屉只能通过汉堡菜单工作,而不是滑动,即使那样也很不确定。
如您所见,它与通过 zindex 的触摸处理顺序有关。