uni-app iOS平台支持3D Touch快捷菜单项
uni-app iOS平台支持3D Touch快捷菜单项
iPhone6s(plus)设备已经支持3D Touch屏幕,HBuilder已支持添加应用的快捷菜单,效果如下:
## 配置快捷菜单项
打开应用的manifest.json文件,切换到代码视图,在plus -> distribute -> apple 下添加shortcuts节点,并配置各菜单项,数组中每项对应一个快捷菜单项:
```javascript
"shortcuts": [
{
"type": "share",
"title": "分 享",
"subtitle": "分享到微信、微博、QQ",
"icontype": "UIApplicationShortcutIconTypeShare"
},
{
"type": "about",
"title": "关 于",
"subtitle": "www.dcloud.io",
"iconfile": "sa.png",
"userinfo": {
"key3":"value3"
}
}
],
uni-app项目将以上数据添加到"app-plus"->“distribute”->"ios"节点下
其中各字段值规范如下:
- type: (必选)菜单项类型,字符串类型,用于标识菜单项
- title: (必选)菜单项上显示的标题,字符串类型
- subtitle: (可选)菜单项上显示的子标题,字符串类型
- icontype: (可选)菜单项上显示的图标类型,字符串类型,取值参考iOS官方文档UIApplicationShortcutIconType
- iconfile: (可选)菜单项上显示的图标文件,字符串类型,相对5+应用根目录路径,图标要求35x35分辨率,单色,参考Apple官方PS模板图
- userinfo: (可选)菜单项上的自定义数据,JSON格式
App中处理快捷菜单项
判断应用是否通过快捷菜单项启动
plus.runtime.launcher的值为"shortcut"表示应用从快捷菜单项启动,示例如下:
if(plus.runtime.launcher=='shortcut'){
// ...
}
判断快捷菜单项启动的参数
plus.runtime.arguments中保存所有快捷菜单项配置的值(JSON格式字符串),示例如下:
var cmd = JSON.parse(plus.runtime.arguments);
console.log("Shortcut-plus.runtime.arguments: "+plus.runtime.arguments)
var type=cmd&&cmd.type;
switch(type){
case 'share':
// 用户点击了‘share'菜单项
break;
case 'about':
// 用户点击了’about'菜单项
break;
default:
break;
}
plus.runtime.arguments的JSON格式字符串示例如下:
"{"type":"about","title":"关 于","subtitle": "www.dcloud.io","userinfo":{"key3":"value3"}}"
其中包括以下键值:
- type: 菜单项类型,字符串类型
- title: 菜单项上显示的标题,字符串类型
- subtitle: 菜单项上显示的子标题,字符串类型
- userinfo: 菜单项上的自定义数据
注:真机运行不生效,需提交App云端打包后才生效
实际用法参考HelloH5应用的“js/shortcut.js”
uni-app网友经验分享:https://ask.dcloud.net.cn/article/36103
在uni-app中,虽然原生开发对于iOS平台提供了较为丰富的API支持,包括3D Touch快捷菜单项(也被称为Peek and Pop或者Quick Actions),但在uni-app框架内直接实现这一功能需要一些额外的步骤和原生代码扩展。以下是一个基本的思路和代码示例,帮助你理解如何在uni-app中实现iOS平台的3D Touch快捷菜单项。
步骤概述
- 配置原生iOS项目:在Xcode中配置3D Touch快捷菜单项。
- 编写原生插件:创建一个uni-app原生插件来暴露这些快捷菜单项的回调。
- 在uni-app中调用插件:通过JavaScript调用原生插件来处理快捷菜单项的点击事件。
Xcode配置
首先,在Xcode中打开你的uni-app的iOS原生项目,然后在Info.plist
文件中添加快捷菜单项配置。例如:
<key>UIApplicationShortcutItems</key>
<array>
<dict>
<key>UIApplicationShortcutItemIconType</key>
<string>UIApplicationShortcutIconTypeCompose</string>
<key>UIApplicationShortcutItemTitle</key>
<string>New Message</string>
<key>UIApplicationShortcutItemType</key>
<string>com.example.app.new-message</string>
</dict>
</array>
原生插件开发
创建一个uni-app原生插件,用于处理3D Touch快捷菜单项的点击事件。这里是一个简单的示例:
// MyPlugin.m
#import <UniApp/UniAppPlugin.h>
@interface MyPlugin : NSObject <UniAppPlugin>
@end
@implementation MyPlugin
- (void)handleShortcutItem:(UIApplicationShortcutItem *)shortcutItem {
// 处理快捷菜单项点击事件
if ([shortcutItem.type isEqualToString:@"com.example.app.new-message"]) {
// 执行相应操作,比如打开一个页面
}
}
+ (void)registerPlugin:(UniModuleRegisterContext *)context {
[context registerModule:@"MyPlugin" withClass:[MyPlugin class]];
}
@end
在AppDelegate.m
中注册快捷菜单项点击事件的监听:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// ...
[UIApplication sharedApplication].shortcutItems = @[[self configureShortcutItemWithType:@"com.example.app.new-message" title:@"New Message" icon:UIApplicationShortcutIconTypeCompose]];
UIResponder *responder = [UIApplication sharedApplication].keyWindow.rootViewController;
while (responder) {
if ([responder respondsToSelector:@selector(handleShortcutItem:)]) {
SEL selector = NSSelectorFromString(@"handleShortcutItem:");
IMP imp = [responder methodForSelector:selector];
void (*func)(id, SEL, UIApplicationShortcutItem *) = (void *)imp;
func(responder, selector, launchOptions[UIApplicationLaunchOptionsShortcutItemKey]);
break;
}
responder = [responder nextResponder];
}
// ...
return YES;
}
注意:上述代码中的handleShortcutItem:
方法调用部分需要根据你的具体实现调整,这里仅作为示例。
在uni-app中调用
由于uni-app本身不直接支持3D Touch,你需要在原生层面处理完快捷菜单项点击后,通过原生插件或其他机制(如存储、网络请求等)通知uni-app应用进行相应的页面跳转或操作。