依赖
//注意 这个版本之前的依赖会有切换横屏时Fragment错位的bug
implementation 'androidx.viewpager2:viewpager2:1.1.0-alpha01'
使用
# Xml
<androidx.viewpager2.widget.ViewPager2
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<com.csmar.college.widget.BottomNavigationView
android:id="@+id/bnv"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
# Adapter
public class MainFragmentStateAdapter extends FragmentStateAdapter {
private List<Fragment> fragmentList;
public MainFragmentStateAdapter(@NonNull FragmentActivity fragmentActivity, List<Fragment> fragmentList) {
super(fragmentActivity);
this.fragmentList = fragmentList;
}
@NonNull
@Override
public Fragment createFragment(int position) {
return fragmentList == null ? null : fragmentList.get(position);
}
@Override
public int getItemCount() {
return fragmentList == null ? 0 : fragmentList.size();
}
}
# Activity
private ViewPager2 viewPager2;
private BottomNavigationView bottomNavigationView;
private MainFragmentStateAdapter mAdapter;
private List<Fragment> fragmentList = new ArrayList<>();
@Override
protected void initView() {
viewPager2 = findViewById(R.id.view_pager);
bottomNavigationView = findViewById(R.id.bnv);
}
@Override
protected void initListener() {
viewPager2.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
super.onPageScrolled(position, positionOffset, positionOffsetPixels);
LogUtil.e(TAG, "viewpage " + position + " " + positionOffset + " " + positionOffsetPixels);
}
@Override
public void onPageSelected(int position) {
super.onPageSelected(position);
LogUtil.e(TAG, "viewpage " + position);
bottomNavigationView.setSelectedItemId(position);
}
@Override
public void onPageScrollStateChanged(int state) {
super.onPageScrollStateChanged(state);
}
});
bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public void onNavigationItemSelected(int position) {
LogUtil.e(TAG, "bottom " + position);
viewPager2.setCurrentItem(position);
}
});
}
@Override
protected void initData() {
viewPager2.setUserInputEnabled(false); // 是否禁止滑动
viewPager2.setOffscreenPageLimit(2); // viewpage2 源码中预加载数量为-1，而viewpage 为1
fragmentList.add(new Fragment1());
fragmentList.add(new Fragment2());
fragmentList.add(new Fragment3());
mAdapter = new MainFragmentStateAdapter(this, fragmentList);
viewPager2.setAdapter(mAdapter);
}
BottomNavigationView
/**
* 自定义底部导航栏
*/
public class BottomNavigationView extends LinearLayout implements View.OnClickListener {
private View viewRoot;
private LinearLayout indexLin;
private LinearLayout lcLin;
private LinearLayout wdLin;
private ImageView indexImg;
private TextView indexTxt;
private ImageView lcImg;
private TextView lcTxt;
private ImageView wdImg;
private TextView wdTxt;
private BottomNavigationView.OnNavigationItemSelectedListener selectedListener;
public BottomNavigationView(Context context) {
this(context, null);
}
public BottomNavigationView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
public BottomNavigationView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initLayout();
}
private void initLayout() {
if (getContext() != null) {
viewRoot = inflate(getContext().getApplicationContext(), R.layout.bottom_navigation_view, this);
indexLin = viewRoot.findViewById(R.id.index_lin);
lcLin = viewRoot.findViewById(R.id.lc_lin);
wdLin = viewRoot.findViewById(R.id.wd_lin);
indexImg = viewRoot.findViewById(R.id.index_img);
indexTxt = viewRoot.findViewById(R.id.index_txt);
lcImg = viewRoot.findViewById(R.id.lc_img);
lcTxt = viewRoot.findViewById(R.id.lc_txt);
wdImg = viewRoot.findViewById(R.id.wd_img);
wdTxt = viewRoot.findViewById(R.id.wd_txt);
indexLin.setOnClickListener(this);
lcLin.setOnClickListener(this);
wdLin.setOnClickListener(this);
}
}
/**
* 设置 item 点击事件
* @param listener
*/
public void setOnNavigationItemSelectedListener(@Nullable BottomNavigationView.OnNavigationItemSelectedListener listener) {
this.selectedListener = listener;
}
/**
* 设置选中的 item
*
* @param position 下标
*/
public void setSelectedItemId(int position) {
switch (position) {
case 0 :
indexImg.setSelected(true);
indexTxt.setSelected(true);
lcImg.setSelected(false);
lcTxt.setSelected(false);
wdImg.setSelected(false);
wdTxt.setSelected(false);
break;
case 1 :
indexImg.setSelected(false);
indexTxt.setSelected(false);
lcImg.setSelected(true);
lcTxt.setSelected(true);
wdImg.setSelected(false);
wdTxt.setSelected(false);
break;
case 2 :
indexImg.setSelected(false);
indexTxt.setSelected(false);
lcImg.setSelected(false);
lcTxt.setSelected(false);
wdImg.setSelected(true);
wdTxt.setSelected(true);
break;
}
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.index_lin:
if (selectedListener != null) {
selectedListener.onNavigationItemSelected(0);
setSelectedItemId(0);
}
break;
case R.id.lc_lin :
if (selectedListener != null) {
selectedListener.onNavigationItemSelected(1);
setSelectedItemId(1);
}
break;
case R.id.wd_lin :
if (selectedListener != null) {
selectedListener.onNavigationItemSelected(2);
setSelectedItemId(2);
}
break;
}
}
/**
* item 选择监听器
*/
public interface OnNavigationItemSelectedListener {
void onNavigationItemSelected(int position);
}
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@color/colorWhile"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="@+id/index_lin"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="1"
android:gravity="center"
android:paddingTop="@dimen/dp_20"
android:paddingBottom="@dimen/dp_18"
android:layout_height="match_parent">
<ImageView
android:id="@+id/index_img"
android:src="@drawable/select_home_index_img"
android:layout_width="@dimen/dp_43"
android:layout_height="@dimen/dp_43"/>
<TextView
android:id="@+id/index_txt"
android:checked="true"
android:textColor="@drawable/select_bottom_navigation_txt"
android:layout_marginTop="@dimen/dp_9"
android:text="@string/home_index"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
</LinearLayout>
<LinearLayout
android:id="@+id/lc_lin"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="1"
android:gravity="center"
android:paddingTop="@dimen/dp_20"
android:paddingBottom="@dimen/dp_18"
android:layout_height="match_parent">
<ImageView
android:id="@+id/lc_img"
android:src="@drawable/select_home_money_img"
android:layout_width="@dimen/dp_45"
android:layout_height="@dimen/dp_45"/>
<TextView
android:id="@+id/lc_txt"
android:textColor="@drawable/select_bottom_navigation_txt"
android:layout_marginTop="@dimen/dp_9"
android:text="@string/home_money"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
</LinearLayout>
<LinearLayout
android:id="@+id/wd_lin"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="1"
android:gravity="center"
android:paddingTop="@dimen/dp_20"
android:paddingBottom="@dimen/dp_18"
android:layout_height="match_parent">
<ImageView
android:id="@+id/wd_img"
android:src="@drawable/select_home_wd_img"
android:layout_width="@dimen/dp_39"
android:layout_height="@dimen/dp_40"/>
<TextView
android:id="@+id/wd_txt"
android:layout_marginTop="@dimen/dp_9"
android:text="@string/home_wd"
android:textColor="@drawable/select_bottom_navigation_txt"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
</LinearLayout>
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@mipmap/icon_home_index_pre"/>
<item android:state_pressed="true" android:drawable="@mipmap/icon_home_index_pre" />
<item android:state_selected="true" android:drawable="@mipmap/icon_home_index_pre"/>
<item android:drawable="@mipmap/icon_home_index" />
</selector>
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="@color/color_3399FF"/>
<item android:state_pressed="true" android:color="@color/color_3399FF" />
<item android:state_selected="true" android:color="@color/color_3399FF"/>
<item android:color="@color/color_666666" />
</selector>
