React Native Android получить соотношение устройств - PullRequest
Новая
       27

React Native Android получить соотношение устройств

0 голосов
/ 25 ноября 2018

Я использую камеру из пакета expo, и у меня возникают проблемы с искажением изображения с камеры.Мой телефон имеет коэффициент 2:1, который является нестандартным.

Когда я использую метод getSupportedRatiosAsync камеры, я получаю все виды соотношений, как 1:1, 2:1, 4:3,16:9, но только 2:1 выглядит хорошо.

Как выбрать соотношение, соответствующее естественному разрешению устройства?Есть ли способ, чтобы получить доступ к предпочтительному соотношению устройства?Или есть какой-то хак, например, всегда выбирая 16:9 и добавляя компонент камеры к черным полям, когда фактическое соотношение устройства не соответствует 16:9?

РЕДАКТИРОВАТЬ:

Разрешение моего телефона 2196x1080, поэтому правильное соотношение должно быть 2:1.Но я не могу придумать функцию, которая будет вычислять 2196x1080 => 2:1, так как (2 * 1080) !== 2196

Есть ли способ, как вывести наилучшее из возможных соотношений даже для таких глупых разрешений?

Ответы [ 2 ]

0 голосов
/ 26 ноября 2018

На Samsung S9 соотношение сторон экрана 18.5:9 очень близко к 2:1.И если вы не скрываете панель навигации , область, предназначенная для предварительного просмотра камеры, вероятно, еще ближе к поддерживаемой 2:1.

Но если вы хотите, чтобы это работало на всехДля устройств с разными соотношениями сторон экрана и разными поддерживаемыми соотношениями камер вы должны обрезать окно предварительного просмотра, например, https://github.com/waitopiggu/rn-camera-android-cropping-test.

Что касается выбора наилучшего соотношения сторон камеры, вы правы, что точное совпадение можетне быть доступным;давайте найдем тот, который ближе всего к тому, что мы хотим: 

const wantedRatio = height/width
var bestRatio = 0;
var bestRatioError = 100000;
for (i in ratios) {
    const r = ratios[i].split(":")
    if (abs(wantedRatio - r[0]/r[1]) < bestRatioError) {
        bestRatioError = abs(wantedRatio - r[0]/r[1])
        bestRatio = ratios[i]
    }
}

this.setState({
    bestRatio
})
0 голосов
/ 25 ноября 2018

Сначала получите размер устройства (разрешение), используя https://facebook.github.io/react-native/docs/dimensions.

Затем вы можете попробовать это: 

import React from 'react';
import {
    Platform
} from 'react-native';
import {
    RNCamera
} from 'react-native-camera';

const DESIRED_RATIO = "2:1"; //suppose the result of first step is 2:1

class MyCameraComponent extends Component {
    state = {}

    prepareRatio = async () => {
        if (Platform.OS === 'android' && this.cam) {
            const ratios = await this.cam.getSupportedRatiosAsync();

            // See if the current device has your desired ratio, otherwise get the maximum supported one
            // Usually the last element of "ratios" is the maximum supported ratio
            const ratio = ratios.find((ratio) => ratio === DESIRED_RATIO) || ratios[ratios.length - 1];

            this.setState({
                ratio
            });
        }
    }

    render() {
        return ( <
            RNCamera ref = {
                (cam) => this.cam = cam
            }
            onCameraReady = {
                this.prepareRatio
            } // You can only get the supported ratios when the camera is mounted
            ratio = {
                this.state.ratio
            }
            />
        );
    }
}
...