版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010724819/article/details/78075105
如题,这种效果大家实现起来可能并不难,但是我实现的时候遇到了一个坑,所以分享出来了。
先看看要达到的效果,类似于淘宝这种:
具体的请大家移步博客:关于安卓APP底栏点击第一次选中当前Fragment第二次点击更新当前页面
可能有的同学遇不到这种问题,使用RadioButton添加点击事件,然后记录每次选择的底栏index,下次如果相同,则去更新,但是我利用的是另一种实现办法,遇到了坑:
页面如下:
<?xml version="1.0" encoding="utf-8"?>
<layout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
>
<data></data>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false"
android:orientation="vertical">
<include
android:id="@+id/rl_title"
layout="@layout/view_headlayout"/>
<FrameLayout
android:id="@+id/main_fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/rl_title"
android:layout_marginBottom="65dp"/>
<LinearLayout
android:id="@+id/main_bottome_switcher_container"
android:layout_width="match_parent"
android:layout_height="65dp"
android:layout_alignParentBottom="true"
android:background="@color/colorTitleBlack"
android:clipChildren="false"
android:gravity="bottom"
android:orientation="horizontal">
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@color/colorTitleBlack">
<ImageView
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dp"
android:background="@android:color/transparent"
android:src="@drawable/store_selector"/>
<TextView
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_gravity="bottom"
android:gravity="center"
android:text="商城"
android:textColor="@color/main_bottom_tv_color"/>
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@color/colorTitleBlack">
<TextView
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_gravity="bottom"
android:gravity="center"
android:text="学习平台"
android:textColor="@color/main_bottom_tv_color"/>
<ImageView
android:id="@+id/imageView"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dp"
android:background="@android:color/transparent"
android:src="@drawable/study_selector"/>
</FrameLayout>
<FrameLayout
android:id="@+id/ll_first"
android:layout_width="0dp"
android:layout_height="90dp"
android:layout_weight="1"
android:background="@android:color/transparent"
android:clipChildren="false">
<TextView
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_gravity="bottom"
android:gravity="center"
android:text="视频"
android:textColor="@color/main_bottom_tv_color"/>
<ImageView
android:id="@+id/iv_circle_video"
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="@android:color/transparent"
android:src="@drawable/video_selector"/>
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@color/colorTitleBlack"
android:visibility="gone">
<ImageView
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@android:color/transparent"
android:src="@drawable/live_selector"/>
<TextView
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_gravity="bottom"
android:gravity="center"
android:text="直播"
android:textColor="@color/main_bottom_tv_color"/>
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@color/colorTitleBlack">
<ImageView
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dp"
android:background="@android:color/transparent"
android:src="@drawable/robot_selector"/>
<TextView
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_gravity="bottom"
android:gravity="center"
android:text="语音"
android:textColor="@color/main_bottom_tv_color"/>
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@color/colorTitleBlack">
<ImageView
android:layout_width="match_parent"
android:layout_height="32dp"
android:layout_marginTop="5dp"
android:background="@android:color/transparent"
android:src="@drawable/person_selector"/>
<TextView
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_gravity="bottom"
android:gravity="center"
android:text="个人中心"
android:textColor="@color/main_bottom_tv_color"/>
</FrameLayout>
</LinearLayout>
</RelativeLayout>
</layout>
java切换逻辑是这样的:
// fragment的切换
private void startFragmentAdd(int index) {
switch (index) {
case 0:
initTitle("淘宝", false);
break;
case 1:
initTitle("学习平台", true);
break;
case 2:
initTitle("视频", true);
break;
case 3:
initTitle("直播", false);
break;
case 4:
initTitle("聊天机器人", true);
break;
case 5:
initTitle("个人中心", false);
break;
}
Fragment fragment = fragments.get(index);
FragmentManager fragmentManager = getSupportFragmentManager();
FragmentTransaction fragmentTransaction = fragmentManager
.beginTransaction();
if (current_fragment == null) {
fragmentTransaction.add(R.id.main_fragment_container, fragment).commit();
current_fragment = fragment;
}
if (current_fragment != fragment) {
// 先判断是否被add过
if (!fragment.isAdded()) {
// 隐藏当前的fragment,add下一个到Activity中
fragmentTransaction.hide(current_fragment)
.add(R.id.main_fragment_container, fragment).commit();
} else {
// 隐藏当前的fragment,显示下一个
fragmentTransaction.hide(current_fragment).show(fragment)
.commit();
}
current_fragment = fragment;
}
}
//切换Fragment(会重新加载页面)
private void changeFragments(int index) {
Fragment fragment = fragments.get(index);
if (fragments.get(index).isAdded()) {
}
getSupportFragmentManager()
.beginTransaction()
.replace(R.id.main_fragment_container, fragment)
.commit();
}
//通过点击的时候来改变底部导航栏的UI
private void changeUI(int index) {
// ToastUtil.showText(MainActivity.this, index + "");
// if (index == 2) {
// binding.civVideo.setImageResource(R.mipmap.video_on);
// } else {
// binding.civVideo.setImageResource(R.mipmap.video_off);
// }
int childCount = binding.mainBottomeSwitcherContainer.getChildCount();
for (int i = 0; i < childCount; i++) {
if (i == index) {
setEnable(binding.mainBottomeSwitcherContainer.getChildAt(i), false);
} else {
setEnable(binding.mainBottomeSwitcherContainer.getChildAt(i), true);
}
}
}
/**
* 将每个Item中的所用控件状态一同改变
* 由于我们处理一个通用的代码,那么Item可能会有很多层,所以我们需要使用递归
*
* @param item
* @param b
*/
private void setEnable(View item, boolean b) {
item.setEnabled(b);
if (item instanceof ViewGroup) {
int childCount = ((ViewGroup) item).getChildCount();
for (int i = 0; i < childCount; i++) {
setEnable(((ViewGroup) item).getChildAt(i), b);
}
}
}
相信聪明的同学已经能够看出来了吧,问题就出在setEnable上,嗯。只要一次被置为false,之后都不会被相应到相应的事件了。
技术无罪,分享体现价值,就吐槽到这里,继续博客,上面的问题出在整个布局我要实现单选,就必须使用上面的逻辑去判断,导致第二次点击不被响应。所以呢,我们使用RadioGroup加RadioButton的方式去实现,因为RadioButton的单选属性,所以我们只需要去关注二次点击就可以了。
页面如下:
布局代码如下:
<?xml version="1.0" encoding="utf-8"?>
<layout
xmlns:android="http://schemas.android.com/apk/res/android">
<data>
</data>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<winning.zhihuibj.view.widget.NoScrollViewPager
android:id="@+id/vp_content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</winning.zhihuibj.view.widget.NoScrollViewPager>
<RadioGroup
android:id="@+id/rg_bt_bg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@mipmap/bottom_tab_bg"
android:orientation="horizontal">
<RadioButton
android:id="@+id/rb_home"
style="@style/RBStyle"
android:drawableTop="@drawable/home_press"
android:text="首页"
/>
<RadioButton
android:id="@+id/rb_news_center"
style="@style/RBStyle"
android:drawableTop="@drawable/news_press"
android:text="新闻中心"
/>
<RadioButton
android:id="@+id/rb_smart_service"
style="@style/RBStyle"
android:drawableTop="@drawable/smart_service_press"
android:text="智慧服务"
/>
<RadioButton
android:id="@+id/rb_govaffaiirs"
style="@style/RBStyle"
android:drawableTop="@drawable/gov_press"
android:text="政务"
/>
<RadioButton
android:id="@+id/rb_settings"
style="@style/RBStyle"
android:drawableTop="@drawable/settings_press"
android:text="设置"
/>
</RadioGroup>
</LinearLayout>
</layout>
在java代码中,这样响应事件就可以了(不但监听RadioGroup的heckedChangeListener),同时监听每个RadioButton的点击事件。
RadioButton radioButton = (RadioButton) view.findViewById(R.id.rb_news_center);
radioButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
}
});
enableSlidingMenu(false);
//RadioGroup的选中监听
rg_bt_bg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch (checkedId) {
case R.id.rb_home:
mViewPager.setCurrentItem(0, false);
enableSlidingMenu(false);
break;
case R.id.rb_news_center:
mViewPager.setCurrentItem(1, false);
enableSlidingMenu(true);
break;
case R.id.rb_smart_service:
mViewPager.setCurrentItem(2, false);
enableSlidingMenu(true);
break;
case R.id.rb_govaffaiirs:
mViewPager.setCurrentItem(3, false);
enableSlidingMenu(true);
break;
case R.id.rb_settings:
mViewPager.setCurrentItem(4, false);
enableSlidingMenu(false);
break;
}
}
});
//Viewpager的选中监听
mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
pagers.get(position).initData();
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
好好学习,天天运动,技术无罪,加油!