を使用する非常に単純な例がありますScrollView
が、一番下までスクロールできないようです。
この例は完全に基本的なもので、特別なことは何もしていませんが、最後の項目は完全には表示されません。
import React, { Component } from "react";
import { Text, View, ScrollView, StyleSheet } from "react-native";
import { Constants } from "expo";
const data = Array.from({ length: 20 }).map((_, i) => i + 1);
export default class App extends Component {
render() {
return (
<ScrollView style={styles.container}>
{data.map(d => (
<View style={styles.view}>
<Text style={styles.text}>{d}</Text>
</View>
))}
</ScrollView>
);
}
}
const styles = StyleSheet.create({
container: {
paddingTop: Constants.statusBarHeight
},
text: {
fontWeight: "bold",
color: "#fff",
textAlign: "center",
fontSize: 28
},
view: {
padding: 10,
backgroundColor: "#018bbc"
}
});
出力は次のとおりです。
ベストアンサー1
ScrollView の "style" プロパティではなく "contentContainerStyle" プロパティにパディング スタイルを適用します。