欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android使用開源組件PagerBottomTabStrip實(shí)現(xiàn)底部菜單和頂部導(dǎo)航功能

 更新時(shí)間：2018年08月29日 14:23:50   作者：會(huì)飛的魚兒  
這篇文章主要介紹了Android使用PagerBottomTabStrip實(shí)現(xiàn)底部菜單和頂部導(dǎo)航功能，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下

PagerBottomTabStrip 是一個(gè)基本按谷歌Material Design規(guī)范完成的安卓底部導(dǎo)航欄控件

官方設(shè)計(jì)規(guī)范：https://www.google.com/design/spec/components/bottom-navigation.html

1、前言

（1）底部選擇菜單功能應(yīng)該是大多app都會(huì)用到的，實(shí)現(xiàn)方式也有很多種，比較笨的方法可以自定義一個(gè)xml，下方布局樣式，每次點(diǎn)擊不同按鈕時(shí)跳轉(zhuǎn)到不同activity，這個(gè)activity重新加載一下底部菜單

（2）今天介紹一個(gè)網(wǎng)上比較流行的底部菜單PagerBottomTabStrip功能，主要是這個(gè)菜單樣式比價(jià)好看，而且點(diǎn)擊時(shí)有點(diǎn)擊效果，感覺還是不錯(cuò)的，而且也可以在菜單上加數(shù)字顯示。功能算是比較全的吧。在GitHub上有2000多個(gè)star，所以選擇它作為項(xiàng)目的底部菜單：https://github.com/tyzlmjj/PagerBottomTabStrip。

（3）當(dāng)然還有一個(gè)框架也不錯(cuò)，可以參考：https://github.com/ogaclejapan/SmartTabLayout

（4）效果圖：

2、底部導(dǎo)航菜單功能代碼

1、首先需要引用包：

compile 'me.majiajie:pager-bottom-tab-strip:2.2.5'

2、然后寫一個(gè)主的activity和底部點(diǎn)擊進(jìn)入的兩個(gè)Fragment：

class MainBottomTabActivity : BaseActivity() {
 private val mFragments = ArrayList<Fragment>()
 var number:Int=8
 override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
  setContentView(R.layout.main_bottom_tab)
  //初始化Fragment
  initFragment()
  //初始化底部Button
  initBottomTab()
 }
 /**
  * 初始化四個(gè)導(dǎo)航頁(yè)面
  */
 fun initFragment(){
  mFragments!!.add(TabBar1Fragment())
  mFragments!!.add(TabBar2Fragment())
  mFragments!!.add(TabBar1Fragment())
  //默認(rèn)選中第一個(gè)
  val transaction = supportFragmentManager.beginTransaction()
  transaction!!.add(R.id.frameLayout, mFragments[0])
  transaction.commitAllowingStateLoss()
 }
 fun initBottomTab(){
  //這里要特別注意，pager_bottom_tab.custom()這句話就是選擇自己需要的樣式
  val navigationController = pager_bottom_tab.custom()
    .addItem(newItem(R.drawable.ic_restore_gray_24dp, R.drawable.ic_restore_teal_24dp, "消息"))
    .addItem(newItem(R.drawable.ic_favorite_gray_24dp, R.drawable.ic_favorite_teal_24dp, "工作"))
    .addItem(newItem(R.drawable.ic_nearby_gray_24dp, R.drawable.ic_nearby_teal_24dp, "我的"))
    .build()
  //設(shè)置消息數(shù)
  navigationController.setMessageNumber(1, number)
  //設(shè)置顯示小圓點(diǎn)
  navigationController.setHasMessage(0, true)
  //底部按鈕的點(diǎn)擊事件監(jiān)聽
  navigationController.addTabItemSelectedListener(object : OnTabItemSelectedListener {
   override fun onSelected(index: Int, old: Int) {
    val transaction = supportFragmentManager.beginTransaction()
    transaction.replace(R.id.frameLayout, mFragments[index])
    transaction.commitAllowingStateLoss()
    if(index==0){
     navigationController.setHasMessage(0, false)
    }else if(index==1){
     navigationController.setMessageNumber(1, --number)
    }
   }
   override fun onRepeat(index: Int) {}
  })
 }
 //創(chuàng)建一個(gè)Item
 private fun newItem(drawable: Int, checkedDrawable: Int, text: String): BaseTabItem {
  val normalItemView = NormalItemView(this)
  normalItemView.initialize(drawable, checkedDrawable, text)
  normalItemView.setTextDefaultColor(Color.GRAY)
  normalItemView.setTextCheckedColor(-0xff6978)
  return normalItemView
 }
}

