referring to the official website of React Native, the following error occurred when calling Android UI component (RCTImageView) in RN.
Error while updating property of "src" of a view managed by MyRCTImageView
java.lang.String can not be cast to com.facebook.react.bridge.ReadableArrayhere is part of my code.
// App.js
//RN ImageView src
import ImageView from "./ImageView";
...
render(){
return(
<ImageView
src={this.state.imageSrc}
borderRadius={this.state.borderRadius}
resizeMode={this.state.resizeMode}
/>
);
}//ImageView.js
// RNandroid UI srcPropTypes.string
let iface = {
name: "ImageView",
propTypes: {
src: PropTypes.string,
borderRadius: PropTypes.number,
resizeMode: PropTypes.oneOf(["cover", "contain", "stretch"]),
...ViewPropTypes, // include the default view properties
},
};
const ImageView = requireNativeComponent("MyRCTImageView",iface);
export default ImageView; from the error message, I learned that an array type should be passed in to src, not string. I constructed the setSrc method in Android through @ ReactProp . But I don"t know how to call this method and how to pass an array to src in RN.
//ReactImageManager.java
//AndroidUI
public class ReactImageManager extends SimpleViewManager<ReactImageView> {
public static final String REACT_CLASS = "MyRCTImageView";
@Override
public String getName() {
return REACT_CLASS; //RN RCTImageView
}
/**
* View
* @param context
* @return
*/
@Override
public ReactImageView createViewInstance(ThemedReactContext context) {
return new ReactImageView(context, Fresco.newDraweeControllerBuilder(), null,null);
}
@ReactProp(name = "src" )
public void setSrc(ReactImageView view, @Nullable ReadableArray sources) {
view.setSource(sources);
}
@ReactProp(name = "borderRadius", defaultFloat = 0f)
public void setBorderRadius(ReactImageView view, float borderRadius) {
view.setBorderRadius(borderRadius);
}
@ReactProp(name = ViewProps.RESIZE_MODE)
public void setResizeMode(ReactImageView view, @Nullable String resizeMode) {
view.setScaleType(ImageResizeMode.toScaleType(resizeMode));
}
}