跳转到主要内容
推送通知图标是与通知一起显示的小图像。它们帮助用户快速识别您的品牌、理解上下文并将您的消息与其他消息区分开来。每个平台处理图标的方式不同,因此遵循特定于平台的标准对于确保通知正确显示至关重要。 本指南涵盖推送通知图标。如果您正在寻找大图像,请参阅图像和富媒体。

​
推送通知图标的最佳实践

  • 尽可能使用带透明度的 PNG 图像。
  • 保持图标简单且在非常小的尺寸下可识别。
  • 避免使用可能变得难以辨认的文本或精细细节。
  • 遵循特定于平台的规则,包括尺寸、颜色和透明度。
  • 在跨平台和操作系统版本的真实设备上测试通知。

​
Web 通知图标

Web 推送通知显示在发送时提供的图标或在您的网站设置中定义为默认的图标。
  • 支持的格式:PNG、JPG、GIF(非动画)
  • 图标必须是正方形。推荐尺寸为 256x256 像素。
不同的浏览器(Chrome、Edge、Safari、Firefox)可能会根据设备和操作系统以不同方式裁剪或缩放图标。建议使用正方形 256x256 图标以确保在所有浏览器上的一致显示。
在您的仪表板设置 > 推送和应用内 > Web 设置中设置默认图标。 您还可以使用仪表板或 REST API 为每个通知覆盖图标。有关详细信息,请参阅使用非默认图标发送通知。

​
Android Web 推送徽章图标

在 Android 设备上,Web 推送通知可能会显示由 Web 应用清单 badge 属性定义的较小徽章图标。徽章图标用于有限的 UI 上下文(例如 Android 状态栏),并且可能不会在所有 Android 设备上显示。 虽然徽章图标不受与 Android 应用小通知图标相同的严格仅 alpha 规则的约束,但它们仍在系统控制的 UI 中呈现。 最佳实践:
  • 使用带透明背景的正方形 PNG
  • 保持设计简单且高对比度
  • 避免文本或精细细节
  • 使用单色或最少颜色以获得最佳一致性
建议最小尺寸为 72×72 像素。可以接受更大的图像,并将根据需要缩小。
与 Android 应用小通知图标不同,Web 推送徽章图标可能在某些设备上保留颜色。但是,全彩或复杂图标可能会根据 Android 版本、浏览器和设备制造商而呈现不一致。
有关详细信息,请参阅使用非默认图标发送通知。

​
iOS 通知图标

iOS 通知始终使用您的应用图标。
  • 通知图标自动从您应用的图标资源派生
  • 您无法为每条消息更改通知图标
  • 更改图标需要更新您的应用图标并发布新的应用版本
iOS 上没有 APNs 有效负载字段允许您指定自定义通知图标。此行为由 iOS 强制执行,适用于标准推送通知、关键警报和实时活动。

​
通信通知

在 iOS 15 及更高版本上,Apple 支持通信通知。 正确实现后,通信风格的通知(例如消息或通话应用)可能会在受支持的系统视图中显示联系人或发送者图像而不是应用图标。
通信通知仅限于特定用例,并需要明确采用 Apple 的通信通知 API。它们不适用于通用通知。

​
Android 通知图标

Android(包括 Amazon 和华为设备)支持小和大通知图标。 Android 还支持对话通知,允许您将图标更改为用户的个人资料图像。
在 Android 8.0+(API 26+)上,通知外观受系统 UI、通知渠道和设备制造商自定义的严重影响。
Android 通知图标位置

​
小通知图标

小通知图标显示在状态栏和通知的左上角。如果未提供自定义小图标,OneSignal 将显示默认的铃铛图标。 Android 使用图标的 alpha 通道而不是其颜色数据来呈现小通知图标。系统在显示图标时应用自己的色调(或您配置的强调色)。 要求和最佳实践:
  • 在透明背景上使用单色剪影图标
  • 设计图标时使形状由透明度定义,而不是颜色
  • 避免渐变、阴影或多色艺术作品
  • 保持设计简单且在非常小的尺寸下可识别
一种常见且推荐的方法是将图标设计为透明背景上的白色艺术作品,但从技术上讲,Android 使用的是 alpha 掩码,而不是白色本身。
具有实心背景或全彩艺术作品的图标可能会呈现不正确——通常显示为白色方块、裁剪形状或意外的剪影——具体取决于设备制造商和 Android 版本。Android 通常会忽略小通知图标中的颜色信息,并从 alpha 通道和系统或应用定义的着色中派生最终外观。

​
小图标强调色

您可以更改通知小图标周围显示的颜色。
要设置默认颜色,请将以下行添加到项目中的 res/values/strings.xml 文件中。 如果您想为深色模式设置不同的颜色,也可以将键添加到 res/values-night/strings.xml 中。 使用 HEX 值。使用 Android Asset Studio 配色方案获取帮助。 
<resources>
    <string name="onesignal_notification_accent_color">FF00FF00</string>
</resources>
要基于每个通知设置颜色,请在我们的创建通知 API 调用中设置 android_accent_color,或在”消息 > 新推送 > 平台设置 > Google Android 选项”下的”强调色”字段中输入值。
如果您最近刚向应用添加了图标资源,您可能需要等待几天才能使用该图标发送通知。这是因为大多数用户可能需要数天甚至数周才能将其应用更新到包含新图标的最新版本。

