上一篇文章是8.4号写的，一个多月没有写东西了，按照现在的情况估计，年底要写到40篇有点悬，虽然有很多要写的，但现在事情太多了也太累了。今天写点随笔，写到哪算哪吧。

工作

这次参与的新项目，前景还是不错的，不过活也是真多。这段日子，很多时候十一二点才下班，有的时候搞到两点，周末再加一天班。

业务快速发展，不断地有新同学加入，架构也在不断迭代，其实感觉还是蛮不错的，有点像当初刚工作负责电商的时候了，始终创业啊。

雷总曾经说过，要顺势而为，其实是对的，选对方向往往事半功倍，但选对方向需要极强的能力。新的变革已经到来了。

文化

这里的文化是指公司文化，扩展一下也指家庭文化。为什么突然聊文化？

最近感觉无论是家庭还是公司，让大家聚集在一起努力的，相同的文化或者三观是重要的一环。文化认同不一致，很难长久的在一起，这个没有对错，每个人都有选择的权利，没必要强求，很多时候祝福就好。

还是想夸一下字节的文化，虽然看过很多公司的文化宣言，感觉字节的带着哲思在里面，这种文化不是只对公司有利，而是说在自己的生活中，用这种文化来要求自己也是好的。认同这种文化的人在一起，办事效率、质量要高很多，很多时候，损失来自于内耗。

1.1追求极致

不断提高要求，延迟满足感

在更大范围里找最优解

不放过问题，思考本质

持续学习和成长

1.2务实敢为

直接体验，深入事实

不自嗨，注重效果

能突破有担当，打破定式

尝试多种可能，快速迭代

1.3开放谦逊

内心阳光，信任伙伴

乐于助人和求助，合作成大事

格局大，上个台阶想问题

对外敏锐谦虚，ego（自我） 小，听得进意见

1.4坦诚清晰

敢当面表达真实想法

能承认错误，不装不爱面子

实事求是，暴露问题，反对“向上管理”

准确、简洁、直接，有条理有重点

1.5始终创业

自驱，不设边界，不怕麻烦

有韧性，直面现实并改变它

拥抱变化，对不确定性保持乐观

始终像公司创业第一天那样思考

1.6多元兼容

理解并重视差异和多元，建立火星视角

打造多元化的团队，欢迎不同背景的人才，激发潜力

鼓励人人参与，集思广益，主动用不同的想法来挑战自己

创造海纳百川，兼容友好的工作环境

教育

最近在想，怎么教育好下一代？或者话题小一点，如何在知道A选项不好的情况下，让子女听自己的？

以前看过一篇文章，说是孩子们总归不会听你的，但他们也终会在跌跌撞撞中长大，然后他们的子女再来一次循环。

但我觉得，还是有可能教育好的，不过要付出很多，这是一个细雨润无声，充斥在点点滴滴生活中的事情，它永远不是一个一次性任务，或者说几次道理就能达成的。

拿选择来说，需要做到

1. 父母本身就对每种选择的结果比较知晓

2. 父母很了解子女的性格和能力

3. 子女相对相信父母

4. 或者 子女已经培养的很好了，有了自己的主见和三观，知道自己的性格和能力

如果能培养到第四点，那真是轻松很多。不过呀，最重要的还是得立志，论语里说：“不愤不启，不悱不发，举一隅不以三隅反，则不复也。”也是这个道理。立志能给人以动力，自己主观上想干了，才能干好。

家庭

最近媳妇工作上的事情也比较多，我感觉很神奇，好像每次事情都会像商量好似得一起来，这时候考验的就是毅力和耐力，不松气，努力干，总能顶过这一波。

或许真像媳妇说的，人生就像一场游戏，努力就完事了，别想太多。

前些日子和媳妇都阳了，好在不太严重，也不知道什么时候是个头。看到满满的小药箱，比起去年12月的时候，还是感觉安全一些的。

哦，对了，前些日子公司冷藏柜漏水，导致我摔了一跤，电脑都飞出去了。怎么说呢，幸亏电脑没事，就人伤着一点，哈哈哈。本来想投诉一下，但负责人一直在会议室门口等我们会议结束，又道歉又拿药，加了联系方式方便后面有问题及时联系；同时讲了原因和后续的改进措施。做的挺不错的。

以前对摔倒的影响概念不深，现在倒蛮有体会的了，有时候在想，如果六七十岁的人，以这个力道被摔，真的很危险。大家还是要多多注意。

在开发过程中经常会遇到设计给出的button尺寸偏小的情况.这种UIButton在使用中会非常难点击,极大降低了用户体验

解决方案一：重写UIButton的- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent*)event方法

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent*)event



{



   //获取当前button的实际大小

    CGRect bounds = self.bounds;



    //若原热区小于44x44，则放大热区，否则保持原大小不变



    CGFloat widthDelta = MAX(44.0 - bounds.size.width, 0);



    CGFloat heightDelta = MAX(44.0 - bounds.size.height, 0);

    //扩大bounds



    bounds = CGRectInset(bounds, -0.5 * widthDelta, -0.5 * heightDelta);



    //如果点击的点 在 新的bounds里，就返回YES



    return CGRectContainsPoint(bounds, point);



}

