使用CPNowPlayingImageButton时CarPlay深色模式下NowPlaying界面图片显示异常

问题根因 #

你遇到的两个异常（外观切换不生效、图片尺寸过小）都来自两个核心配置错误：

1. 初始化UIImage时指定了当前时刻的carTraitCollection，拿到的是对应当前外观的静态图片，不会跟随后续系统外观变化自动切换
2. 图片资源的尺寸不符合CarPlay按钮要求，且未正确配置资源的明暗外观适配规则

修复步骤 #

1. 配置ImageAsset资源

打开你的carplay_heart图片资源：

• 右侧属性面板中「外观」选择「任意、浅色、深色」，分别对应导入浅色模式下的黑色图、深色模式下的白色图
• 「渲染模式」选择「默认」即可，无需手动设置为模板图像
• 确保各倍率图片尺寸符合要求：@2x图不小于120120px，@3x图不小于180180px

2. 修改按钮初始化代码

不要传入固定的TraitCollection获取静态图片，让UIImage自动响应环境变化：

UIImage* image = [UIImage imageNamed:@"carplay_heart"];
// 强制使用原始渲染模式，避免系统自动修改图片色调
image = [image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

CPNowPlayingImageButton* button = [CPNowPlayingImageButton.alloc initWithImage:image handler:^(CPNowPlayingImageButton* btn) {
    JPlaylistUtils::CurrentToggleFavorite(FALSE, TRUE, nil);
}];

[CPNowPlayingTemplate.sharedTemplate updateNowPlayingButtons:@[button]];

3. 监听外观变化主动更新按钮

在你的CPInterfaceController子类中实现TraitCollection变化监听，外观切换时主动刷新按钮：

- (void)traitCollectionDidChange:(UITraitCollection *)previousTraitCollection {
    [super traitCollectionDidChange:previousTraitCollection];
    if (@available(iOS 14.0, *)) {
        // 判断是否是颜色外观发生变化
        if ([previousTraitCollection hasDifferentColorAppearanceComparedToTraitCollection:self.carTraitCollection]) {
            // 调用你封装的生成并更新自定义按钮的方法即可
            [self updateNowPlayingCustomButtons];
        }
    }
}

内容的提问来源于stack exchange，提问作者toto263