How to decrease the height of the dropdown picker?

Question

I implemented a dropdown picker.I wanted to reduce the height of picker but when I try to reduce the height of picker in container style its reducing the height of view that hold the dropdownpicker,no changes are reflecting on dropdown.How to reduce the height of dropdown picker?Or can anyone suggest a good dropdown library?

<DropDownPicker
   dropDownDirection='BOTTOM'
   dropDownContainerStyle={{height : hp('10%'),width : wp('20%')}}
                  style={{
      marginRight : wp('4%'),
                  }}
                  containerStyle={{
                     width:wp('20%'),
                   marginRight : wp('7%'),
                   height : hp('5%'),
                  }}
   labelStyle={{fontSize : hp('1.25%')}}
                  value={this.state.lineValue}
                  items={this.ITEMS}
   open={this.state.open}
   onSelectItem={item => this.onChangeWeek(item.value)}
   textStyle={{fontSize : hp('1.25%')}}
   setOpen={item => this.setState({open : item})}
              />

score -1 · Accepted Answer · answered Jan 28 '23 at 09:25

Dropdown picker is good enough. You can use listItemContainerStyle or dropDownContainerStyle.

listItemContainerStyle compresses all of your elements so they fit in a certain height:

listItemContainerStyle={{ height: hp('5%') }}

dropDownContainerStyle cuts to the height you just tell it to:

dropDownContainerStyle={{ height: hp('5%') }}

Both make the Dropdown Container smaller, you can use the one that works fine for you.

How to decrease the height of the dropdown picker?

1 Answers1