Android，结合了底部导航和标签（活动与片段）

Question

地狱社区，

我是Android的新手，但找不到该问题的好答案：

我想使用底部导航，某些元素也应使用选项卡。

现在，我的问题是最常见（最佳）的实现方式是什么？

如果在此导航中使用活动或片段，我会感到困惑。

仅将片段用于底部导航和选项卡是一种好的方法，还是将活动用于底部导航和将选项卡仅用于片段的最佳方法？

最好的祝福

Answer 1

最好的方法是同时使用Fragment 。 如果您对从底部导航可访问的每个屏幕使用一个Activity在每个屏幕中放置一个BottomNavigationView并复制大量代码，并对这些活动之间的转换进行调整。

活动应视为您应用程序的切入点：单击启动器中的应用程序图标时，将启动清单中定义的主要活动。 对于其他任何内容（UI的一部分，导航流程的一部分...），您可以使用Fragment 。

这是一个示例Activity和Fragments组织来解决您的情况：

MainActivity
     |--- TopLevelFragment1
     |--- TopLevelFragment2
     |           |--- TabFragment1
     |           |--- TabFragment2
     |           |--- TabFragment3
     |
     |--- TopLevelFragment3
     |--- TopLevelFragment4

如您在上面的架构中看到的，一个Activity可以承载子片段，并且这些片段也可以具有嵌套的片段（也称为“子片段”）。 TopLevelFragmentN是在BottomNavigationView选择一个项目时显示的片段。 TabFragmentN是从TopLevelFragment2选择选项卡时显示的片段。

让我们深入研究实现。 我尚未测试以下代码，仅供参考。 这是活动的示例代码：

main_activity.xml

<CoordinatorLayout android:id="@+id/coordinator_layout">
  <FrameLayout android:id="@+id/fragment_host"><!-- TopLevelFragments will be displayed here --></FrameLayout>
  <BottomNavigationView android:id="@+id/bottom_nav"/>
</CoordinatorLayout>

MainActivity.java

public class MainActivity extends AppCompatActivity {

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_activity);

        // Retrieve a reference to the BottomNavigationView and listen for click events.
        BottomNavigationView bottomNav = findViewById<BottomNavigationView>(R.id.bottom_nav);
        bottomNav.setOnNavigationItemSelectedListener(item -> {
            // Depending on the clicked item, change the displayed TopLevelFragment.
            switch(item.getItemId()) {
                case R.id.top_level_1:
                    showTopLevelFragment(new TopLevelFragment1());
                    return true;
                case R.id.top_level_2:
                    // Do the same with other TopLevelFragments
                    return true;
                default:
                    return false;
            }
        }

        // Show the first TopLevelFragment by default.
        showTopLevelFragment(new TopLevelFragment1());
    }

    private void showTopLevelFragment(Fragment fragment) {
        // Use the fragment manager to dynamically change the fragment displayed in the FrameLayout.
        getSupportFragmentManager().beginTransaction()
            .replace(R.id.fragment_host, fragment)
            .commit();
    }
}

请参考文档以了解如何在BottomNavigationView定义项目。

现在，让我们集中讨论包含选项卡的TopLevelFragment2 。 将TabLayout与ViewPager一起使用是一种常见的模式，因此您可以通过向左或向右滑动来将一个标签移至另一个标签。

top_level_fragment_2.xml

<ConstraintLayout android:id="@+id/constraint_layout">    
    <AppBarLayout android:id="@+id/appbar_layout">
        <Toolbar android:id="@+id/toolbar"/>
        <TabLayout android:id="@+id/tab_layout"/>
    </AppBarLayout>
    <ViewPager android:id="@+id/tab_pager"/>
</ConstraintLayout>

TopLevelFragment2.java

public class TopLevelFragment2 extends Fragment {

    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.top_level_fragment_2, container, false);
    }

    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);

        MyTabPagerAdapter tabPager = new MyTabPagerAdapter(getFragmentManager());

        ViewPager viewPager = getView().findViewById(R.id.tab_pager);
        viewPager.setAdapter(tabPager);

        // Display a tab for each Fragment displayed in ViewPager.
        TabLayout tabLayout = getView.findViewById(R.id.tab_layout);
        tabLayout.setupWithViewPager(viewPager);
    }

    static class MyTabPagerAdapter extends FragmentPagerAdapter {
        MyTabPagerAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public int getCount() {
            return 3; // One for each tab, 3 in our example.
        }

        @Override
        public Fragment getItem(int position) {
            switch(position) {
                case 0:
                    return new TabFragment1();
                case 1:
                    // Return a new instance of the fragment associated with the tab at position 1
                default:
                    throw new IllegalArgumentException();
            }
        }
    }
}

完成这些步骤之后，您要做的就是为其他片段编写代码。