AndroidApp首页主流框架搭建

　　DrawerLayoutNavigationViewToolbarViewPagerBottomNavigationView效果
　　页面结构解析
　　这是一个比较常见的APP首页的结构，侧边栏主页，侧边栏里是一些菜单，主页由底部菜单控制内容区，内容区是可滑动的子页面。整体比较舒服合理，各自为阵，却又能关联在一起，加上又是大众喜爱的MaterialDesign风格，所以成为了当下APP首页的主流结构。
　　上图是做的一个简单的思维导图，并不复杂，理清了结构就能事半功倍。页面布局1。首页
　　即整个大的容器。
　　lt；？xmlversion1。0encodingutf8？includelayoutlayoutappbarmainandroid：layoutwidthmatchparentandroid：layoutheightmatchparentcom。google。android。material。navigation。NavigationViewandroid：ididnavviewandroid：layoutwidthwrapcontentandroid：layoutheightmatchparentandroid：layoutgravitystartandroid：fitsSystemWindowstrueapp：headerLayoutlayoutnavheadermainapp：menumenuactivitymaindrawerandroidx。drawerlayout。widget。DrawerLayout
　　DrawerLayout包裹着include的主页和侧边栏内容NavigationView。appbarmain是主页内容，采用include的方式引用是为了结构清晰，避免混乱。侧边栏NavigationView分为头部布局headerLayout和菜单menu，注意一个是layout一个是menu。其他需要注意的是，NavigationView的位置应与主内容appbarmain同级，且在主内容之后。关于DrawerLayout更多使用可以查看：DrawerLayout使用详解。2。主页
　　这里主页说的是首页除侧边栏以外的页面。
　　lt；？xmlversion1。0encodingutf8？com。google。android。material。appbar。AppBarLayoutandroid：layoutwidthmatchparentandroid：layoutheightwrapcontentandroid：themestyleAppTheme。AppBarOverlaycom。google。android。material。appbar。AppBarLayoutincludelayoutlayoutcontentmaincom。google。android。material。floatingactionbutton。FloatingActionButtonandroid：ididfabandroid：layoutwidthwrapcontentandroid：layoutheightwrapcontentandroid：layoutgravitybottomendandroid：layoutmarginRightdimendp20android：layoutmarginEnddimendp20android：layoutmarginBottomdimendp70app：srcCompatandroid：drawableicdialogemailandroidx。coordinatorlayout。widget。CoordinatorLayout
　　上面是标题，中间是内容区，FloatingActionButton可以忽略。3。主页内容区
　　效果同2一样
　　lt；？xmlversion1。0encodingutf8？LinearLayoutandroid：layoutwidthmatchparentandroid：layoutheightmatchparentandroid：orientationverticalcom。google。android。material。bottomnavigation。BottomNavigationViewandroid：ididbottomnavigationandroid：layoutwidthmatchparentandroid：layoutheightwrapcontentandroid：layoutmarginTop8dpandroid：background？android：attrwindowBackgroundapp：layoutconstraintBottomtoTopOfidviewPagerapp：menumenubottomnavigationLinearLayoutandroidx。constraintlayout。widget。ConstraintLayout
　　上面是ViewPager，可滑动的内容区，填充一个一个的Fragment子页面。下面是BottomNavigationView底部菜单，与上面的ViewPager关联。
　　到此页面布局的部分介绍完毕，下面开始说代码部分。代码部分1。侧边栏
　　我们要在toolbar上加一个按钮，把侧边栏关联起来，让其点击可以弹出侧边栏。
　　Drawer关联ToolbarprivatefuninitActionBarDrawer（）｛valtoggleActionBarDrawerToggle（this，drawerlayout，toolbar，R。string。navigationdraweropen，R。string。navigationdrawerclose）drawerlayout。addDrawerListener（toggle）toggle。syncState（）｝2。内容区
　　关联了侧边栏，我们来看内容区，上面说过内容区是ViewPager包含的一个个子页面Fragment，来看代码的实现
　　初始化FragmentprivatefuninitFragments（）｛valviewPagerAdapterCommonViewPagerAdapter（supportFragmentManager）viewPagerAdapter。addFragment（HomeFragment（））viewPagerAdapter。addFragment（TreeFragment（））viewPagerAdapter。addFragment（NaviFragment（））viewPagerAdapter。addFragment（ProjectFragment（））viewpager。offscreenPageLimit1viewpager。adapterviewPagerAdapter｝
　　处理事件1。侧边栏点击事件侧边栏点击事件navview。setNavigationItemSelectedListener｛Handlenavigationviewitemclickshere。when（it。itemId）｛R。id。navcollect｛ToastUtilKt。showToast（收藏）｝R。id。navshare｛ToastUtilKt。showToast（分享）｝R。id。navabout｛ToastUtilKt。showToast（关于）｝R。id。navlogout｛ToastUtilKt。showToast（退出）｝｝关闭侧边栏drawerlayout。closeDrawer（GravityCompat。START）true｝
　　根据itemId判断触发事件，并关闭侧边栏，这一步可选，也可以不关闭保持侧边栏打开的状态。2。viewpager滑动监听viewpager滑动监听viewpager。addOnPageChangeListener（object：OnPageChangeListener｛overridefunonPageScrollStateChanged（state：Int）｛｝overridefunonPageScrolled（position：Int，positionOffset：Float，positionOffsetPixels：Int）｛｝overridefunonPageSelected（position：Int）｛bottomnavigation。menu。getItem（position）。isCheckedtrue设置checked为true，但是不能触发ItemSelected事件，所以滑动时也要设置一下标题when（position）｛0｛toolbar。titleresources。getString（R。string。appname）｝1｛toolbar。titleresources。getString（R。string。titletree）｝2｛toolbar。titleresources。getString（R。string。titlenavi）｝else｛toolbar。titleresources。getString（R。string。titleproject）｝｝｝｝）
　　viewpager滑动之后底部对应的菜单选中，并重新设置标题。3。bottomnavigation底部菜单点击事件bottomnavigation点击事件bottomnavigation。setOnNavigationItemSelectedListener｛when（it。itemId）｛R。id。navigationhome｛viewpager。currentItem0returnsetOnNavigationItemSelectedListenertrue｝R。id。navigationtree｛viewpager。currentItem1returnsetOnNavigationItemSelectedListenertrue｝R。id。navigationnavi｛viewpager。currentItem2returnsetOnNavigationItemSelectedListenertrue｝R。id。navigationproject｛viewpager。currentItem3returnsetOnNavigationItemSelectedListenertrue｝｝false｝
　　底部菜单点击的时候也让viewpager滑动的响应的位置，同第2步其实是相互关联的。
　　到此，整个搭建就完成了，从页面布局到初始化控件，再到处理事件，整体思路要清晰，搭建起来就很快，小的功能细节再调试完善完善就ok了。完整代码https：github。comyechaoawanandroidkotlin
　　写作不易，有用就点个赞呗