系统默认写法是：

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event

{

    return CGRectContainsPoint(self.bounds, point); 

}

其实是在判断的时候对响应区域的bounds进行了修改.CGRectInset(view, 10, 20)方法表示对rect大小进行修改

解决方案二 runtime关联对象来改变范围，- (UIView) hitTest:(CGPoint) point withEvent:(UIEvent) event里用新设定的 Rect 来当着点击范围。

#import "UIButton+EnlargeTouchArea.h"

#import <objc/runtime.h>



@implementation UIButton (EnlargeTouchArea)



static char topNameKey;

static char rightNameKey;

static char bottomNameKey;

static char leftNameKey;



- (void)setEnlargeEdgeWithTop:(CGFloat)top right:(CGFloat)right bottom:(CGFloat)bottom left:(CGFloat)left

{

    objc_setAssociatedObject(self, &topNameKey, [NSNumber numberWithFloat:top], OBJC_ASSOCIATION_COPY_NONATOMIC);

    objc_setAssociatedObject(self, &rightNameKey, [NSNumber numberWithFloat:right], OBJC_ASSOCIATION_COPY_NONATOMIC);

    objc_setAssociatedObject(self, &bottomNameKey, [NSNumber numberWithFloat:bottom], OBJC_ASSOCIATION_COPY_NONATOMIC);

    objc_setAssociatedObject(self, &leftNameKey, [NSNumber numberWithFloat:left], OBJC_ASSOCIATION_COPY_NONATOMIC);

}



- (void)setTouchAreaToSize:(CGSize)size

{

    CGFloat top = 0, right = 0, bottom = 0, left = 0;

    

    if (size.width > self.frame.size.width) {

        left = right = (size.width - self.frame.size.width) / 2;

    }

    

    if (size.height > self.frame.size.height) {

        top = bottom = (size.height - self.frame.size.height) / 2;

    }

    

    [self setEnlargeEdgeWithTop:top right:right bottom:bottom left:left];

}



- (CGRect)enlargedRect

{

    NSNumber *topEdge = objc_getAssociatedObject(self, &topNameKey);

    NSNumber *rightEdge = objc_getAssociatedObject(self, &rightNameKey);

    NSNumber *bottomEdge = objc_getAssociatedObject(self, &bottomNameKey);

    NSNumber *leftEdge = objc_getAssociatedObject(self, &leftNameKey);

    if (topEdge && rightEdge && bottomEdge && leftEdge)

    {

        return CGRectMake(self.bounds.origin.x - leftEdge.floatValue,

                          self.bounds.origin.y - topEdge.floatValue,

                          self.bounds.size.width + leftEdge.floatValue + rightEdge.floatValue,

                          self.bounds.size.height + topEdge.floatValue + bottomEdge.floatValue);

    }

    else

    {

        return self.bounds;

    }

}



- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event

{

    CGRect rect = [self enlargedRect];

    if (CGRectEqualToRect(rect, self.bounds) || self.hidden)

    {

        return [super hitTest:point withEvent:event];

    }

    return CGRectContainsPoint(rect, point) ? self : nil;

}



@end

解决方案三：使用runtime swizzle交换IMP

+ (void)load {

    static dispatch_once_t onceToken;

    dispatch_once(&onceToken, ^{

        NSError *error = nil;

        [self hg_swizzleMethod:@selector(pointInside:withEvent:) withMethod:@selector(hitTest_pointInside:withEvent:) error:&error];

        NSAssert(!error, @"UIView+HitTest.h swizzling failed: error = %@", error);

    });

}



- (BOOL)hitTest_pointInside:(CGPoint)point withEvent:(UIEvent *)event {

    if (UIEdgeInsetsEqualToEdgeInsets(self.hitTestEdgeInsets, UIEdgeInsetsZero)) {

        return [self hitTest_pointInside:point withEvent:event];

    }

    CGRect relativeFrame = self.bounds;

    CGRect hitFrame = UIEdgeInsetsInsetRect(relativeFrame, self.hitTestEdgeInsets);

    return CGRectContainsPoint(hitFrame, point);

}

category的诞生只是为了让开发者更加方便的去拓展一个类，它的初衷并不是让你去改变一个类。

技术点总结

关联对象，也就是绑定对象，可以绑定任何东西

//关联对象

 objc_setAssociatedObject(self, &topNameKey, [NSNumber numberWithFloat:top], OBJC_ASSOCIATION_COPY_NONATOMIC);

// self 关联的类，

 //key：要保证全局唯一，key与关联的对象是一一对应关系。必须全局唯一

//value：要关联类的对象。

//policy：关联策略。有五种关联策略。

//OBJC_ASSOCIATION_ASSIGN 等价于 @property(assign)。

//OBJC_ASSOCIATION_RETAIN_NONATOMIC等价于 @property(strong, //nonatomic)。

//OBJC_ASSOCIATION_COPY_NONATOMIC等价于@property(copy, nonatomic)。

//OBJC_ASSOCIATION_RETAIN等价于@property(strong,atomic)。

//OBJC_ASSOCIATION_COPY等价于@property(copy, atomic)。



 NSNumber *topEdge = objc_getAssociatedObject(self, &topNameKey);

