论坛 › 知识问答 › android - 多相机组件 react-native-camera

菜鸟教程小白 发表于 2022-12-13 01:30:30

android - 多相机组件 react-native-camera

                                            <p><p>我有一个应用程序，有三个屏幕，您可以在其中左右滑动以转到其他屏幕。每个屏幕都应该有一个摄像头作为背景和一些按钮。当我使用 react-native-camera 的相机组件时。它适用于单屏。但是当在所有三个 View 中都包含相机组件时。屏幕变白。</p>

<p>这里是刷卡代码:</p>

<pre><code>&lt;Swiper showsPagination={false} loop={false} index={1}&gt;
    &lt;MessageSection/&gt;
    &lt;PhoneSection/&gt;
    &lt;DocumentSection/&gt;
&lt;/Swiper&gt;
</code></pre>

<p>这里是phoneSection:</p>

<pre><code>&lt;Camera
      ref={(cam) =&gt; {
      this.camera = cam;
      }}
      style={global.COMMON.container}
      aspect={Camera.constants.Aspect.fill}&gt;
    &lt;View style={}&gt;
      {backButton}
      &lt;View style={global.COMMON.centerView}&gt;
      &lt;Animatable.Text animation=&#34;fadeOut&#34; delay={2000} style={}&gt;Place a call to Contacts and Service Providers&lt;/Animatable.Text&gt;
      &lt;/View&gt;
      &lt;View style={global.COMMON.bottomSection}&gt;
      {buttonSection}
      &lt;/View&gt;
    &lt;/View&gt;
&lt;/Camera&gt;
</code></pre>

<p>代码在其他组件中看起来也相似。但是一旦我使用了多个相机组件。相机不工作，只显示白屏。</p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>找到了解决这个问题的方法。诀窍是使用单个相机组件而不是三个。</p>

<p>我通过将 Camera 组件作为我的主要组件并在其中添加 swiper 组件来解决了这个问题。因此，其他一切都在相机之上。这使您可以在其上创建任何东西。</p>

<pre><code>&lt;Camera
      ref={(cam) =&gt; {
      this.camera = cam;
      }}
      style={global.COMMON.container}
      aspect={Camera.constants.Aspect.fill}&gt;
&lt;Swiper showsPagination={false} loop={false} index={1}&gt;
    &lt;MessageSection/&gt;
    &lt;PhoneSection/&gt;
    &lt;DocumentSection/&gt;
&lt;/Swiper&gt;
&lt;/Camera&gt;
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于android - 多相机组件 react-native-camera，我们在Stack Overflow上找到一个类似的问题：
                                                        <a href="https://stackoverflow.com/questions/44203638/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/44203638/
                                                        </a>
                                                </p>
                                       

查看完整版本: android - 多相机组件 react-native-camera