美文网首页
React Naitve唤醒三方APP

React Naitve唤醒三方APP

作者: 五年高考 | 来源:发表于2018-12-12 16:19 被阅读0次

    可以通过此方法唤醒内置应用 如设置、电话簿.....或者调用三方应用

    android唤醒

    android 唤醒APP需要原生支持,通过包名来唤醒APP

    1. 新建如下一个文件夹(openApp)和文件(CustomerOpenAppPackage.java,OpenAppModule.java)


      image.png
    2. OpenAppModule.java中写入

    package 你的目录.openApp;
    
    import android.content.Intent;
    
    import com.facebook.react.bridge.ReactApplicationContext;
    import com.facebook.react.bridge.ReactContextBaseJavaModule;
    import com.facebook.react.bridge.ReactMethod;
    import com.facebook.react.bridge.Promise;
    import com.facebook.react.uimanager.IllegalViewOperationException;
    
    
    
    public class OpenAppModule extends ReactContextBaseJavaModule {
        private ReactApplicationContext Context;
        public OpenAppModule(ReactApplicationContext reactContext) {
            super(reactContext);
            this.Context=reactContext;
    
        }
    
        @Override
        public String getName() {
            return "OpenApp";
        }
    
        @ReactMethod
        public void open(String packageName,Promise promise) {
            try {
                Intent intent = this.Context.getPackageManager().getLaunchIntentForPackage(packageName);
                if(intent !=null){
                    intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
                    this.Context.startActivity(intent);
                    promise.resolve("ok");
                }
                else{
                    promise.resolve("fail");
                }
            }
            catch (IllegalViewOperationException e){
                promise.resolve("fail");
            }
    
        }
    }
    
    1. CustomerOpenAppPackage.java中写入
    package 你的目录.openApp;
    
    import com.facebook.react.ReactPackage;
    import com.facebook.react.bridge.NativeModule;
    import com.facebook.react.bridge.ReactApplicationContext;
    import com.facebook.react.uimanager.ViewManager;
    
    import java.util.ArrayList;
    import java.util.Collections;
    import java.util.List;
    
    public class CustomerOpenAppPackage implements ReactPackage {
    
        @Override
        public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
            return Collections.emptyList();
        }
    
        @Override
        public List<NativeModule> createNativeModules(
                ReactApplicationContext reactContext) {
            List<NativeModule> modules = new ArrayList<>();
    
            modules.add(new OpenAppModule(reactContext));
    
            return modules;
        }
    
    }
    
    
    1. MainApplication.java中注册, 添加以下内容
    ......
    
    import com.wallet_dk_rn.openApp.CustomerOpenAppPackage;
    .....
    protected List<ReactPackage> getPackages() {
          return Arrays.<ReactPackage>asList(new MainReactPackage(), new FingerprintAuthPackage(), new RNDeviceInfo(),
              ...
               new CustomerOpenAppPackage());
        }
    
    
    image.png
    1. 在js中
    ....
    import { NativeModules,Linking,Platform } from 'react-native';
    ...
    // 点击方法中加入
    if (Platform.OS === "android") {
        NativeModules.OpenApp.open("三方app包名,如设置:com.android.settings")
            .then(p => {
                if (p !== "ok") {
                    // 没找到app 跳转到下载链接或者提示用户app没安装
                    Linking.openURL("")
                }
            })
    }
    

    ios 唤醒

    ios比较简单,通过linking进行三方跳转

    1. 添加白名单
      修改./ios/你的项目/info.plist
      添加以下内容
    <key>LSApplicationQueriesSchemes</key>
    <array>
        <string>跳转三方的app的 URL Schemes 例如:wexin</string>
    </array>
    

    如下图


    image.png
    1. js代码中调用
    ....
    import {Linking,Platform } from 'react-native';
    ...
    // 点击方法中加入
    if (Platform.OS === "ios") {
        Linking.canOpenURL('weixin://').then(supported => { 
        // 可以跳转
        if (supported) {
            Linking.openURL('weixin://')
        } else {
            // 不能跳转 未安装或者其他错误
            // 跳转到下载链接或者提示用户app没安装
        }
    }
    

    相关文章

      网友评论

          本文标题:React Naitve唤醒三方APP

          本文链接:https://www.haomeiwen.com/subject/xnhphqtx.html