编写原生模块给JS进行交互，一键加群的实现。

最近一直用RN开发，原生已经小半年没碰过了，需要给Rn的程序加一个一键加群的功能，以往都是用Intent来写，但是RN不支持，查了一下文档，发现有个编写原生模块进行调用的方式，就写了一个加群的模块，很简单，首先去QQ群官网拿到android版的代码【intent的】

1.编写Intent

首先创建一个类：这个是继承rn的一个连接原生的模块。实现一个getName方法，返回值就是我们以后在JS调用的函数名。

然后这个类里面的函数凡是需要在RN调用的都要加上 @ReactMethod注解。比如这里的openGroup

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
package com.poias

import android.content.Intent
import android.net.Uri
import android.widget.Toast
import com.facebook.react.bridge.ReactApplicationContext
import com.facebook.react.bridge.ReactContextBaseJavaModule
import com.facebook.react.bridge.ReactMethod

/**
 * 打开QQ群
 */

class OpenQQ(reactContext: ReactApplicationContext) : ReactContextBaseJavaModule() {

    companion object {
        private lateinit  var context: ReactApplicationContext
    }

    init {
        context = reactContext
    }


    override fun getName(): String {

        return "Ktils"

    }

    //打开QQ群
    @ReactMethod
    fun openGroup(): Boolean {
        val intent = Intent()
        val key = "4Zf-J-QomfEhRJUEIaA9XdbPr6xrYEuu"
        intent.data = Uri.parse("mqqopensdkapi://bizAgent/qm/qr?url=http%3A%2F%2Fqm.qq.com%2Fcgi-bin%2Fqm%2Fqr%3Ffrom%3Dapp%26p%3Dandroid%26k%3D$key")
        // 此Flag可根据具体产品需要自定义，如设置，则在加群界面按返回，返回手Q主界面，不设置，按返回会返回到呼起产品界面 //intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
        try {
           context.startActivity(intent)
            return true
        } catch (e: Exception) {
            Toast.makeText(context, "未安装QQ或版本不支持，请手动添加", Toast.LENGTH_LONG).show()
            return false
        }
    }


}

null

2.新建一个类，加入原生包 把刚才的模块加入这个包，这个也是自定义的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
package com.poias

import android.view.View
import com.facebook.react.ReactPackage
import com.facebook.react.bridge.NativeModule
import com.facebook.react.bridge.ReactApplicationContext
import com.facebook.react.uimanager.ReactShadowNode
import com.facebook.react.uimanager.ViewManager
import java.util.*

/**
 * 工具包模块
 */
class KtilsPackage : ReactPackage {
    override fun createNativeModules(reactContext: ReactApplicationContext): MutableList<NativeModule> {

        return arrayListOf<NativeModule>().apply{
            add(OpenQQ(reactContext))
        }
    }

    override fun createViewManagers(reactContext: ReactApplicationContext): MutableList<ViewManager<View, ReactShadowNode<*>>> {
        return Collections.emptyList()
    }
}

null

3.这一步很多人在用第三方的包都用过了，在Mainapplication加上这个包

1
2
3
4
5
6
7
8
@Override
       protected List<ReactPackage> getPackages() {
         @SuppressWarnings("UnnecessaryLocalVariable")
         List<ReactPackage> packages = new PackageList(this).getPackages();
           //kotlin utils bridge
           packages.add(new KtilsPackage());
         return packages;
       }

null

4.JS调用

1
2
import {NativeModules} from 'react-native';
NativeModules.Ktils.openGroup()

null

好了，好久没有写过kotlin，语法都忘完了。唉