1.Android提供方法给ReactNative调用
参数类型
Boolean -> Bool
Integer -> Number
Double -> Number
Float -> Number
String -> String
Callback -> function
ReadableMap -> Object
ReadableArray -> Array
1.在MainApplication添加你的package





2.Android提供自定义View给ReactNative使用
1.在MainApplication添加你的package



public class GradualButton extends FrameLayout implements LifecycleEventListener {
protected ThemedReactContext mContext;
private TextView mGradualButton;
private boolean mDisabled;
public GradualButton(@NonNull ThemedReactContext context) {
super(context);
init(context);
}
public GradualButton(@NonNull ThemedReactContext context, @Nullable AttributeSet attrs) {
super(context, attrs);
init(context);
}
public GradualButton(@NonNull ThemedReactContext context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context);
}
public void init(ThemedReactContext context) {
mContext = context;
mContext.addLifecycleEventListener(this);
mGradualButton = new TextView(context);
mGradualButton.setGravity(Gravity.CENTER);
mGradualButton.setTextColor(Color.WHITE);
mGradualButton.setTextSize(TypedValue.COMPLEX_UNIT_SP, 16);
setPadding(0, 0, 0, 0);
addView(mGradualButton);
initListener();
}
protected void initListener() {
mGradualButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (!mDisabled) {
sendMessageToRn("onClick", null);
}
}
});
mGradualButton.setOnLongClickListener(new View.OnLongClickListener() {
@Override
public boolean onLongClick(View v) {
if (!mDisabled) {
sendMessageToRn("onLongClick", null);
}
return false;
}
});
}
public void setWidth(int width) {
int resultWidth = Dp2Px(getContext(), width);
FrameLayout.LayoutParams layoutParams = (FrameLayout.LayoutParams) mGradualButton.getLayoutParams();
layoutParams.width = resultWidth;
mGradualButton.setLayoutParams(layoutParams);
}
public void setHeight(int height) {
int resultHeight = Dp2Px(getContext(), height);
FrameLayout.LayoutParams layoutParams = (FrameLayout.LayoutParams) mGradualButton.getLayoutParams();
layoutParams.height = resultHeight;
mGradualButton.setLayoutParams(layoutParams);
}
public void setText(String text) {
mGradualButton.setText(text);
}
public void setDisable(boolean disabled) {
mDisabled = disabled;
mGradualButton.setClickable(!disabled);
}
/**
* 回调RN的事件
*
* @param eventName 事件名称
* @param data 携带数据
*/
public void sendMessageToRn(String eventName, WritableMap data) {
ReactContext reactContext = (ReactContext) getContext();
reactContext.getJSModule(RCTEventEmitter.class).receiveEvent(
getId(),//native层和js层两个视图会依据getId()而关联在一起
eventName,//事件名称
data//事件携带的数据
);
}
public int Dp2Px(Context context, float dp) {
final float scale = context.getResources().getDisplayMetrics().density;
return (int) (dp * scale + 0.5f);
}
@Override
public void onHostResume() {
}
@Override
public void onHostPause() {
}
@Override
public void onHostDestroy() {
}
}
5.在RN中使用


原生提供给RN调用的名称,也就是getName()方法的返回值,最好单独放一个文件,便于管理