react-native从头开始封装三方sdk(二)

完成了第一步,下面开始飞。
以集成腾讯信鸽推送为例

注册信鸽申请应用等按照腾讯文档来即可。(注意包名要是app的包名不是library的包名)

ps:按照手动配置的方式出现support-v4重复引用问题,尝试多种方式没有解决。暂且放弃。

使用jcenter配置的方式

最终配置结果:
testlibrary下的build.gradle

apply plugin: 'com.android.library'

android {
compileSdkVersion 23
buildToolsVersion "23.0.1"

repositories{
jcenter()
mavenCentral()
maven { url 'https://maven.google.com'}
}

defaultConfig {
minSdkVersion 16
targetSdkVersion 23
versionCode 1
versionName "1.0"
ndk {
abiFilters 'armeabi', 'armeabi-v7a', 'arm64-v8a'
}
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}

dependencies {
compile fileTree(include: ['*.jar'], dir: 'libs')
compile 'com.android.support:appcompat-v7:23.0.1'
compile 'com.facebook.react:react-native:+'

//信鸽jar
compile 'com.tencent.xinge:xinge:3.2.3-release'
//wup包
compile 'com.tencent.wup:wup:1.0.0.E-release'
//mid包
compile 'com.tencent.mid:mid:4.0.6-release'
}

app下的build.gradle添加manifestPlaceholders
这里写图片描述
配置完可以看到依赖的包
这里写图片描述

然后修改TestModule,添加一个获取token的方法

package com.witty.testlibrary;

import android.support.annotation.Nullable;
import android.util.Log;
import android.widget.Toast;

import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.facebook.react.bridge.WritableMap;
import com.facebook.react.modules.core.DeviceEventManagerModule;
import com.tencent.android.tpush.XGIOperateCallback;
import com.tencent.android.tpush.XGPushConfig;
import com.tencent.android.tpush.XGPushManager;

/**
* Created by asus on 2018-06-28.
*/

public class TestModule extends ReactContextBaseJavaModule {

protected ReactApplicationContext context;
public TestModule(ReactApplicationContext reactApplicationContext){
super(reactApplicationContext);
context = reactApplicationContext;
}

/*
* 实现getName方法,返回值即js中的调用方法名
* */
@Override
public String getName() {
return "Test";
}

/**
*传递消息给JS
*/
protected void sendEvent(String eventName,@Nullable WritableMap params) {
context
.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
.emit(eventName, params);
}



/*
* 定义一个方法,获取应用包名
* */
@ReactMethod
public void getPackageName(){
String name = getReactApplicationContext().getPackageName();
Toast.makeText(getReactApplicationContext(),name,Toast.LENGTH_LONG).show();
}

@ReactMethod
public void setDebug(){
XGPushConfig.enableDebug(context,true);
}

@ReactMethod
public void registerPush(){
XGPushManager.registerPush(context, new XGIOperateCallback() {
@Override
public void onSuccess(Object data, int flag) {
//token在设备卸载重装的时候有可能会变
Log.d("TPush", "注册成功,设备token为:" + data);
WritableMap params = Arguments.createMap();
params.putString("token", "注册成功,设备token为:" + data);
sendEvent("registerPush", params);
}
@Override
public void onFail(Object data, int errCode, String msg) {
Log.d("TPush", "注册失败,错误码:" + errCode + ",错误信息:" + msg);
WritableMap params = Arguments.createMap();
params.putString("token", "注册失败,错误码:" + errCode + ",错误信息:" + msg);
sendEvent("registerPush", params);
}
});
}
}

最后修改App.js

/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  Button,
  NativeModules,
  DeviceEventEmitter
} from 'react-native';

const {Test} = NativeModules

const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' +
    'Cmd+D or shake for dev menu',
  android: 'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});

type Props = {};
export default class App extends Component<Props> {

  constructor(props){
    super(props)
    DeviceEventEmitter.once('registerPush',res=>{
      alert(res.token)
    })
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit App.js
        </Text>
        <Text style={styles.instructions}>
          {instructions}
        </Text>
        <Button
          onPress={()=>Test.registerPush()}
          title="获取token"
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

运行react-native run-android

这样就飞起来了。
这里写图片描述

源码地址:https://github.com/DaiHuaXieHuaKai/react-native-testlibrary

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值