3、頂部導(dǎo)航功能

（1）定義activity的style

android:theme="@style/AppTheme"
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
 <!-- Customize your theme here. -->
 <item name="android:windowBackground">@drawable/splash_bg</item>
 <item name="colorPrimary">@color/white</item>
 <item name="colorPrimaryDark">@color/black</item>
 <item name="colorAccent">@color/blue</item>
 <item name="actionBarSize">48dip</item>
 <item name="android:textColorPrimary">@color/black</item>
 <item name="toolbarNavigationButtonStyle">@style/myToolbarNavigationButtonStyle</item>
</style>

（2）自定義頂部top.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/top_all"
 android:layout_width="match_parent"
 android:background="@color/white"
 android:orientation="vertical"
 android:focusable="true"
 android:focusableInTouchMode="true"
 android:layout_height="wrap_content">
 <LinearLayout
  android:id="@+id/top_navigation"
  android:layout_width="fill_parent"
  android:layout_height="40dp"
  android:orientation="horizontal"
  android:background="@color/grey"
  android:gravity="center_vertical">
  <!--上方導(dǎo)航條返回按鈕-->
  <LinearLayout
   android:id="@+id/back_btn"
   android:layout_width="0dp"
   android:layout_weight="1"
   android:orientation="horizontal"
   android:gravity="center_vertical"
   android:layout_marginLeft="10dp"
   android:layout_height="match_parent">
   <ImageView
    android:layout_width="wrap_content"
    android:src="@drawable/back_btn"
    android:layout_marginLeft="5dp"
    android:layout_height="wrap_content" />
  </LinearLayout>
  <TextView
   android:id="@+id/navication_text"
   android:layout_width="0dp"
   android:layout_weight="5"
   android:layout_height="match_parent"
   android:layout_gravity="center"
   android:gravity="center"
   android:text="首頁(yè)"
   android:textColor="@color/font_title"
   android:textSize="17dp"/>
  <!--文字顯示-->
  <TextView
   android:id="@+id/second_transfer_text"
   android:layout_width="0dp"
   android:layout_weight="1"
   android:gravity="center"
   android:text="提交"
   android:textColor="@color/blue"
   android:visibility="invisible"
   android:textSize="@dimen/text_size_14"
   android:layout_height="match_parent" />
 </LinearLayout>
 <TextView
  android:layout_width="match_parent"
  android:background="@color/blue"
  android:layout_height="@dimen/px_2" />
</LinearLayout>

  (3)在BaseActivity中寫方法

protected void setTitle(Object title,Boolean right,Object rightContent) {
 try {
  TextView titleText=findViewById(R.id.navication_text);
  titleText.setText((String)title);
  //顯示右側(cè)的文字按鈕
  if(right){
   TextView rightText=findViewById(R.id.second_transfer_text);
   rightText.setVisibility(View.VISIBLE);
   rightText.setText((String)rightContent);
  }
 } catch (Exception e) {
  e.printStackTrace();
 }
}
/**
 * 設(shè)置點(diǎn)擊左上角的返回事件.默認(rèn)是finish界面
 */
protected void registerBack() {
 LinearLayout llLeft = findViewById(R.id.back_btn);
 llLeft.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View view) {
   BaseActivity.this.finish();
  }
 });
}

（4）繼承BaseActivity，xml包含includetop.xml然后直接執(zhí)行方法

<include layout="@layout/top"/>
setTitle("首頁(yè)",false,null)
registerBack()

4、總結(jié)

（1）好了，一個(gè)簡(jiǎn)單的底部菜單導(dǎo)航欄就做好了，是不是要比自己寫挨個(gè)的點(diǎn)擊事件要簡(jiǎn)單許多呢。

（2）在上里面的代碼中我們使用了矢量圖<Vector>功能，實(shí)現(xiàn)標(biāo)準(zhǔn)是美工提供.svg文件，通過studio直接轉(zhuǎn)為xml文件的圖片，優(yōu)勢(shì)是可伸縮和完美放大，體積小，需要知道一下。

相關(guān)文章

最新評(píng)論