Question

我正在尝试将图像和下拉列表并排对齐。当我尝试在图标的右侧放置下拉菜单时，它非常适合图标和文本，但比图标下方略低一点，即它们彼此之间的排列不完全对齐。

 <View style = {{flexDirection:"row"}}>
      <Image
     style={{alignSelf:'baseline'}}
          source={require('/root/VS_Code/JavascriptProjects/App/assets/Images/Religion/Religion.png')}
        />

       <Dropdown
inputContainerStyle={{ borderBottomColor: 'transparent',width:130 }}
        label='Marital status'
        data={dataForMaritalStatus}

      />

</View>

Answer 1

尝试在父视图中添加justifyContent:"center"

<View style = {{flexDirection:"row",justifyContent:"center"}}>
   <Image style={{alignSelf:'baseline'}}
   source={require('/root/VS_Code/JavascriptProjects/App/assets/Images/Religion/Religion.png')}/>

   <Dropdown
    inputContainerStyle={{ borderBottomColor: 'transparent',width:130 }}
    label='Marital status'
    data={dataForMaritalStatus}

  />

如何将图标和下拉菜单并排对齐？

1 个答案: