首页 > 解决方案 > 如何将 NavigationDrawer 与 TabLayout 和几个 Fragment 链接?

问题描述

我正在从“导航抽屉活动”模板开发一个 Android 应用程序。

在此模板中,每次单击导航菜单项都会打开一个片段,但我希望它以另一种方式工作。

第一项必须打开 TabLayout,其他项必须打开 Fragment。

我已经有一个应用程序,一侧带有 NavigationDrawer,另一侧带有 TabLayout,但我不知道如何正确地将 NavigationDrawer 与 TabLayout 和多个 Fragment 同时链接。

我可以管理单击的项目NavigationDrawer并相应地显示TabLayout,但我不确定这是否是最佳解决方案。

我的意思是每个元素NavigationDrawer通常都连接到一个特定的fragment,所以我TabLayout也应该被认为是一个fragment

我希望你明白我想要什么——我敢肯定这不是很复杂,因为它在 Android 应用程序中很常见。

这是我的MainActivity

class MainActivity : AppCompatActivity() {

    private lateinit var appBarConfiguration: AppBarConfiguration

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        configureToolbar()

        val drawerLayout: DrawerLayout = findViewById(R.id.drawer_layout)
        val navView: NavigationView = findViewById(R.id.nav_view)
        val navController = findNavController(R.id.nav_host_fragment)
        // Passing each menu ID as a set of Ids because each
        // menu should be considered as top level destinations.
        appBarConfiguration = AppBarConfiguration(setOf(
                R.id.nav_memory, R.id.nav_tag, R.id.nav_product), drawerLayout)
        setupActionBarWithNavController(navController, appBarConfiguration)
        navView.setupWithNavController(navController)

        configureViewPager()
    }

    override fun onCreateOptionsMenu(menu: Menu): Boolean {
        // Inflate the menu; this adds items to the action bar if it is present.
        menuInflater.inflate(R.menu.main, menu)
        return true
    }

    override fun onSupportNavigateUp(): Boolean {
        val navController = findNavController(R.id.nav_host_fragment)
        return navController.navigateUp(appBarConfiguration) || super.onSupportNavigateUp()
    }

    private fun configureToolbar() {
        val toolbar: Toolbar = findViewById(R.id.toolbar)
        setSupportActionBar(toolbar)
    }

    private fun configureViewPager() {
        //Get ViewPager from layout
        val pager = findViewById<View>(R.id.view_pager) as ViewPager
        //Set Adapter PageAdapter and glue it together
        pager.adapter = PageAdapter(this, supportFragmentManager)

        // 1 - Get TabLayout from layout
        val tabs = findViewById<View>(R.id.tabs) as TabLayout
        // 2 - Glue TabLayout and ViewPager together
        tabs.setupWithViewPager(pager)
        // 3 - Design purpose. Tabs have the same width
        tabs.tabMode = TabLayout.MODE_FIXED
    }
}

部分代码涉及TabLayout

PageAdapter

class PageAdapter(private val context: Context, fm: FragmentManager)
    : FragmentPagerAdapter(fm) {
    override fun getCount(): Int {
        return 4
    }

    override fun getItem(position: Int): Fragment {
        return when (position) {
            0 -> InfoPageFragment.newInstance()
            1 -> NDEFPageFragment.newInstance()
            2 -> FullScanPageFragment.newInstance()
            3 -> FlashPageFragment.newInstance()
            else -> getItem(position)
        }
    }

    override fun getPageTitle(position: Int): CharSequence? {
        return when (position) {
            0 -> "IC INFO"
            1 -> "NDEF"
            2 -> "FULL SCAN"
            3 -> "FLASH MCU"
            else -> null
        }
    }
}

InfoPageFragment

class InfoPageFragment : Fragment() {
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View {
        return inflater.inflate(R.layout.fragment_page_info, container, false)
    }

    companion object {
        fun newInstance(): InfoPageFragment {
            return InfoPageFragment()
        }
    }
}

部分代码涉及NavigationDrawer

HomeFragment

class HomeFragment : Fragment() {

    private lateinit var homeViewModel: HomeViewModel

    override fun onCreateView(
            inflater: LayoutInflater,
            container: ViewGroup?,
            savedInstanceState: Bundle?
    ): View? {
        homeViewModel =
                ViewModelProvider(this).get(HomeViewModel::class.java)
        val root = inflater.inflate(R.layout.fragment_home, container, false)
        val textView: TextView = root.findViewById(R.id.text_home)
        homeViewModel.text.observe(viewLifecycleOwner, Observer {
            textView.text = it
        })
        return root
    }
}

HomeViewModel

class HomeViewModel : ViewModel() {

    private val _text = MutableLiveData<String>().apply {
        value = "This is home Fragment"
    }
    val text: LiveData<String> = _text
}

标签: androidandroid-fragmentsnavigation-drawerandroid-tablayout

解决方案


推荐阅读