// 方法说明

objc_setAssociatedObject 相当于 setValue:forKey 进行关联value对象



objc_getAssociatedObject 用来读取对象



objc_AssociationPolicy  属性 是设定该value在object内的属性，即 assgin, (retain,nonatomic)...等



 objc_removeAssociatedObjects 函数来移除一个关联对象，或者使用objc_setAssociatedObject函数将key指定的关联对象设置为nil。

方法交换 Method Swizzling 注意点

对于已经存在的类，我们通常会在+load方法，或者无法获取到类文件，我们创建一个分类，也通过其+load方法进行加载swizzling

• Swizzling应该总在+load中执行
• Swizzling应该总是在dispatch_once中执行
• Swizzling在+load中执行时，不要调用[super load]。如果多次调用了[super load]，可能会出现“Swizzle无效”的假象。

交换实例方法

以class为类

void class_swizzleInstanceMethod(Class class, SEL originalSEL, SEL replacementSEL)

{

    //class_getInstanceMethod()，如果子类没有实现相应的方法，则会返回父类的方法。

    Method originMethod = class_getInstanceMethod(class, originalSEL);

    Method replaceMethod = class_getInstanceMethod(class, replacementSEL);

    

    //class_addMethod() 判断originalSEL是否在子类中实现，如果只是继承了父类的方法，没有重写，那么直接调用method_exchangeImplementations，则会交换父类中的方法和当前的实现方法。此时如果用父类调用originalSEL，因为方法已经与子类中调换，所以父类中找不到相应的实现，会抛出异常unrecognized selector.

    //当class_addMethod() 返回YES时，说明子类未实现此方法(根据SEL判断)，此时class_addMethod会添加（名字为originalSEL，实现为replaceMethod）的方法。此时在将replacementSEL的实现替换为originMethod的实现即可。

    //当class_addMethod() 返回NO时，说明子类中有该实现方法，此时直接调用method_exchangeImplementations交换两个方法的实现即可。

    //注：如果在子类中实现此方法了，即使只是单纯的调用super，一样算重写了父类的方法，所以class_addMethod() 会返回NO。

    

    //可用BaseClass实验

    if(class_addMethod(class, originalSEL, method_getImplementation(replaceMethod),method_getTypeEncoding(replaceMethod)))

    {

        class_replaceMethod(class,replacementSEL, method_getImplementation(originMethod), method_getTypeEncoding(originMethod));

    }else {

        method_exchangeImplementations(originMethod, replaceMethod);

    }

}

这里存在的问题是继承时子类没有实现父类方法的问题：
基类A类 有方法 -(void)test
子类B类继承自基类A，但没有重写test方法，即其类[B class]中没有test这个实例方法
当我们交换子类B中的方法test，交换为testRelease方法(这必然会在子类B中写testRelease的实现)，子类B中有没有test方法的实现时，就会将基类A的test方法与testRelease替换，当仅仅使用子类B时，不会有问题。
但当我们使用基类A的test方法时，由于test指向的IMP是原testRelease的IMP,而基类A中没有这个实现，因为我们是写在子类B中的。所以就出现了unrecognized selector

交换类方法

由于类方法存储在元类中，以实例方法存在，所以实质就是交换元类的实例方法
上面交换实例方法基础上，传入cls为元类即可。
获取的元类可以这样objc_getMetaClass("ClassName")或者object_getclass([NSObject class])

事件响应者链

如图所示，不再赘述

 两个重要的方法

- (nullable UIView*)hitTest:(CGPoint)point withEvent:(nullable UIEvent *)event；称为方法A



- (BOOL)pointInside:(CGPoint)point withEvent:(nullable UIEvent *)event；称为方法B

对view进行重写这两个方法后，点击屏幕后，首先响应的是方法A；

• 如果方法A中，我们没有调用父类（[super hitTest:point withEvent:event];）的这个方法，那就根据这个方法A的返回view，作为响应事件的view。（当然返回nil，就是这个view不响应）

• 如果方法A中，我们调用了父类的方法（[super hitTest:point withEvent:event];）那这个时候系统就要调用方法B；通过这个方法的返回值，来判断当前这个view能不能响应消息

• 如果方法B返回的是no，那就不用再去遍历它的子视图。方法A返回的view就是可以响应事件的view。

• 如果方法B返回的是YES，那就去遍历它的子视图。（就是上图我们描述的那样，找到合适的view返回，如果找不到，那就由方法A返回的view去响应这个事件。）

总结

返回一个view来响应事件 （如果不想影响系统的事件传递链，在这个方法内，最好调用父类的这个方法）

- (nullable UIView*)hitTest:(CGPoint)point withEvent:(nullable UIEvent *)event{

    return [super hitTest:point withEvent:event]; 

}

返回的值可以用来判断是否继续遍历子视图（返回的根据是触摸的point是否在view的frame范围内）

- (BOOL)pointInside:(CGPoint)point withEvent:(nullableUIEvent *)event；      

点此链接查看：手把手教你集成环信ReactNative离线推送（上）

三、从原生将device_token 传到RN 并且绑定

