通知面板 UI 设计问题 - Expo Push Notifications

Posted 2023-05-06

【中文标题】通知面板 UI 设计问题 - Expo Push Notifications

【英文标题】：Notification panel UI design issues - Expo Push Notifications

【发布时间】：2021-08-22 09:24:09

【问题描述】：

我正在使用 react native 和 expo 开发应用程序，我必须在应用程序中实现推送通知。到目前为止，发送和接收通知没有问题，但我的问题主要与推送通知面板上的 UI 设计有关：

以下是我的简单通知消息配置：

scheduleNotificationAsync(
content: 
title: “You’ve got mail! :mailbox_with_mail:”,
body: ‘Here is the notification body’,
data:  data: ‘goes here’ ,
,
)

有没有办法设计多行通知？ 我可以使用标题、副标题（仅适用于 ios），但我想在正文部分使用多行。我尝试在正文中使用 \n，但它不起作用。 在通知中按下按钮时如何导航到应用程序中的特定屏幕？ 我设置了如下示例类别：

Notifications.setNotificationCategoryAsync(“daily_question”, [

actionId: “yes”,
buttonTitle: “Yes”,
,

actionId: “no”,
buttonTitle: “No”,
,
]);

我想在按下“是/否”按钮后导航到特定屏幕，但我无法弄清楚/无法找出如何在配置中编写任何操作代码。

有什么方法可以将通知面板内容 UI 部分设计为 html/jsx 代码，以便更好地控制 UI 的外观？

有没有办法在通知界面中添加图像/表格类的组件？

似乎正在考虑将图像添加到推送通知中。 关于使用博览会通知实现上述几点的任何指针/指导？

如果展会通知，无法实现上述功能，那么我的选择是什么？

谢谢

【参考方案1】：

你有很多问题，但我可以回答其中的一些。

“我想在按下“是/否”按钮后导航到特定屏幕......”

要在是/否时导航到特定屏幕，您应该检查包含“管理通知类别”的此链接，并且有一些有用的功能可以实现该行为。我留下下面的链接。如果您很难找到确切的方法在这里写一条评论，那么我会留下详细的解释。

https://docs.expo.dev/versions/latest/sdk/notifications/#managing-notification-categories-interactive-notifications

“有什么方法可以将通知面板内容 UI 部分设计为...”

在expo管理的项目中，通知面板的UI设计几乎是不可能的

“有没有办法在通知界面中添加图像/表格类型的组件”

在 Expo 管理的项目中，没有将图像添加到通知面板的选项，您应该弹出项目来执行此操作。

“如果展会通知，无法实现 [...] 是我的选择”

您应该退出项目并开始编写本机代码，如果您是 react-native 和 expo 的新手，不建议这样做。 但是，如果您弹出到一个裸项目，那么您将拥有对应用程序的完全访问权限，并且您可以修改需要本机代码的所有内容。

建议：尝试了解您可以对托管项目和裸项目做什么，然后您将了解可以修改哪些内容和不能修改哪些内容。我在下面的链接中留下了对差异的完整解释。

https://docs.expo.dev/introduction/managed-vs-bare/