使用导航组件从ViewPager标签导航

Question

使用导航组件从ViewPager标签导航

androidandroid-jetpackandroid-architecture-navigationandroid-jetpack-navigation

11

首先，需要澄清一些问题。在查看了许多相关问题后，让我们先确定这不是关于BottomNavigation的问题，也不是关于使用导航组件（比如这个）来操作ViewPager的问题。这个问题是关于如何在ViewPager作为其中一个组件时使用导航组件的。

情况是有3个选项卡：TabA、TabB和TabC，还有2个额外的片段：FragA和FragB。

如何将它们全部连接起来，以便ViewPagerAdapter处理TabA、TabB和TabC，并且nav_praph将处理从：

TabA --> FragA TabB --> FragB TabC --> FragA（不是打字错误）

期望的UI行为：

desired state. Fragment opens above the viewpager

第一选项：我能够使其正常工作的最佳方法是在其中一个标签（例如TabA）中定义FragHost，然后导航到FragA。问题是导航是在标签内完成的。这意味着用户仍然会看到顶部的标签，并且还可以滑动到其他标签。这不是我想要的。以下是一个图表，显示了可行但不是我想要的内容（红色表示托管片段）

option 1 with nested hosting fragment inside one of the tabs

第二个选项：将fragHost移动到顶部，并使其包含ViewPager，以便占用整个屏幕。然后在nagGraph中提及。

<navigation
    android:id="@+id/nav_graph"
    app:startDestination="@id/tab_a"
    >
    <fragment
      android:id="@+id/tab_a"
      android:name="com.myapp.home.views.TabA"
      android:layout="@layout/tab_a_layout"
      >

    <action
        android:id="@+id/action_tab_a_to_frag_a"
        app:destination="@+id/frag_a"
        />
  </fragment>

  <fragment
      android:id="@+id/frag_a"
      android:name="com.myapp.FragA"
      android:label="details"
      android:layout="@layout/frag_a"
      />

这导致出现了一个“IllegalStateException”……在“androidx.fragment.app.FragmentStore.addFragment”处。进行了一些调试，我发现它尝试两次添加TabA。我假设ViewPagerAdapter和Nav组件都在使用片段管理器。

如何实现正常的导航，即您可以使用选项卡，但单击其中一个选项卡会带您进入另一个全屏体验并覆盖选项卡？

- Alon

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Alon · Accepted Answer

我发现我提到的第二个选项是正确的方法。在这里写下来，以防其他人遇到相同的问题。

确保您的 nav_graph 是从 ViewPager 的包含 Fragment 指向，而不是从 ViewPager 所持有的特定 Fragment（如 TabA）指向。因此，要从托管 ViewPager 的 ContainerFragmentA 开始，而不是从 TabA 开始。

<navigation
    android:id="@+id/nav_graph"
    app:startDestination="@id/view_pager_hosting_frag"
    >
    <fragment
      android:id="@+id/view_pager_hosting_frag"
      android:name="com.myapp.home.views.ViewPagerHostingFrag"
      android:layout="@layout/view_pager_layout"
      >

    <action
        android:id="@+id/action_tab_a_to_frag_a"
        app:destination="@+id/frag_a"
        />
  </fragment>

  <fragment
      android:id="@+id/frag_a"
      android:name="com.myapp.FragA"
      android:label="details"
      android:layout="@layout/frag_a"
      />

然后，您可以从任何选项卡中选择所需的操作以转到正确的位置。