1、原生调用方法

reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)

        .emit("deviceToken",jsonObject.toString());

通过PushModule 类进行传递，PushModule 代码如下：

package com.awesomeproject;

import com.facebook.react.bridge.ReactApplicationContext;

import com.facebook.react.bridge.ReactContextBaseJavaModule;

import com.facebook.react.bridge.ReactMethod;

import com.facebook.react.modules.core.DeviceEventManagerModule;

import com.xiaomi.mipush.sdk.MiPushClient;

import org.json.JSONException;

import org.json.JSONObject;



public class PushModule extends ReactContextBaseJavaModule {

    private ReactApplicationContext reactContext;

    public PushModule(ReactApplicationContext reactContext) {

        super(reactContext);

        this.reactContext = reactContext;

    }



    @Override

    public String getName() {

        return "PushModule";

    }

    /**

     从RN界面里面调用该方法

     **/

    @ReactMethod

    public void getDeviceToken(){

        MainApplication.getReactPackage().mModule.sendDataToJS( MiPushClient.getRegId(MainApplication.getContext()));





    }



    public void sendDataToJS(String deviceToken){

        JSONObject jsonObject = new JSONObject();

        try {

            jsonObject.put("deviceToken",deviceToken);

            jsonObject.put("deviceName","2882303761517520571");



        } catch (JSONException e) {

            throw new RuntimeException(e);

        }



        this.reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)

                .emit("deviceToken",jsonObject.toString());

    }







}

2、RN 层进行获取数据

