Как вы можете плавать: вправо и влево в React Native? - PullRequest
0 голосов
/ 09 апреля 2020

как поставить метку суммы и значение на левой стороне

и

сумма Платная метка и значение на правой стороне

Мне также нужна кнопка на передней панели Дата справа

<FlatList
                        data={this.state.data}
                        renderItem={({ item }) =>
                            <View style={style.listItems}>

                                <View>

                                    <Text>
                                        <Text style={style.textHeader}>Amount:  </Text>
                                        <Text style={style.text}> {item.Amount}  </Text>
                                        <Text style={style.textHeader}>Amount Paid:  </Text>
                                        <Text style={style.text}> {item.AmountPaid}  </Text>
                                    </Text>

                                </View>
                            </View>
                        }

                        keyExtractor={(item, index) => index.toString()}
                    />

как я могу исправить эту проблему

1 Ответ

0 голосов
/ 09 апреля 2020

В зависимости от ваших существующих стилей, вы обычно решаете эту проблему, заключая в View примерно так:

<View>
  <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
    <Text style={style.textHeader}>Amount:  </Text>
    <Text style={style.text}> {item.Amount}  </Text>
  </View>
  {...other rows}
</View>

* Обратите внимание, что я отбросил элемент Text, который упаковывал ваши строки

* Примечание 2: общая проблема с Text элементами внутри View с flexDirection: row заключается в том, что если у вас есть очень длинный текст в первом Text, это может привести к sh другому Text из ваши View границы. Чтобы это исправить, примените flexShrink: 1 к первому стилю Text (в вашем случае textHeader).

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