您现在的位置：程式碼之家 >> 編程語言 > >> 更多程式語言 >> 程式設計綜合問答

Android QQ 底部導航欄實現原理：Fragment + ViewPager + 底部按鈕狀態管理完整解析

編輯：程式設計綜合問答

架構概覽


Activity (MainActivity)
├── ViewPager / ViewPager2          // 頁面容器，管理 Fragment 生命周期
├── FragmentAdapter                 // FragmentStateAdapter / FragmentPagerAdapter
├── BottomNavigationView / 自定義布局  // 底部導航欄
└── 4-5 個 Fragment                 // 消息、聯系人、動態、設置等

核心實現步驟

1. 頁面容器：ViewPager2 + FragmentStateAdapter


// MainActivity.kt
class MainActivity : AppCompatActivity() {
    private lateinit var viewPager: ViewPager2
    private lateinit var bottomNav: BottomNavigationView
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        
        viewPager = findViewById(R.id.viewPager)
        bottomNav = findViewById(R.id.bottomNav)
        
        // 適配器：FragmentStateAdapter 自動銷毀不可见 Fragment 節省內存
        viewPager.adapter = MainPagerAdapter(this)
        
        // 頁面切換監聽 → 更新底部按鈕選中狀態
        viewPager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
            override fun onPageSelected(position: Int) {
                bottomNav.menu.getItem(position).isChecked = true
            }
        })
        
        // 底部按鈕點擊 → 切換 ViewPager 頁面
        bottomNav.setOnItemSelectedListener { item ->
            viewPager.currentItem = item.order
            true
        }
    }
}

// 適配器
class MainPagerAdapter(activity: FragmentActivity) : FragmentStateAdapter(activity) {
    private val fragments = listOf(
        MessageFragment(), 
        ContactFragment(), 
        DynamicFragment(), 
        SettingFragment()
    )
    
    override fun getItemCount() = fragments.size
    override fun createFragment(position: Int) = fragments[position]
}

2. 底部導航欄布局

3. 菜單資源

4. 圖片選擇器（狀態變色）

關鍵技術點總結

技術點	QQ 實現方式	作用
頁面容器	ViewPager2 + FragmentStateAdapter	預加載鄰近頁、銷毀遠端頁、內存優化
數據刷新	Fragment.onResume() / setUserVisibleHint()	頁面可見時請求最新數據
狀態保持	Fragment 內部 ViewModel + SavedStateHandle	橫豎屏切換、進程復活數據不丟
紅點/角標	BottomNavigationView.getOrCreateBadge()	消息未讀數實時顯示
動畫過渡	SharedElementTransition / 無動畫切換	極速切換體驗

常見誤區

❌ 用 `Activity` 跳轉代替 `Fragment` 切換 → 重建開銷大、狀態難維護
❌ 底部按鈕用 `RadioGroup` + `FragmentTransaction` 手動管理 → 代碼冗余、動畫難控制
❌ 不使用 `FragmentStateAdapter` → 所有 Fragment 常駐內存、OOM 風險

總結

QQ 底部導航 = **ViewPager2 管理 Fragment** + **BottomNavigationView 狀態同步** + **FragmentStateAdapter 內存優化** + **ViewModel 持久化數據**。這是現代 Android 單 Activity 多 Fragment 架構的標準範式。