NativeModules.PushModule.getDeviceToken();

  DeviceEventEmitter.addListener('deviceToken',(res)=>{

    const goosid = JSON.parse(res);

    deviceToken = goosid.deviceToken;

    manufacturer = goosid.deviceName;

    console.log('React Native界面,收到数据：',goosid);

3、获取到数据后调用环信RN sdk 方法进行绑定

ChatClient.getInstance().updatePushConfig(push);

js 代码如下

// 导入依赖库

import React, { useEffect } from 'react';

import {

  DeviceEventEmitter,

  NativeModules,

  SafeAreaView,

  ScrollView,

  StyleSheet,

  Text,

  TextInput,

  View,

} from 'react-native';

import {

  ChatClient,

  ChatMessage,

  ChatMessageChatType,

  ChatOptions,

  ChatPushConfig,

} from 'react-native-chat-sdk';

// 创建 app

const App = () => {

  // 进行 app 设置

  const title = 'ChatQuickstart';

  var deviceToken='';

  var manufacturer='';

  NativeModules.PushModule.getDeviceToken();

  DeviceEventEmitter.addListener('deviceToken',(res)=>{

    const goosid = JSON.parse(res);

    deviceToken = goosid.deviceToken;

    manufacturer = goosid.deviceName;

    console.log('React Native界面,收到数据：',goosid);



})

  const [appKey, setAppKey] = React.useState('1137220225110285#demo');

  const [username, setUsername] = React.useState('p9');

  const [password, setPassword] = React.useState('1');

  const [userId, setUserId] = React.useState('');

  const [content, setContent] = React.useState('');

  const [logText, setWarnText] = React.useState('Show log area');



  // 输出 console log 文件

  useEffect(() => {

    logText.split('\n').forEach((value, index, array) => {

      if (index === 0) {

        console.log(value);

      }

    });

  }, [logText]);



  // 输出 UI log 文件

  const rollLog = text => {

    setWarnText(preLogText => {

      let newLogText = text;

      preLogText

        .split('\n')

        .filter((value, index, array) => {

          if (index > 8) {

            return false;

          }

          return true;

        })

        .forEach((value, index, array) => {

          newLogText += '\n' + value;

        });

      return newLogText;

    });

  };



  // 设置消息监听器。

  const setMessageListener = () => {

    let msgListener = {

      onMessagesReceived(messages) {

        for (let index = 0; index < messages.length; index++) {

          rollLog('received msgId: ' + messages[index].msgId);

        }

      },

      onCmdMessagesReceived: messages => {},

      onMessagesRead: messages => {},

      onGroupMessageRead: groupMessageAcks => {},

      onMessagesDelivered: messages => {},

      onMessagesRecalled: messages => {},

      onConversationsUpdate: () => {},

      onConversationRead: (from, to) => {},

    };



    ChatClient.getInstance().chatManager.removeAllMessageListener();

    ChatClient.getInstance().chatManager.addMessageListener(msgListener);

  };



  // SDK 初始化。

  // 调用任何接口之前，请先进行初始化。

  const init = () => {

   

    let option = new ChatOptions({

      autoLogin: false,

      appKey: appKey

    });

    ChatClient.getInstance().removeAllConnectionListener();

    ChatClient.getInstance()

      .init(option)

      .then(() => {

        rollLog('init success');

        this.isInitialized = true;

        let listener = {

          onTokenWillExpire() {

            rollLog('token expire.');

          },

          onTokenDidExpire() {

            rollLog('token did expire');

          },

          onConnected() {

            rollLog('login success.');

            setMessageListener();

          },

          onDisconnected(errorCode) {

            rollLog('login fail: ' + errorCode);

          },

        };

        ChatClient.getInstance().addConnectionListener(listener);

      })

      .catch(error => {

        rollLog(

          'init fail: ' +

            (error instanceof Object ? JSON.stringify(error) : error),

        );

      });

  };



  // 注册账号。

  const registerAccount = () => {

    if (this.isInitialized === false || this.isInitialized === undefined) {

      rollLog('Perform initialization first.');

      return;

    }

    rollLog('start register account ...');

    ChatClient.getInstance()

      .createAccount(username, password)

      .then(response => {

        rollLog(`register success: userName = ${username}, password = ******`);

      })

      .catch(error => {

        rollLog('register fail: ' + JSON.stringify(error));

      });

  };



  // 用环信即时通讯 IM 账号和密码登录。

  const loginWithPassword = () => {

    if (this.isInitialized === false || this.isInitialized === undefined) {

      rollLog('Perform initialization first.');

      return;

    }

    rollLog('start login ...');

    ChatClient.getInstance()

      .login(username, password)

      .then(() => {

        rollLog('login operation success.');

        let push = new ChatPushConfig({

          deviceId:manufacturer,

          deviceToken:deviceToken,

          

        });

        console.log("--------------------------------------------");

        console.log(manufacturer);

        console.log(deviceToken);

        console.log("--------------------------------------------");

        ChatClient.getInstance().updatePushConfig(push);

      })

      .catch(reason => {

        rollLog('login fail: ' + JSON.stringify(reason));

      });

  };



  // 登出。

  const logout = () => {

    if (this.isInitialized === false || this.isInitialized === undefined) {

      rollLog('Perform initialization first.');

      return;

    }

    rollLog('start logout ...');

    ChatClient.getInstance()

      .logout()

      .then(() => {

        rollLog('logout success.');

      })

      .catch(reason => {

        rollLog('logout fail:' + JSON.stringify(reason));

      });

  };



  // 发送一条文本消息。

  const sendmsg = () => {

    if (this.isInitialized === false || this.isInitialized === undefined) {

      rollLog('Perform initialization first.');

      return;

    }

    let msg = ChatMessage.createTextMessage(

      userId,

      content,

      ChatMessageChatType.PeerChat,

    );

    const callback = new (class {

      onProgress(locaMsgId, progress) {

        rollLog(`send message process: ${locaMsgId}, ${progress}`);

      }

      onError(locaMsgId, error) {

        rollLog(`send message fail: ${locaMsgId}, ${JSON.stringify(error)}`);

      }

      onSuccess(message) {

        rollLog('send message success: ' + message.localMsgId);

      }

    })();

    rollLog('start send message ...');

    ChatClient.getInstance()

      .chatManager.sendMessage(msg, callback)

      .then(() => {

        rollLog('send message: ' + msg.localMsgId);

      })

      .catch(reason => {

        rollLog('send fail: ' + JSON.stringify(reason));

      });

  };



  // UI 组件渲染。

  return (

    <SafeAreaView>

      <View style={styles.titleContainer}>

        <Text style={styles.title}>{title}</Text>

      </View>

      <ScrollView>

        <View style={styles.inputCon}>

          <TextInput

            multiline

            style={styles.inputBox}

            placeholder="Enter appkey"

            onChangeText={text => setAppKey(text)}

            value={appKey}

          />

        </View>

        <View style={styles.buttonCon}>

          <Text style={styles.btn2} onPress={init}>

            INIT SDK

          </Text>

        </View>

        <View style={styles.inputCon}>

          <TextInput

            multiline

            style={styles.inputBox}

            placeholder="Enter username"

            onChangeText={text => setUsername(text)}

            value={username}

          />

        </View>

        <View style={styles.inputCon}>

          <TextInput

            multiline

            style={styles.inputBox}

            placeholder="Enter password"

            onChangeText={text => setPassword(text)}

            value={password}

          />

        </View>

        <View style={styles.buttonCon}>

          <Text style={styles.eachBtn} onPress={registerAccount}>

            SIGN UP

          </Text>

          <Text style={styles.eachBtn} onPress={loginWithPassword}>

            SIGN IN

          </Text>

          <Text style={styles.eachBtn} onPress={logout}>

            SIGN OUT

          </Text>

        </View>

        <View style={styles.inputCon}>

          <TextInput

            multiline

            style={styles.inputBox}

            placeholder="Enter the username you want to send"

            onChangeText={text => setUserId(text)}

            value={userId}

          />

        </View>

        <View style={styles.inputCon}>

          <TextInput

            multiline

            style={styles.inputBox}

            placeholder="Enter content"

            onChangeText={text => setContent(text)}

            value={content}

          />

        </View>

        <View style={styles.buttonCon}>

          <Text style={styles.btn2} onPress={sendmsg}>

            SEND TEXT

          </Text>

        </View>

        <View>

          <Text style={styles.logText} multiline={true}>

            {logText}

          </Text>

        </View>

        <View>

          <Text style={styles.logText}>{}</Text>

        </View>

        <View>

          <Text style={styles.logText}>{}</Text>

        </View>

      </ScrollView>

    </SafeAreaView>

  );

};



// 设置 UI。

const styles = StyleSheet.create({

  titleContainer: {

    height: 60,

    backgroundColor: '#6200ED',

  },

  title: {

    lineHeight: 60,

    paddingLeft: 15,

    color: '#fff',

    fontSize: 20,

    fontWeight: '700',

  },

  inputCon: {

    marginLeft: '5%',

    width: '90%',

    height: 60,

    paddingBottom: 6,

    borderBottomWidth: 1,

    borderBottomColor: '#ccc',

  },

  inputBox: {

    marginTop: 15,

    width: '100%',

    fontSize: 14,

    fontWeight: 'bold',

  },

  buttonCon: {

    marginLeft: '2%',

    width: '96%',

    flexDirection: 'row',

    marginTop: 20,

    height: 26,

    justifyContent: 'space-around',

    alignItems: 'center',

  },

  eachBtn: {

    height: 40,

    width: '28%',

    lineHeight: 40,

    textAlign: 'center',

    color: '#fff',

    fontSize: 16,

    backgroundColor: '#6200ED',

    borderRadius: 5,

  },

  btn2: {

    height: 40,

    width: '45%',

    lineHeight: 40,

    textAlign: 'center',

    color: '#fff',

    fontSize: 16,

    backgroundColor: '#6200ED',

    borderRadius: 5,

  },

  logText: {

    padding: 10,

    marginTop: 10,

    color: '#ccc',

    fontSize: 14,

    lineHeight: 20,

  },

});



export default App;

注：需要再登录成功以后进行绑定

四、推送测试

1、push测试
如何查看绑定的证书信息：
登录环信console—>即时推送—>找到对应的用户id—>点击查看用户绑定推送证书（如下图）

如何测试推送
登录环信console—> 即时推送—>填写相关的内容—>发送预览—>确认推送

收到推送

2、离线消息测试
登录环信console—> 即时通讯—>用户管理—>找到对应的用户id—>发送rest 消息

至此，ReactNative 推送集成完成。

前言：在集成ReactNative推送之前，需要了解ReactNative与Android原生交互

一、RN与Android原生交互

RN给原生传递参数

步骤：

1.用Android Studio打开一个已经存在的RN项目，即用AS打开 项目文件夹/android,如下图所示

2.在Android原生这边创建一个类继承ReactContextBaseJavaModule，这个类里边放我们需要被RN调用的方法，将其封装成一个原生模块。

MyNativeModule.java代码如下：

package com.awesomeproject;

import com.facebook.react.bridge.ReactApplicationContext;

import com.facebook.react.bridge.ReactContextBaseJavaModule;

import com.facebook.react.bridge.ReactMethod;

import com.facebook.react.modules.core.DeviceEventManagerModule;

import com.xiaomi.mipush.sdk.MiPushClient;

import org.json.JSONException;

import org.json.JSONObject;



public class PushModule extends ReactContextBaseJavaModule {

    private ReactApplicationContext reactContext;

    public PushModule(ReactApplicationContext reactContext) {

        super(reactContext);

        this.reactContext = reactContext;

    }



    @Override

    public String getName() {

        return "PushModule";

    }

    /**

     从RN界面里面调用该方法

     **/

    @ReactMethod

    public void getDeviceToken(){

        MainApplication.getReactPackage().mModule.sendDataToJS( MiPushClient.getRegId(MainApplication.getContext()));





    }

    

    public void sendDataToJS(String deviceToken){

        JSONObject jsonObject = new JSONObject();

        try {

            jsonObject.put("deviceToken",deviceToken);

            jsonObject.put("deviceName","");



        } catch (JSONException e) {

            throw new RuntimeException(e);

        }



        this.reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)

                .emit("deviceToken",jsonObject.toString());

    }







}

本类中存放我们要复用的原生方法，继承了ReactContextBaseJavaModule类，并且实现了其getName（）方法，构造方法也是必须的。按着Alt+Enter程序会自动提示。接着定义了一个方法，该方法必须使用注解@ReactMethod标明，说明是RN要调用的方法。

3.在Android原生这边创建一个类实现接口ReactPackage包管理器，并把第二步创建的类加到原生模块（NativeModule）列表里。

PushPackage.java代码如下：

package com.awesomeproject;

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 PushPackage implements ReactPackage {

    public PushModule mModule;

    @Override

    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {

        List<NativeModule> list = new ArrayList<>();

        mModule = new PushModule(reactContext);

        list.add(mModule);

        return list;

    }



    @Override

    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {

        return Collections.emptyList();

    }

}

4.将第三步创建的包管理器添加到ReactPackage列表里（getPackage方法里）

MainApplication.java代码如下：

package com.awesomeproject;



import android.app.Application;

import android.content.Context;

import android.util.Log;



import com.facebook.react.PackageList;

import com.facebook.react.ReactApplication;

import com.facebook.react.ReactInstanceManager;

import com.facebook.react.ReactNativeHost;

import com.facebook.react.ReactPackage;

import com.facebook.react.config.ReactFeatureFlags;

import com.facebook.soloader.SoLoader;

import com.awesomeproject.newarchitecture.MainApplicationReactNativeHost;

import com.vivo.push.IPushActionListener;

import com.vivo.push.PushClient;

import com.vivo.push.PushConfig;

import com.vivo.push.util.VivoPushException;

import com.xiaomi.channel.commonutils.logger.LoggerInterface;

import com.xiaomi.mipush.sdk.Logger;

import com.xiaomi.mipush.sdk.MiPushClient;



import java.lang.reflect.InvocationTargetException;

import java.util.List;



public class MainApplication extends Application implements ReactApplication {



  private final ReactNativeHost mReactNativeHost =

      new ReactNativeHost(this) {

        @Override

        public boolean getUseDeveloperSupport() {

          return BuildConfig.DEBUG;

        }



        @Override

        protected List<ReactPackage> getPackages() {

          @SuppressWarnings("UnnecessaryLocalVariable")

          List<ReactPackage> packages = new PackageList(this).getPackages();

          packages.add(mCommPackage);

          // Packages that cannot be autolinked yet can be added manually here, for example:

          // packages.add(new MyReactNativePackage());

          return packages;

        }



        @Override

        protected String getJSMainModuleName() {

          return "index";

        }

      };



  private final ReactNativeHost mNewArchitectureNativeHost =

      new MainApplicationReactNativeHost(this);



  @Override

  public ReactNativeHost getReactNativeHost() {

    if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {

      return mNewArchitectureNativeHost;

    } else {

      return mReactNativeHost;

    }

  }





    static Context context;



    public static Context getContext() {

        return context;

    }

    private static final PushPackage mCommPackage = new PushPackage();

    public static PushPackage getReactPackage() {

        return mCommPackage;

    }







    @Override

  public void onCreate() {

    super.onCreate();

        context = this;

    // If you opted-in for the New Architecture, we enable the TurboModule system

    ReactFeatureFlags.useTurboModules = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED;

    SoLoader.init(this, /* native exopackage */ false);

    initializeFlipper(this, getReactNativeHost().getReactInstanceManager());







        //初始化push



        try {

//PushConfig.agreePrivacyStatement属性及含义说明请参考接口文档

//使用方法

            PushConfig config = new PushConfig.Builder()

                    .agreePrivacyStatement(true)

                    .build();

            PushClient.getInstance(MainApplication.this).initialize(config);

        } catch (VivoPushException e) {

            Log.d("VivoPushException","-------------"+e.toString());

//此处异常说明是有必须的vpush配置未配置所致，需要仔细检查集成指南的各项配置。

            e.printStackTrace();

        }







// 打开push开关, 关闭为turnOffPush，详见api接入文档

        PushClient.getInstance(this).turnOnPush(new IPushActionListener() {

            @Override

            public void onStateChanged(int state) {

                // TODO: 开关状态处理， 0代表成功，获取regid建议在state=0后获取；

                Log.d("vivo初始化------","开关状态处理， 0代表成功，获取regid建议在state=0后获取----"+state);

            }

        });





        //小米初始化push推送服务



        MiPushClient.registerPush(this, "2882303761517520571", "5841752092571");



        //打开Log

        LoggerInterface newLogger = new LoggerInterface() {



            @Override

            public void setTag(String tag) {

                Log.d("MainApplication-------",tag);

                // ignore

            }



            @Override

            public void log(String content, Throwable t) {

                Log.d("MainApplication-------",content+"-----"+t.toString());



            }



            @Override

            public void log(String content) {

                Log.d("MainApplication-------",content);

            }

        };

        Logger.setLogger(this, newLogger);

  }



  /**

   * Loads Flipper in React Native templates. Call this in the onCreate method with something like

   * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());

   *

   * @param context

   * @param reactInstanceManager

   */

  private static void initializeFlipper(

      Context context, ReactInstanceManager reactInstanceManager) {

    if (BuildConfig.DEBUG) {

      try {

        /*

         We use reflection here to pick up the class that initializes Flipper,

        since Flipper library is not available in release mode

        */

        Class<?> aClass = Class.forName("com.awesomeproject.ReactNativeFlipper");

        aClass

            .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)

            .invoke(null, context, reactInstanceManager);

      } catch (ClassNotFoundException e) {

        e.printStackTrace();

      } catch (NoSuchMethodException e) {

        e.printStackTrace();

      } catch (IllegalAccessException e) {

        e.printStackTrace();

      } catch (InvocationTargetException e) {

        e.printStackTrace();

      }

    }

  }



}