​
自定义非 alpha 通道小图标图像

某些设备制造商会按原样显示图像(忽略 alpha 通道规则)。如果您希望在所有设备上使用非 alpha 通道图像,可以根据 Android 的文档设置自定义通知布局。 我们强烈建议遵循 alpha 规则,因为图标在所有设备上可能看起来不一致。Google 这样设计是有原因的——图标太小,看不到任何有意义的细节,因此强制使用单一颜色有助于一眼就能识别图标。

​
大通知图标

大图标显示在 Android 通知的右侧。
  • 推荐尺寸:256×256 像素
  • 格式:PNG 或 JPG
  • 如果未设置,Android 可能会重用小图标

​
如何添加 Android 默认图标

我们强烈建议为每个基于 Android 的应用(Google Play、Amazon、华为)配置默认通知图标。缺失或配置不正确的图标是通知呈现损坏的最常见原因。 Android 支持两个默认图标:
  • 小通知图标(必需)
  • 大通知图标(可选但推荐)
1

生成小通知图标

小通知图标显示在状态栏和通知标题中。要求:
  • 单色剪影图标
  • 透明背景(需要 alpha 通道)
  • 无颜色、渐变或阴影
一种常见且推荐的方法是透明背景上的白色图标,但 Android 使用的是 alpha 通道,而不是白色本身。
生成符合要求的小图标的最快最安全的方法是使用 Android Asset Studio – 通知图标。
图标名称: ic_stat_onesignal_default
2

创建所需的小图标尺寸

必需:您必须包含小图标的所有密度变体。缺少任何尺寸都可能导致 Android 回退到系统默认图标。
图标名称密度 (dp)尺寸 (px)
ic_stat_onesignal_defaultMDPI24x24
ic_stat_onesignal_defaultHDPI36x36
ic_stat_onesignal_defaultXHDPI48x48
ic_stat_onesignal_defaultXXHDPI72x72
ic_stat_onesignal_defaultXXXHDPI96x96
3

生成大通知图标(可选)

最佳实践:
  • 正方形图像
  • PNG 或 JPG
  • 推荐透明背景
  • 推荐尺寸:256×256 px
与小图标不同:
  • 允许颜色
  • 不需要仅 alpha
  • 只需要一个尺寸
所需文件名: ic_onesignal_large_icon_default.png
4

将图标放置在正确的项目路径中

每个图标必须放置在适合您框架的正确资源目录中。确保以下路径存在;创建您缺少的任何文件夹。必需:每个图像必须存在于以下路径中:
  • res/drawable-mdpi/ (24x24)
  • res/drawable-hdpi/ (36x36)
  • res/drawable-xhdpi/ (48x48)
  • res/drawable-xxhdpi/ (72x72)
  • res/drawable-xxxhdpi/ (96x96)
  • res/drawable-xxxhdpi/ (256x256) (Large Icon)
您的项目应类似于此(取决于您的 SDK):
如果您看到实心方块而不是图标,则图像没有正确的透明度。
如果您看到 OneSignal 铃铛图标,则一个或多个所需的小图标尺寸缺失或放置在错误的目录中。
您的 Android 应用现在已正确配置默认通知图标。

​
使用非默认图标发送通知

从 OneSignal 仪表板或 REST API 发送推送通知时,您可以使用自定义图标覆盖 Android、Amazon、华为和 Web 推送通知的默认图标。您无法覆盖 iOS 通知的图标。

​
REST API 参数

Android、Amazon 和华为 REST API 参数:
​
small_icon
string
Amazon: adm_small_icon Huawei: huawei_small_icon对于小图标,图像必须存在于与默认小图标相同的项目路径中。它不能使用远程 URL。有关添加自定义图标的位置的详细信息,请参阅如何添加 Android 默认图标。在 REST API 参数中设置图标名称时不包含文件扩展名。示例: "small_icon": "my_custom_icon_name_without_extension"
​
large_icon
string
Amazon: adm_large_icon Huawei: huawei_large_icon对于大图标,图像可以存在于与默认大图标相同的项目路径中,也可以作为远程 URL。有关添加自定义图标的位置的详细信息,请参阅如何添加 Android 默认图标。在 REST API 参数中设置图标名称时不包含文件扩展名。示例: "large_icon": "my_custom_icon_name_without_extension"
Web 推送 REST API 参数:
​
chrome_web_icon
string
Firefox: firefox_icon图像资源的 URL。必须是图像资源的直接 URL。示例: "chrome_web_icon": "https://example.com/my_custom_icon.png"
​
chrome_web_badge
string
图像资源的 URL。必须是图像资源的直接 URL。示例: "chrome_web_badge": "https://example.com/my_custom_icon.png"

​
仪表板

在 OneSignal 仪表板中,使用消息 > 推送 > 新推送表单或模板,导航到特定于平台的选项。 对于 Android、Amazon 和华为,如果文件存在于与默认图标相同的项目路径中,请设置图标名称时不包含文件扩展名。对于大通知图标,您还可以提供将显示图标的直接 URL。