为什么 RPBroadcastPickerView 呈现空白屏幕?

Why is RPBroadcastPickerView rendering a blank white screen?

我已经为 react-native (v0.61.5) 应用程序创建了一个原生 iOS 模块。它所做的只是 return 本机 RPBroadcastPickerView。我希望显示选择器视图,但在我的测试中只显示空白屏幕。

这里是本机模块的样子:

#import <ReplayKit/ReplayKit.h>
#import <React/RCTViewManager.h>

@interface BroadcastPickerManager : RCTViewManager
@end

@implementation BroadcastPickerManager

RCT_EXPORT_MODULE(BroadcastPicker)

- (UIView *)view
{
  return [[RPSystemBroadcastPickerView alloc] init];
}

@end

这是它在 RN 中的样子

BroadcastPickerView.js:

import { requireNativeComponent, View } from 'react-native'

module.exports = requireNativeComponent('BroadcastPicker')

TestScreen.js:

class TestScreen extends React.Component {
  constructor(props) {
    super(props)
  }

  render() {
    return (
      <View style={{flex: 1, backgroundColor: 'red'}}>
       <BroadcastPickerView style={{ height: 200, width: 200, backgroundColor: 'blue'}} />
      </View>
    )
  }
}

编辑: 我试过在本机代码中设置框架,以及在 javascript 中设置 width/height。设置本机代码没有影响。在 javascript 中设置 height/width 以我选择的背景颜色显示视图。不完全确定我期望发生什么,但我猜 RPBroadcastPickerView 不是黑色的空视图。

React native docs on native module development found here 这么说:

Note: Do not attempt to set the frame or backgroundColor properties on the UIView instance that you expose through the -view method. React Native will overwrite the values set by your custom class in order to match your JavaScript component's layout props. If you need this granularity of control it might be better to wrap the UIView instance you want to style in another UIView and return the wrapper UIView instead. See Issue 2948 for more context.

不确定我是否只是遗漏了什么,但是当导航到此屏幕时没有呈现任何内容。有什么建议吗?

您需要为 RPSystemBroadcastPickerView 提供帧大小:

- (UIView *)view
{
  return [[RPSystemBroadcastPickerView alloc] initWithFrame: CGRectMake(0, 0, 50, 50)];
}

请注意,更改 frame 属性 不会调整 RPSystemBroadcastPickerView 的大小(至少在 iOS 13 上是这样)。自动布局也不会调整视图的大小。

您可以在 docs 中找到一个 Swift 示例:

let broadcastPicker = RPSystemBroadcastPickerView(frame: CGRect(x: 0, y: 0, width: 50, height: 50))