5.在RN中去调用原生模块，必须import NativeModule模块。
修改App.js文件，需要从‘react-native’中引用‘NativeModules’，
App.js代码如下：

NativeModules.PushModule.getDeviceToken();

来分析一下程序运行流程：
（1）在配置文件AndroidManifest.xml中，android:name=“.MainApplication”，则MainApplication.java会执行。
（2）在MainApplication.java中，有我们创建的包管理器对象。程序加入PushPackage.java中。
（3）在PushPackage.java中，将我们自己创建的模块加入了原生模块列表中，程序进入PushModule.java中。
（4）在PushModule.java中，提供RN 调用的方法getDeviceToken

实现数据从Android原生回调到RN前端界面

我们都知道，要被RN调用的方法必须是void 类型，即没有返回值，但是项目中很多地方都需要返回数据。那怎么实现呢？

步骤：
1.在Android原生这边创建一个类继承ReactContextBaseJavaModule，这个类里边放我们需要被RN调用的方法，将其封装成一个原生模块。
在上面的PushModule中已经继承了ReactContextBaseJavaModule
我们需要调用sendDataToJS将数据传到RN 层。
PushModule.java 代码如下

package com.awesomeproject;

import com.facebook.react.bridge.ReactApplicationContext;

import com.facebook.react.bridge.ReactContextBaseJavaModule;

