Используя react-native-camera (RNCamera), я изо всех сил пытаюсь установить правильную высоту предварительного просмотра моей камеры, когда предварительный просмотр составляет всю ширину окна, при этом виден полный предварительный просмотр. В этом вопросе предполагается, что устройство все время находится в портретном режиме.

Мой код выглядит следующим образом:

import React, { Component } from "react";
import { Dimensions, Button, View } from "react-native";
import { RNCamera } from "react-native-camera";

export default class CameraScreen extends Component {
  static navigationOptions = {
    header: null
  };
  render() {
    return (
      <View>
        <RNCamera
          ref={ref => {
            this.camera = ref;
          }}
          style={{
            width: Dimensions.get("window").width,
            height: 400 // <-- need to know what this value actually is
          }}
          type={RNCamera.Constants.Type.back}
        />
        <Button
          title="This button should appear directly below the camera preview"
          onPress={() => false}
        />
      </View>
    );
  }
});

Я уверен, что это как-то связано с getSupportedRatiosAsync(), однако это возвращает несколько соотношений. Кто-нибудь может помочь?

0
markmoxx 12 Дек 2018 в 18:38

1 ответ

Лучший ответ

Сначала вам нужно выбрать, какое соотношение вы хотите использовать.

4: 3, 1: 1, 16: 9 и т. Д.

Ваш рост можно рассчитать с учетом вашего соотношения сторон и ширины.

ratio = height: width (для реакции-нативной камеры)

Итак, давайте попробуем рассчитать высоту для соотношения 4: 3 и ширины 480 пикселей.

var height = 4*width/3; //for portrait mode 3:4

Если вы хотите получить полную производительность для портретной ориентации, вам следует использовать flex: 1.

Вы можете получить более подробную информацию в документация по response-native-camera #ratio

3
Onurgule 12 Дек 2018 в 16:03