react-native - 反応ネイティブでコンポーネントの高さを 100% に設定する

Question

スタイルの高さ要素に などの数値を指定できます40が、これらは整数である必要があります。コンポーネントの高さを にする方法を教えて100%ください。

Answer 1

フレックスボックスのドキュメントをチェックしてください。スタイルシートで、次を使用します。

flex:1,

Answer 2

ウィンドウの高さを変数に取得し、ターゲットにするフレックス コンテナーの高さとして割り当てます。

let ScreenHeight = Dimensions.get("window").height;

あなたのスタイルで：

var Styles = StyleSheet.create({ ... height: ScreenHeight });

ディメンションを使用する前にインポートする必要があることに注意してください。

import { ... Dimensions } from 'react-native'

Answer 3

私は ScrollView を使用していたので、これらの解決策のどれも私の問題を解決しませんでした。contentContainerStyle={{flexGrow: 1}}スクロールビューで小道具を試すまで。それなしのようです-scrollviewsは常にコンテンツと同じ高さになります。

私の解決策はここにありました: React native, children of ScrollView wont fill full height