import com.facebook.react.bridge.ReactMethod;

import com.facebook.react.modules.core.DeviceEventManagerModule;

import com.xiaomi.mipush.sdk.MiPushClient;

import org.json.JSONException;

import org.json.JSONObject;



public class PushModule extends ReactContextBaseJavaModule {

    private ReactApplicationContext reactContext;

    public PushModule(ReactApplicationContext reactContext) {

        super(reactContext);

        this.reactContext = reactContext;

    }



    @Override

    public String getName() {

        return "PushModule";

    }

    /**

     从RN界面里面调用该方法

     **/

    @ReactMethod

    public void getDeviceToken(){

        MainApplication.getReactPackage().mModule.sendDataToJS( MiPushClient.getRegId(MainApplication.getContext()));





    }



    public void sendDataToJS(String deviceToken){

        JSONObject jsonObject = new JSONObject();

        try {

            jsonObject.put("deviceToken",deviceToken);

            jsonObject.put("deviceName","2882303761517520571");



        } catch (JSONException e) {

            throw new RuntimeException(e);

        }



        this.reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)

                .emit("deviceToken",jsonObject.toString());

    }







}

步骤：
1、在RN 中调用原生的方法

NativeModules.PushModule.getDeviceToken();

2、原生提供对应的方法，将数据传递

