uni-app 原生插件 求助 有偿

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

uni-app 原生插件 求助 有偿

3 回复

加q:597533841 聊聊?

当然,对于uni-app原生插件的开发,理解其基本结构和集成流程是关键。以下是一个简单的示例,展示如何创建一个uni-app原生插件,并在应用中调用它。此示例将创建一个简单的原生插件,用于显示Toast消息。

1. 创建原生插件

iOS部分

首先,在你的uni-app项目根目录下创建一个native-plugins文件夹,然后在其中创建一个名为MyToast的文件夹。在MyToast文件夹中,创建以下文件:

  • MyToast.h
  • MyToast.m

MyToast.h

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface MyToast : NSObject

+ (void)showToast:(NSString *)message;

@end

MyToast.m

#import "MyToast.h"

@implementation MyToast

+ (void)showToast:(NSString *)message {
    dispatch_async(dispatch_get_main_queue(), ^{
        UIView *toastView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 200, 50)];
        toastView.backgroundColor = [UIColor blackColor];
        toastView.alpha = 0.7;
        toastView.center = CGPointMake([[UIScreen mainScreen] bounds].size.width / 2,
                                       [[UIScreen mainScreen] bounds].size.height - 70);
        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(10, 15, 180, 20)];
        label.text = message;
        label.textColor = [UIColor whiteColor];
        [toastView addSubview:label];
        
        [UIApplication.sharedApplication.keyWindow addSubview:toastView];
        
        dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
            [toastView removeFromSuperview];
        });
    });
}

@end

Android部分

native-plugins/MyToast文件夹中,创建以下文件:

  • MyToastModule.java

MyToastModule.java

package com.example.mytoast;

import android.app.Activity;
import android.widget.Toast;

import com.taobao.weex.annotation.JSMethod;
import com.taobao.weex.bridge.JSCallback;
import com.taobao.weex.common.WXModule;

public class MyToastModule extends WXModule {

    @JSMethod(uiThread = true)
    public void showToast(String message, JSCallback callback) {
        Activity activity = getWXSDKInstance().getContext();
        if (activity != null) {
            Toast.makeText(activity, message, Toast.LENGTH_SHORT).show();
        }
        if (callback != null) {
            callback.invoke();
        }
    }
}

2. 在uni-app中调用插件

manifest.json中配置插件:

"nativePlugins": [
    {
        "android": {
            "package": "com.example.mytoast.MyToastModule",
            "name": "myToast",
            "methods": ["showToast"]
        },
        "ios": {
            "className": "MyToast"
        }
    }
]

在uni-app的页面或组件中调用插件:

// #ifdef APP-PLUS
plus.bridge.exec('myToast', 'showToast', ['Hello, Toast!']);
// #endif

以上示例展示了如何创建一个简单的uni-app原生插件并在应用中调用它。你可以根据需要扩展和修改这个插件。

回到顶部