Java 本机UI组件未显示在React Native中

我试图在React native中显示以下自定义本机UI组件

RectangleView.java

public class RectangleView extends View {


    Paint mRectPaint;

    public RectangleView(Context context) {
        super(context);
        init();
    }

    private void init() {
        mRectPaint = new Paint();
        mRectPaint.setColor(Color.BLUE);
        mRectPaint.setStyle(Paint.Style.FILL);
    }

    public void setColor(String color) {
        // mRectPaint.setColor(Color.parseColor(color));
        postInvalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        canvas.drawRect(0, 0, 500, 500, mRectPaint);
    }
}

这是React代码中的包装器

RectangleView.js

import React, { Component, PropTypes } from 'react';
import { requireNativeComponent, View, Text } from 'react-native';

const RCTRectangleView = requireNativeComponent('RCTRectangleView', RectangleView);

export default class RectangleView extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
        
            <View>
                <Text> Hello world </Text>
                <RCTRectangleView {...this.props} />
            </View>

        );
    }
}

RectangleView.propTypes = {
    ...View.propTypes,
    color: PropTypes.string
};

import React，{Component，PropTypes}来自'React'；
从“react native”导入{RequirementActiveComponent，View，Text}；
const RCTRectangleView=requirenActiveComponent（'RCTRectangleView'，矩形视图）；
导出默认类RectangleView扩展React.Component{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
你好，世界
);
}
}
矩形视图.propTypes={
…视图.propTypes，
颜色：PropTypes.string
};

我看到了“Hello World”，但我没有看到我期待看到的蓝色矩形。我的控制台中唯一的消息是

05-15 16:18:02.299 10937 10969 W ReactNativeJS:警告：View.propTypes已被弃用，并将在ReactNative的未来版本中删除。改用ViewPropTypes

05-15 16:18:02.316 10937 10969 I ReactNativeJS:正在运行应用程序“CustomViewTest”，其appParams:{“initialProps”：{}，“rootTag”：1}DEV==true，开发级别警告处于打开状态，性能优化处于关闭状态

我猜需要一种方法来指定自定义视图的宽度和高度？无法在网上找到这样的具体示例。

尝试以下方法：-

<RCTRectangleView style={{ width: "75%, height: "20%" }} />

试试这个：-

<RCTRectangleView style={{ width: "75%, height: "20%" }} />

使用
从'react native'导入{requirenActiveComponent，View，Text，ViewPropTypes}您是否发现了错误？使用“react native”中的
导入{RequirementActiveComponent，View，Text，ViewPropTypes}