3、RN 接收原生传递的数据

至此，我们实现了RN复用原生代码，即将原生模块封装成一个接口，在RN中调用。并且可以封装更加复杂的方法，同时实现了数据回调，即将数据从原生模块中传递到RN前端。

二、原生获取设备信息和ReactNative进行绑定信息

本文介绍如何如何从原生获取推送所需要的设备信息以及ReactNative 绑定信息

前提条件
集成环信即时通讯 React-Native，并且可以正常运行，初始化以及登录
集成文档见环信官网：https://docs-im-beta.easemob.com/document/react-native/quickstart.html

原生获取设备信息：

华为：
在获取华为推送token 之前，我们需要先集成华为sdk，可以参考华为官网官网的集成，也可以参考环信官网进行集成；
获取推送token 参考华为官网文档
获取代码如下：

private void getToken() {

    // 创建一个新线程

    new Thread() {

        @Override

        public void run() {

            try {

                // 从agconnect-services.json文件中读取APP_ID

                String appId = "your APP_ID";



                // 输入token标识"HCM"

                String tokenScope = "HCM";

                String token = HmsInstanceId.getInstance(MainActivity.this).getToken(appId, tokenScope);

                Log.i(TAG, "get token: " + token);

                

                // 判断token是否为空

                if(!TextUtils.isEmpty(token)) {

                    sendRegTokenToServer(token);

                }

            } catch (ApiException e) {

                Log.e(TAG, "get token failed, " + e);

            }

        }

    }.start();

}

private void sendRegTokenToServer(String token) {

    Log.i(TAG, "sending token to server. token:" + token);

}

华为官网有详细的集成介绍，可以仔细阅读， getToken() 方法获取到的就是推送所需要的token。

小米：

1. 前提条件
您已启用推送服务，并获得应用的AppId、AppKey和AppSecret。
2. 接入准备

1. 下载MiPush Android客户端SDK软件包
   MiPush Android客户端SDK从5.0.1版本开始，提供AAR包接入方式，其支持的最低Android SDK版本为19。
   下载地址：https://admin.xmpush.xiaomi.com/zh_CN/mipush/downpage
   建议您下载最新版本。

2. 如您之前通过JAR包方式接入过MiPush客户端SDK，需将原JAR包接入配置完全删除，具体配置请参见《Android客户端SDK集成指南（JAR版）》。

3. 接入指导
   添加依赖
   首先将MiPush SDK的AAR包如MiPush_SDK_Client_xxx.aar 复制到项目/libs/目录，然后在项目APP module的build.gradle中依赖：

android{

    repositories {

        flatDir {

            dirs 'libs'

        }

    }

}

dependencies {

    implementation (name: 'MiPush_SDK_Client_xxx', ext: 'aar')

}

然后需要把该自定义BroadcastReceiver注册到AndroidManifest.xml文件中，注册内容如下：

<receiver

  android:exported="true"

  android:name="com.xiaomi.mipushdemo.DemoMessageReceiver">

          

  <intent-filter>

    <action android:name="com.xiaomi.mipush.RECEIVE_MESSAGE" />

  intent-filter>

    <intent-filter>

    <action android:name="com.xiaomi.mipush.MESSAGE_ARRIVED" />

  intent-filter>

  <intent-filter>

    <action android:name="com.xiaomi.mipush.ERROR" />

  intent-filter>

receiver>