У меня есть следующий макет:
<SafeAreaView style={styles.container}>
<Swipe
onSwipeRight={this.handleLikedJob}
onSwipeLeft={this.handlePassedJob}
keyProp="id"
data={jobs}
renderCard={this.renderCards}
renderNoMoreCards={this.renderNoMoreCards}
onCardClick={this.showCardInfo}
/>
<View styles={styles.buttonArea}>
<ActionButton
buttonColor="rgba(231,76,60,1)"
/>
<ActionButton
buttonColor="rgba(231,76,60,1)"
/>
<ActionButton
buttonColor="rgba(231,76,60,1)"
/>
</View>
</SafeAreaView>
К сожалению, я не вижу никаких кнопок действий.
мои стили:
container: {
flex: 1,
backgroundColor: '#fff',
},
imageView: {
flex: 1,
alignSelf: 'stretch',
width: win.width * 0.97,
height: win.height * 0.55,
margin: 5,
elevation: 5,
shadowColor: '#202020',
shadowOffset: { width: 0, height: 0 },
shadowRadius: 5,
},
buttonArea: {
flex: 1,
},
Вид компонента прокрутки из реквизита, отправленного ему (renderCards):
<View style={styles.imageView}>
<ImageBackground
source={{ uri: image }}
style={{ width: '100%', height: '100%' }}
imageStyle={{ borderRadius: 15 }}
>
<Text style={styles.itemTitle}>
{job.title}
</Text>
<View style={styles.locationContainer}>
<Icon type="material" name="location-on" color="white" />
<Text style={styles.locationText}>
{job.location}
away
</Text>
</View>
</ImageBackground>
</View>
Насколько я понимаю, кнопка Площадь должна появляться под компонентом Swipe, а не под ним (который не виден).
Есть идеи, что мне здесь не хватает? Моя цель просто показать buttonArea прямо под компонентом Swipe. Размах компонента имеет абсолютную позицию.