我在我的应用程序中添加了BottomNavigationView
。
main.xml中
<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:itemBackground="@color/colorPrimary"
app:itemIconTint="@color/white"
app:itemTextColor="@color/white"
app:menu="@menu/bottom_navigation_main" />
bottom_navigation_main.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_favorites"
android:enabled="true"
android:icon="@drawable/ic_favorite_white_24dp"
android:title="@string/text_favorites"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_schedules"
android:enabled="true"
android:icon="@drawable/ic_access_time_white_24dp"
android:title="@string/text_schedules"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_music"
android:enabled="true"
android:icon="@drawable/ic_audiotrack_white_24dp"
android:title="@string/text_music"
app:showAsAction="ifRoom" />
</menu>
MainActivity点击
bottomNavigationView.setOnNavigationItemSelectedListener(
new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.action_favorites:
//need change icon of favotites here.
case R.id.action_schedules:
case R.id.action_music:
}
return true;
}
});
我想更改所选位置底部导航的图标。当用户点击一个项目时,我们如何实现此功能?
(如果用户点击了一个项目,那么图标会变为另一个项目)
答案 0 :(得分:50)
您可以在drawable文件夹中创建可绘制选择器,并且可以根据视图中使用的窗口小部件的状态更改图像
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/calender_green" android:state_checked="true"/>
<item android:drawable="@drawable/calender_black" android:state_checked="false"/>
</selector>
答案 1 :(得分:31)
如果以上解决方案无法让您更改所选项目图标,请在代码中添加以下行:
bottomNavigationView.setItemIconTintList(null);
这将禁用所选项目图标的色调效果。
我遇到了同样的问题。我添加了选择器drawable,用于在选中/选中时更改BottomNavigationView项目的图标。
答案 2 :(得分:20)
您需要重置图标,然后在开关盒上只需要设置需要更改的图标,所以只有在选中时才会更改图标。
Menu menu = bottomNavigationView.getMenu();
menu.findItem(R.id.action_favorites).setIcon(favDrawable);
switch (item.getItemId()) {
case R.id.action_favorites:
item.setIcon(favDrawableSelected);
case R.id.action_schedules:
case R.id.action_music:
}
答案 3 :(得分:14)
好吧,我想了解如何使每个项目都有自己的形象,并且在对应该去哪里的评论中有些困惑,我想输入这个答案。
首先创建菜单及其项目。您的选择器将进入 ICON 值中的那些项目。这里我们有2个选择器,每个选择器都是为其菜单项创建的。
item
android:id="@+id/navigation_home"
android:icon="@drawable/navigation_home_selector"
android:title="@string/title_home" />
item
android:id="@+id/navigation_profile"
android:icon="@drawable/navigation_profile_selector"
android:title="@string/title_profile" />
现在这是您的选择器文件,该文件将保存在可绘制文件夹中。
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/menu_selected" android:state_checked="true"/>
<item android:drawable="@drawable/menu" android:state_checked="false"/>
</selector>
最后一步由@ KishanSolanki124
提供将此行代码添加到您的BottomNavigationView中。
BottomNavigationView.setItemIconTintList(null);
那里有。所有的作品都像魅力。
答案 4 :(得分:10)
我发现这是使用选择器可绘制的更好方法:-
首先,在可绘制文件夹中创建一个xml文件。 例如,可绘制文件夹中的xml文件名为child_selector.xml。
1,2
只需在bottom_navigation_main.xml的菜单项中添加child_selector:-
例如:android:icon =“ @ drawable / child_selector”
示例:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/child" android:state_checked="false"/>
<item android:drawable="@drawable/child_fill" android:state_checked="true"/>
</selector>
并且必须在您的活动中添加以下行-
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/navigation_child"
android:icon="@drawable/child_selector"
android:title="@string/title_child" />
</menu>
祝你好运。
答案 5 :(得分:6)
上面来自ajay singh https://stackoverflow.com/a/57248961/9793057的答案帮助了我,并采用了上面的答案。
res->可绘制文件夹(selector_stock_bottom_nav_view.xml)中的以下代码
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/button_and_tab_color" android:state_checked="true" />
<item android:color="@android:color/darker_gray" android:state_checked="false" />
</selector>
这些是我底部导航视图中的属性
<com.google.android.material.bottomnavigation.BottomNavigationView
app:itemIconTint="@drawable/selector_stock_bottom_nav_view" //To change icon color
app:itemTextColor="@drawable/selector_stock_bottom_nav_view" //To change text color
app:itemTextAppearanceActive="@style/stockBottomNavigationView.Active" //To change size of text during active state
app:itemTextAppearanceInactive="@style/stockBottomNavigationView.InActive"
app:menu="@menu/bottom_navigation_menu"
app:labelVisibilityMode="labeled"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
app:selectedBackgroundVisible="false"
android:id="@+id/stock_bottom_navigation"/>
我没有在代码中的任何地方使用“ BottomNavigationView.setItemIconTintList(null)”。
现在 这是最重要的代码 ,请确保在底部导航视图的监听器中返回“ TRUE”,即
private BottomNavigationView.OnNavigationItemSelectedListener stockBottomNavListener = new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
return true;
}
};
奖金:更改文本有效/无效状态的大小 将以下代码放入styles.xml文件中
<style name="stockBottomNavigationView.InActive" parent="@style/TextAppearance.AppCompat.Caption">
<item name="android:textSize">7sp</item>
</style>
<style name="stockBottomNavigationView.Active" parent="@style/TextAppearance.AppCompat.Caption">
<item name="android:textSize">8sp</item>
</style>
以上答案是来自stackoverflow中与底部导航视图,图标和文本的颜色/大小更改有关的各种答案的汇总。
答案 6 :(得分:3)
创建一个选择器并为每个状态指定drawable(例如,已检查和未检查状态)
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/calender_green" android:state_checked="true"/>
<item android:drawable="@drawable/calender_black" android:state_checked="false"/>
</selector>
答案 7 :(得分:1)
找到答案。我们可以使用
item.setIcon(R.drawable.icon_name)
更改图标..将尝试改变答案
bottomNavigationView.setOnNavigationItemSelectedListener(
new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.action_favorites:
//change the icon
item.setIcon(R.drawable.icon_name);
case R.id.action_schedules:
case R.id.action_music:
}
return true;
}
});
答案 8 :(得分:1)
感谢selector
方法对我有用(api v26
)
对于那些想知道如何以编程方式将其设置为未选择图标的人,可以考虑将其添加到OnNavigationItemSelectedListener
或switch(Java)
之前的when(Kotlin)
中: / p>
private val mOnNavigationItemSelectedListener = BottomNavigationView.OnNavigationItemSelectedListener { item ->
navigation.menu.getItem(0).setIcon(R.drawable.ic_tab_home)
navigation.menu.getItem(1).setIcon(R.drawable.ic_tab_account)
navigation.menu.getItem(2).setIcon(R.drawable.ic_tab_trading)
navigation.menu.getItem(3).setIcon(R.drawable.ic_tab_wallet)
when (item.itemId) {
R.id.navigation_home -> {
message.setText(R.string.title_home)
item.setIcon(R.drawable.ic_tab_home_active)
return@OnNavigationItemSelectedListener true
}
R.id.navigation_account -> {
message.setText(R.string.title_account)
item.setIcon(R.drawable.ic_tab_account_active)
return@OnNavigationItemSelectedListener true
}
R.id.navigation_trading -> {
message.setText(R.string.title_trading)
item.setIcon(R.drawable.ic_tab_trading_active)
return@OnNavigationItemSelectedListener true
}
R.id.navigation_wallet-> {
message.setText(R.string.title_wallet)
item.setIcon(R.drawable.ic_tab_wallet_active)
return@OnNavigationItemSelectedListener true
}
}
false
}
答案 9 :(得分:0)
在最新的材料设计库中,提供了BottomNavigation的默认行为,而无需提供属性itemIconTint
,它将自动对其进行管理。
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bottomNavigationView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:layout_alignParentBottom="true"
android:background="?android:attr/windowBackground"
app:itemBackground="@color/white"
app:itemTextColor="@color/textBlue"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="@menu/bottom_navigation"
app:labelVisibilityMode="labeled"
app:itemTextAppearanceActive="@color/colorPrimary"
/>
答案 10 :(得分:-1)
您可以使用此方法动态设置图标。
R.id.navigation_menu
是您R.menu.menu_bottom_navigation
中的商品ID。
val menuItem = bottomNavigationView.menu.findItem(R.id.navigation_menu)
menuItem.setIcon(R.drawable.ic_icon)