Настройка {SearchBar} из'act-native-elements 'согласно изображению ниже - PullRequest
Новая
       5

Настройка {SearchBar} из'act-native-elements 'согласно изображению ниже

1 голос
/ 25 марта 2020

Я пытаюсь изменить стиль панели поиска, используя'act-native-elements ', но с точки зрения функциональности она работает, но для стилизации я сталкиваюсь с некоторыми проблемами

My Image enter image description here

Ожидаемое изображение enter image description here

Мой код: 

            <SearchBar
              //searchIcon={{ size: 24 }}
              onChangeText={text => this.testFilter(text)}
              onClear={text => this.testFilter('')}
              inputStyle={{ backgroundColor: 'white' }}
              containerStyle={{ backgroundColor: '#FFFFFF', borderWidth: 0, marginLeft: 50 }}
              inputContainerStyle={{ backgroundColor: '#FFFFFF' }}
              placeholderTextColor={'#g5g5g5'}
              placeholder={'Search...'}
              clearIcon={false}
              searchIcon={false}
              value={this.state.test}
            />

Как можно добиться того же стиля с помощью компонента панели поиска

Ответы [ 2 ]

2 голосов
/ 26 марта 2020

вы пробовали добавить inputContainerStyle реквизит вот так? 

inputContainerStyle={{ backgroundColor: 'white' }}

вы также должны взглянуть на реквизиты searchIcon и cancelIcon для изменения стиля значков, используемых в компоненте SearchBar по умолчанию.

1 голос
/ 28 марта 2020

удалось выполнить требование после внесения некоторых изменений с некоторыми логиками и стилями

...