I've tried to use BottomNavigationView in my app.
When I click icons fragments are displayed properly, but icons don't change their color when selected, icon of the first fragment stay colored. It looks like this whatever fragment I choose
Have I done anything wrong or the color of the icon of the selected fragment is adjusted separately?
My MainActivity:
public class MainActivity extends AppCompatActivity implements NavigationView.OnNavigationItemSelectedListener {
private Toolbar toolbar;
public static FloatingActionButton addDeadline;
BottomNavigationView bottomNavigationView;
FrameLayout frameLayout;
private HomeFragment homeFragment;
private RecyclerViewFragment recyclerViewFragment;
private HistoryFragment historyFragment;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main_drawer);
SharedPreferences preferences = PreferenceManager.getDefaultSharedPreferences(this);// language configuration
String lang = getResources().getConfiguration().locale.getDisplayLanguage(Locale.CHINESE);
Locale locale = new Locale(lang);
Locale.setDefault(locale);
Configuration config = new Configuration();
config.locale = locale;
getBaseContext().getResources().updateConfiguration(config, null);
toolbar = findViewById(R.id.toolbar_main);
setSupportActionBar(toolbar);
homeFragment = new HomeFragment();
recyclerViewFragment = new RecyclerViewFragment();
historyFragment = new HistoryFragment();
frameLayout = findViewById(R.id.main_frame);
bottomNavigationView = findViewById(R.id.navigation_view);
bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.nav_home:
addDeadline.show();
setFragment(homeFragment);
break;
case R.id.nav_deadlines:
addDeadline.show();
setFragment(recyclerViewFragment);
break;
case R.id.nav_history:
addDeadline.hide();
setFragment(historyFragment);
break;
}
return false;
}
});
addDeadline = findViewById(R.id.addTask);
addDeadline.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent();
intent.setClass(MainActivity.this, AddTaskActivity.class);
startActivityForResult(intent, INTENT_REQUEST_CODE);
}
});
DrawerLayout drawerLayout = findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
this, drawerLayout, toolbar, R.string.open, R.string.close);
drawerLayout.addDrawerListener(toggle);
toggle.syncState();
NavigationView navigationView = findViewById(R.id.navigation);
navigationView.setNavigationItemSelectedListener(this);
}
private void setFragment(Fragment fragment) {
FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
fragmentTransaction.replace(R.id.main_frame, fragment);
fragmentTransaction.commit();
}
@Override
public void onBackPressed() {
DrawerLayout drawer = findViewById(R.id.drawer_layout);
if (drawer.isDrawerOpen(GravityCompat.START)) {
drawer.closeDrawer(GravityCompat.START);
} else {
super.onBackPressed();
}
}
@SuppressWarnings("StatementWithEmptyBody")
@Override
public boolean onNavigationItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.labels:
startActivity(new Intent(this, TagsActivity.class));
return true;
case R.id.notifications:
// startActivity(new Intent(this, HistoryActivity.class));
return true;
case R.id.info:
// startActivity(new Intent(this, HistoryActivity.class));
return true;
}
DrawerLayout drawer = findViewById(R.id.drawer_layout);
drawer.closeDrawer(GravityCompat.START);
return true;
}
}
activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="@+id/activity_main"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation_view"
android:layout_width="match_parent"
android:layout_height="42dp"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:layout_gravity="bottom"
app:menu="@menu/bottom_navigation_bar" />
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:id="@+id/appBarLayout"
>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar_main"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<View xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="3dp"
android:layout_gravity="top"
android:background="@drawable/shadow_under"
android:layout_marginTop="56dp"/>
<FrameLayout
android:id="@+id/main_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="56dp"
android:layout_marginBottom="56dp">
<View xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="3dp"
android:layout_gravity="bottom"
android:background="@drawable/shadow_above"
android:layout_marginBottom="0dp"/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/addTask"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginTop="@dimen/fab_margin"
android:layout_marginEnd="@dimen/fab_margin"
android:layout_marginBottom="@dimen/fab_margin"
android:src="@drawable/ic_add"
app:fabSize="auto"
app:layout_constraintBottom_toTopOf="?attr/actionBarSize" />
</FrameLayout>
</RelativeLayout>
Inside OnNavigationItemSelectedListener implementation, make item.setChecked(true); for every case item
mBottomNavigationView.setOnNavigationItemSelectedListener(item -> {
switch (item.getItemId()) {
case R.id.action_overview:
item.setChecked(true);
mNavigationController.navigateToDashboardMainFragment();
break;
}
return false;
});
You should set the icon tint and text color to BottomNavigationView.
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation_view"
android:layout_width="match_parent"
android:layout_height="42dp"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:layout_gravity="bottom"
app:itemIconTint="@color/bottom_nav_color_state"
app:itemTextColor="@color/bottom_nav_color_state"
app:menu="@menu/bottom_navigation_bar" />
Create bottom-nav_color_state.xml
file at directory res/color
with following code:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/colorAccent" android:state_checked="true"/>
<item android:color="@color/colorPrimaryDark"/>
</selector>
If icon is not selected, it is showed in color colorPrimaryDark
. Otherwise colorAccent
will be the color.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With