TabBar 的selecedImage无法显示设置图片问题 和item文字颜色选中设置

通过设置UIImageRenderingModeAlwaysOriginal解决TabBar选中图片不显示的问题,代码实现选中状态图片的正确显示和文字颜色变为红色。
UIImage 在呈现(render)时会选择对应的呈现方式(render mode),ios提供了3种render mode,分别是
意义
UIImageRenderingModeAutomatic 根据图片的使用位置自动调整渲染模式(默认值)
UIImageRenderingModeAlwaysOriginal 始终绘制图片原始状态,不适用tint color。
UIImageRenderingModeAlwaysTemplate 使用根据tint color绘制图片,忽略图片的颜色信息

设置选中的图片的render mode 为UIImageRenderingModeAlwaysOriginal就ok。

在item的viewController添加如下代码:

       self.tabBarItem.image=[UIImage imageNamed:@"findNormal"];
        self.tabBarItem.selectedImage=[UIImage imageNamed:@"findSelected.png"];
 
        UIImage *image = [self.tabBarItem.selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
        self.tabBarItem.selectedImage = image;
         [self.tabBarItem setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor redColor]} forState:UIControlStateSelected];
        

文字解决如下:在item的viewController添加如下代码


 [self.tabBarItem setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor redColor]} forState:UIControlStateSelected];

### UniApp TabBar 文字选中颜色设置方法 在UniApp项目中,TabBar是一个非常常用的组件,用于提供页面切换导航功能。默认情况下,TabBar文字选中颜色可能是固定的,但我们可以通过配置`tabBar`属性来自定义文字颜色样式。 #### 设置步骤: ##### 方法一:通过 manifest.json 配置 1. 打开项目的根目录下的 `manifest.json` 文件。 2. 进入 `"App Module"` 或者 `"HBuilderX App Setting"` 中找到 `“pages”` 节点内的 tabBar 相关配置部分。 3. 在 `list` 数组里的每一项中添加或修改 `selectedColor` 属性来指定文字选中状态时的颜色。 例如: ```json { "usingComponents": {}, "tabBar": { "color": "#000", // 默认未选中的字体颜色 "selectedColor": "#FF5A5F", // 选中的字体颜色 "borderStyle": "black", "backgroundColor": "#fff", "list": [ { "pagePath": "pages/index/index", "text": "首页" }, { "pagePath": "pages/logs/logs", "text": "日志" } ] } } ``` ##### 方法二:使用 CSS 自定义样式覆盖(对于更复杂的需求) 如果你需要进一步自定义样式,并且希望通过CSS控制,可以在小程序端利用条件渲染结合动态class的方式来实现效果,过这通常适用于较为特殊的情况,在大多数场景下推荐直接调整`manifest.json`中的配置即可满足需求。 注意:由于各个平台的小程序规范差异,建议开发者测试并确认各平台上的一致性兼容性问题。 --- 以上就是在UniApp中如何设置TabBar文字选中颜色的基本操作流程了。如果您还有其他关于UniApp的问题或是想了解更多信息,欢迎随时询问! --相关问题--: 1. 如何更改UniApp TabBar背景色其他样式? 2. 怎样在一个页面同时显示底部顶部的TabBar? 3. UniApp TabBar支持哪些动画效果及其如何启用? 希望这些信息对您有所帮助!如有清楚的地方,请告诉我我会尽力解答您的疑问。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值