React Native:在视频流顶部显示 OpenTok Publisher 的名称

React Native: Show the name of the OpenTok Publisher on top of the video stream

我正在尝试使用 OpenTok React Native 包让发布者的名称显示在视频流的顶部(在发布者和订阅者的两端)。

根据 OTPublisher component 的文档,只需将 name 键作为属性之一传递即可。

我已经尝试将名称添加到属性并将其传递给 OTPublisher 组件,但它不会显示在发布者或订阅者上。我还需要做其他事情吗?

这是我正在使用的示例代码:

class App extends Component {
  constructor(props) {
    super(props);

    this.publisherProperties = {
      publishAudio: false,
      cameraPosition: 'front',
      name: 'Test Name'
    };

    this.publisherEventHandlers = {
      streamCreated: event => {
        console.log('Publisher stream created!', event);
      },
      streamDestroyed: event => {
        console.log('Publisher stream destroyed!', event);
      }
    };
  }

  render() {
    return (
      <OTSession apiKey="your-api-key" sessionId="your-session-id" token="your-session-token">
        <OTPublisher
          properties={this.publisherProperties}
          eventHandlers={this.publisherEventHandlers}
          style={{ height: 100, width: 100 }}
        />
      </OTSession>
    );
  }
}

此处为 TokBox 开发人员布道师。

OpenTok React Native 库呈现由 OpenTok iOS 和 Android SDK 提供支持的本机视图。这些移动 SDK 不支持渲染叠加在其上的 name 的视频,目前只能使用 OpenTok JS SDK。

如果您在网络上订阅相同的会话(您可以使用 OpenTok Playground tool 对其进行测试),您会发现设置名称 属性 有效。