React Native - 如何設置獨立查看大小屏幕大小？

我想讓View在不同尺寸（適用於Android 4+）和dpi（240+）以及iPhone 4+和iPad上看起來都一樣。當我定義大小時，例如270x65，它在屏幕上看起來是640dpi的兩倍大小，而屏幕320dpi（2560x1600真實屏幕大小）的尺寸卻相同。React Native - 如何設置獨立查看大小屏幕大小？

這是一個很好的解決方案嗎？

containerButton: { 
    width: calcDimension(270), 
    height: calcDimension(65) 
    } 

const calcDimension = size => 
    size/(screenScale() > 2 ? (screenScale()/2) : 1); 

const screenScale =() => 
    (Dimensions.get('window').scale);

或者有更好的解決方案嗎？謝謝。

來源

2017-02-11 CodeBy

P.S.我不看如何計算屏幕尺寸。主要問題是爲什麼相同尺寸的視圖在640 dpi屏幕上的屏幕尺寸（多兩倍）與屏幕320 dpi的相同視圖尺寸相比較？爲「按鈕」開始和相同的字體大小，相同的屏幕尺寸，不同DPI – CodeBy

相同的視圖大小 https://gyazo.com/6e575eebde3bb5f42226691f293dffec https://gyazo.com/972c9f33a54a039421c0f35f6191006f – CodeBy

相同的視圖和字體，但更小的尺寸屏幕和較低的分辨率 https://gyazo.com/be947791d6fb6505ef9e59d1c0adaf10 – CodeBy

我剛剛通過您的查詢，我認爲這將是偉大的，如果你嘗試使用「尺寸」。尺寸是另一個重要的參數，它是由自身反應提供的。你需要做的只是在你的組件中導入維度。

var {height, width} = Dimensions.get('window');

上述命令將根據設備的高度和寬度來設置，無論它是iphone還是android。

剛去throung鏈接：https://facebook.github.io/react-native/docs/dimensions.html

乾杯:)

來源

2017-02-11 15:11:23 Codesingh

請在問題 – CodeBy

您可以使用尺寸在反應本土獲得設備高度和寬度自動計算。

首次進口尺寸

import { Dimensions, Platform, StyleSheet } from 'react-native

獲取設備的高度和寬度

var deviceHeight = Dimensions.get('window').height; 
var deviceWidth = Dimensions.get('window').width;

現在你可以在你的樣式使用這個全局變量。例如：

const styles = StylSheet.create({ 
    mainContainer: { 
      height: deviceHeight/2; 
      width: deviceWidth/2; 
    } 
});

也可以動態地計算狀態欄的高度和寬度的標準方法：

var STATUS_BAR_HEIGHT = Platform.OS === 'ios' ? 20 : 25; 
var HEADER_HEIGHT = Platform.OS === 'ios' ? 44 + STATUS_BAR_HEIGHT : 44 + STATUS_BAR_HEIGHT;

來源

2017-02-12 10:14:36

後查看我的意見請查看我的意見後問題 – CodeBy

React Native - 如何設置獨立查看大小屏幕大小？

回答

相關問題