React Native layout - текст / значки появляются "под" изображением, а не под - PullRequest
0 голосов
/ 31 марта 2020

У меня есть следующий макет:

<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}>
              &nbsp;
              {job.location}
              &nbsp;away
            </Text>

          </View>

        </ImageBackground>
      </View>

Насколько я понимаю, кнопка Площадь должна появляться под компонентом Swipe, а не под ним (который не виден).

Есть идеи, что мне здесь не хватает? Моя цель просто показать buttonArea прямо под компонентом Swipe. Размах компонента имеет абсолютную позицию.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...