uni-app 3D Touch功能:iOS平台支持3D Touch快捷菜单项

发布于 1周前 作者 h691938207 来自 Uni-App

uni-app 3D Touch功能:iOS平台支持3D Touch快捷菜单项

1.配置3Dtouch

首先可以参考下官方的教程:http://ask.dcloud.net.cn/article/424?tdsourcetag=s_pctim_aiomsg

"shortcuts": [    
    {    
        "type": "share",    
        "title": "分 享",    
        "subtitle": "分享到微信、微博、QQ",    
        "icontype": "UIApplicationShortcutIconTypeShare"    
    },    
    {    
        "type": "about",    
        "title": "关 于",    
        "subtitle": "www.dcloud.io",    
        "iconfile": "sa.png",    
        "userinfo": {    
            "key3":"value3"    
        }    
    }    
]

2.处理3Dtouch 菜单点击

首先打开uniapp 根目录的 APP.VUEonLaunch 生命周期中插入如下代码

this.checkArguments(); // 检测启动参数 // 这是默认的监听参数 也就是应用初始化的时候监听  

// 监听后台恢复 这是利用5+的方式 处理 APP进入后台后 再进入到APP前台时参数监听  
plus.globalEvent.addEventListener('newintent', (e)=>{
            this.checkArguments(); // 检测启动参数  
});

3. 然后在 app.vue 新增处理启动参数的代码 : checkArguments

打开app.vue -->> methods 新增如下代码:

checkArguments() {  
    console.log('Shortcut-plus.runtime.launcher: ' + plus.runtime.launcher);  
    if (plus.runtime.launcher == 'shortcut') {  
        // 通过快捷方式启动,iOS平台表示通过3D Touch快捷方式,Android平台表示通过桌面快捷方式启动  
        try {  
            var cmd = JSON.parse(plus.runtime.arguments);  
            console.log('Shortcut-plus.runtime.arguments: ' + plus.runtime.arguments);  
            var type = cmd && cmd.type;  
            // 可以自行根据type 处理 你的业务逻辑  

            setTimeout(r => {  
                switch (type) {  
                    case 'scan':  
                        uni.scanCode({  
                            scanType: 'qrCode'  
                        });  
                        break;  
                    case 'search':  
                        uni.navigateTo({  
                            url: '/pages/search/index'  
                        });  
                        break;  
                    case 'shouyi':  
                        // 我的收益  
                        break;  
                    case 'agent':  
                        // 邀请好友  
                        break;    
                }  
            }, 800);  

            console.log(JSON.stringify(cmd));  
        } catch (e) {  
            console.log('Shortcut-exception: ' + e);  
        }  
    }  
},  

1 回复

在uni-app中实现iOS平台的3D Touch快捷菜单项功能,可以通过原生插件或者自定义原生模块的方式来实现。由于uni-app本身并没有直接提供对3D Touch的原生支持,我们需要借助iOS的原生开发能力(Swift或Objective-C)来实现这一功能,然后再将其封装成uni-app可以调用的模块。

以下是一个简化的示例,展示如何在iOS原生代码中实现3D Touch快捷菜单项,并将其集成到uni-app项目中。

iOS原生代码实现

  1. 创建一个新的Objective-C类(例如PeekPopHandler),用于处理3D Touch事件。
// PeekPopHandler.h
#import <UIKit/UIKit.h>

@interface PeekPopHandler : NSObject <UIViewControllerPreviewingDelegate>

@end

// PeekPopHandler.m
#import "PeekPopHandler.h"

@implementation PeekPopHandler

- (NSArray<UIViewControllerPreviewActionItem *> *)previewActionItemsForLocation:(CGPoint)location inViewController:(UIViewController *)viewController {
    UIViewControllerPreviewActionItem *action1 = [UIViewControllerPreviewActionItem actionWithTitle:@"Action 1" style:UIViewControllerPreviewActionStyleDefault handler:^(UIViewController *vc, UIViewControllerPreviewActionItem *actionItem) {
        // Handle action 1
    }];
    
    UIViewControllerPreviewActionItem *action2 = [UIViewControllerPreviewActionItem actionWithTitle:@"Action 2" style:UIViewControllerPreviewActionStyleSelected handler:^(UIViewController *vc, UIViewControllerPreviewActionItem *actionItem) {
        // Handle action 2
    }];
    
    return @[action1, action2];
}

@end
  1. 在AppDelegate中注册这个预览处理类
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // ... 其他初始化代码 ...
    
    self.window.rootViewController.previewingDelegate = [[PeekPopHandler alloc] init];
    
    return YES;
}
  1. 在需要支持3D Touch的视图控制器中,重写相关方法以启用预览和弹出
- (BOOL)canPerformAction:(SEL)action withSender:(id)sender {
    if (action == @selector(yourCustomAction)) {
        return YES;
    }
    return [super canPerformAction:action withSender:sender];
}

- (void)yourCustomAction {
    // 处理自定义动作
}

集成到uni-app

  1. 将上述iOS原生代码打包成uni-app的原生插件
  2. 在uni-app项目中引用该插件,并通过JS API调用相关功能。由于这部分涉及插件开发和JS与原生交互的复杂过程,这里不展开详述,但基本上你需要定义插件的接口,并在JS中通过plus.bridge.exec等方式调用。

请注意,上述代码仅作为示例,实际开发中可能需要根据具体需求进行调整和扩展。同时,由于Apple在iOS 13之后引入了Haptic Touch作为3D Touch的替代方案,你可能还需要考虑兼容性问题。

回到顶部