How can I Change the style/color of confirm button? about react-native-sectioned-multi-select HOT 5 CLOSED

Hi @AbdullahAlrayes , the SectionedMultiSelect has a styles attribute, you can change the button color like this...
styles={{ button:{backgroundColor:'rgba(8, 119, 190, 1)'}, cancelButton:{backgroundColor:'#06AF8F'}, }}
PS.: it works for me.

<SectionedMultiSelect hideSearch={true} items={this.state.favoriteLists} ref={SectionedMultiSelect => this.SectionedMultiSelect = SectionedMultiSelect} uniqueKey='id' subKey='children' displayKey="name" selectText='please select a list...' noResultsComponent={this.noResults} loadingComponent={this.noResults} readOnlyHeadings={true} onSelectedItemsChange={(selectedItems) => {this.setState({Occurrences : selectedItems}); console.log('onSelectedItemsChange => '+JSON.stringify(this.state.Occurrences));} } selectedItems={this.state.Occurrences} showDropDowns={true} expandDropDowns={true} animateDropDowns={true} modalAnimationType='fade' showChips={true} showCancelButton={true} onCancel={() => this.setState({visibleModal: null})} onConfirm={() => this.setState({visibleModal: 1})} styles={{ button:{backgroundColor:'rgba(8, 119, 190, 1)'}, cancelButton:{backgroundColor:'#06AF8F'}, }} selectedIconComponent={<Icon size={30} name="ios-checkmark-circle-outline" style={{ color: 'green', left:-20 }}/>} />

from react-native-sectioned-multi-select.

Looks like it's styles.button for the view and styles.confirmText for the text.
By default the background colour is colors.primary

from react-native-sectioned-multi-select.

Hello @renrizzolo , I am trying to change the button color using the following code. But it is not working

Styling as following:
const styles = StyleSheet.create({ button: { backgroundColor: "#1E6738" }, confirmText: { backgroundColor: "#1E6738" } });

Component as following

<SectionedMultiSelect style={styles} items={items} uniqueKey="id" subKey="children" selectText="Add Tags ..." showDropDowns={false} readOnlyHeadings={true} onSelectedItemsChange={this.onSelectedItemsChange} selectedItems={this.state.selectedItems} alwaysShowSelectText={true} />

from react-native-sectioned-multi-select.

@jrartiga ... Thank you for your feedback, your solution worked.

It seems the problem with word 'style'. I should add 's' at the end to be 'styles'. Following is my correct code

<SectionedMultiSelect items={this.props.tags} uniqueKey="id" subKey="children" selectText="Add Tags ..." showDropDowns={false} readOnlyHeadings={true} onSelectedItemsChange={this.onSelectedItemsChange} selectedItems={this.state.selectedItems} alwaysShowSelectText={true} styles={{ button: { backgroundColor: "rgba(8, 119, 190, 1)" } }} />

from react-native-sectioned-multi-select.

Do you guys know how to change the colour of the dropdown toggle icon?

from react-native-sectioned-multi-select.