时间戳

首页 > 解决方案 > 使用导航组件导航出 ViewPager 选项卡

android - 使用导航组件导航出 ViewPager 选项卡

问题描述

首先，一些澄清。在查看了许多其他相关问题之后，让我们从这不是什么开始：

这个问题是关于如何使用导航组件，当 Viewpager 是组件之一时。

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

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

所需的 UI 行为 想要的状态。 片段在 viewpager 上方打开 第一个选项：我能得到的最好的工作是在其中一个选项卡（例如 TabA）内定义 FragHost，然后导航到 FragA。问题是导航是在选项卡内完成的。这意味着用户仍然会看到顶部的选项卡，并且仍然可以滑动到其他选项卡。不是我想要的。这是有效的图表，但不是我想要的（红色代表托管片段） 选项 1，其中一个选项卡内有嵌套的托管片段

第二种选择：将 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......at androidx.fragment.app.FragmentStore.addFragment 一些调试，我看到它试图添加 TabA 两次。我假设 ViewPagerAdapter 和 Nav Component 都在使用 Fragment 管理器。

我如何进行正常导航，您可以在其中使用选项卡，但单击一个会带您进入选项卡顶部的另一种全屏体验？

标签： androidandroid-jetpackandroid-architecture-navigationandroid-jetpack-navigation

解决方案

弄清楚我提到的第二个选项是正确的方法。写在这里以防其他人有同样的问题。

确保您的 nav_graph 指向 ViewPager 的包含片段，而不是 ViewPager 持有的特定片段。所以不是来自 TabA 而是来自托管 ViewPager 的 ContainerFragmentA

<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"
      />

然后您可以从任何选项卡中选择您想要的操作以转到正确的位置

推荐阅读