Заполнение React Native Elements ListItem Buttons (согласно документации) - PullRequest
Новая
       47

Заполнение React Native Elements ListItem Buttons (согласно документации)

0 голосов
/ 21 апреля 2019

В документации React Native Elements для ListItem (https://react -native-training.github.io / реагировать-нативные-элементы / docs / listitem.html # linear-градиент-масштаб-обратная связь ) кнопки ListItem имеют отступ между ними и закруглены.

Однако, когда я пытаюсь сделать следующее (прямо из документации), это не дает тот же стиль: 

<ListItem
  Component={TouchableScale}
  friction={90} //
  tension={100} // These props are passed to the parent component (here TouchableScale)
  activeScale={0.95} //
  linearGradientProps={{
    colors: ['#FF9800', '#F44336'],
    start: [1, 0],
    end: [0.2, 0],
  }}
  ViewComponent={LinearGradient} // Only if no expo
  leftAvatar={{ rounded: true, source: { uri: avatar_url } }}
  title="Chris Jackson"
  titleStyle={{ color: 'white', fontWeight: 'bold' }}
  subtitleStyle={{ color: 'white' }}
  subtitle="Vice Chairman"
  chevronColor="white"
  chevron
/>

Кроме того, я попытался добавить подпорку и подпорку, но это не дает правильного вида.

Как бы один стиль отдельных компонентов ListItem соответствовал этому стилю?

1 Ответ

0 голосов
/ 21 апреля 2019

Согласно документации React Native Elements - https://react -native-training.github.io /act-native-elements / docs / customization.html # component-styles - все компоненты могут быть стилизованы индивидуальноиспользование containerStyle prop.

Следующее, добавленное в качестве реквизита в ListItem, выполняет вышеуказанное требование: 

containerStyle = {{ marginLeft: 5,
                    marginRight: 5, 
                    marginTop: 10, 
                    borderRadius: 10, // adds the rounded corners
                    backgroundColor: '#fff' }}
...