【发布时间】:2021-10-04 14:55:00
【问题描述】:
我是 react native 的新手。
我的问题很简单:我有带有头像的模态,一些关于当前人物的信息和一些细节,我需要修复模态高度,并且来自 ScrollView 的内容必须是可滚动的,如何修复它?任何建议如何解决?这是我的代码:
<Modal transparent={true} animationType={'slide'} visible={visible}>
<StatusBar barStyle={'dark-content'} />
<View style={[styles.mainContainer, { width: width - 60 }]}>
<View
style={[
styles.modalContent,
{ width: width - 50, maxHeight: height - insets.bottom - insets.top - 20 }
]}
>
<TouchableOpacity onPress={onPressClose}>
<Close style={styles.closeButton} width={30} height={30} />
</TouchableOpacity>
<View style={styles.modalHeader}>
<Avatar.Image
style={styles.avatarCollegue}
size={90}
source={require('../../../assets/images/collegue1.png')}
></Avatar.Image>
<View style={styles.infoCollegue}>
<Text style={styles.collegueName}>Sandra Vinke</Text>
<Text style={styles.collegueJob}>Commerciel Directeur</Text>
</View>
</View>
<View style={[styles.collegueDetail, { height: height - 50 }]}>
<ScrollView style={styles.aboutCollegue}>
<View style={{ flex: 1 }}>
<Text style={styles.currentUserDetail}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates,
reprehenderit laborum architecto ex fugiat fugit incidunt aspernatur. Ab corporis
laborum dolores at eum asperiores obcaecati ipsa deserunt in? Lorem ipsum dolor sit
amet consectetur adipisicing elit. Aperiam cum minus soluta dignissimos eum
blanditiis maxime autem, e laborum dolores at eum asperiores obcaecati ipsa deserunt
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates,
reprehenderit laborum architecto ex fugiat fugit incidunt aspernatur. Ab corporis
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates,
reprehenderit laborum architecto ex fugiat fugit incidunt aspernatur. Ab corporis
laborum dolores at eum asperiores obcaecati ipsa deserunt in? Lorem ipsum dolor sit
amet consectetur adipisicing elit. Aperiam cum minus soluta dignissimos eum
blanditiis maxime autem, e laborum dolores at eum asperiores obcaecati ipsa deserunt
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates, Lorem
ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates,
reprehenderit laborum architecto ex fugiat fugit incidunt aspernatur. Ab corporis
laborum dolores at eum asperiores obcaecati ipsa deserunt in? Lorem ipsum dolor sit
amet consectetur adipisicing elit. Aperiam cum minus soluta dignissimos eum
blanditiis maxime autem, e laborum dolores at eum asperiores obcaecati ipsa deserunt
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates, Lorem
ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates,
reprehenderit laborum architecto ex fugiat fugit incidunt aspernatur. Ab corporis
laborum dolores at eum asperiores obcaecati ipsa deserunt in? Lorem ipsum dolor sit
amet consectetur adipisicing elit. Aperiam cum minus soluta dignissimos eum
blanditiis maxime autem, e laborum dolores at eum asperiores obcaecati ipsa deserunt
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui sequi voluptates,
</Text>
</View>
</ScrollView>
<TouchableOpacity style={styles.buttonCollegue}>
<View style={styles.emailButtonCollegue}>
<Text style={styles.contactCurrentCollegue}>{I18n.t('MYCOLLEGUES.EMAIL_BUTTON')}</Text>
<Email width={15} height={15} style={styles.iconButton} />
</View>
</TouchableOpacity>
</View>
</View>
</View>
</Modal>
【问题讨论】:
标签: reactjs react-native react-redux react-hooks