代码之家  ›  专栏  ›  技术社区  ›  Maulik Patel

带输入文本的浮动标签-标签在android中使用in react native触及输入的下边框

  •  0
  • Maulik Patel  · 技术社区  · 6 年前

    我已经实现了带有输入项的浮动标签。下面是我的代码和附加的屏幕截图。浮动标签在iphone中运行良好,但在android中,浮动标签在使用react native时触底。

    <Item floatingLabel style={styles.floatInput}>
                <Label style={styles.lbl}>Enter Your Mobile Number</Label>
                <Input
                  style={styles.inputcolor}
                  ref="Mobile"
                  keyboardType="numeric"
                  onChangeText={text => {
                    this.checkSetMobile(text)
                  }}
                  value={this.state.Mobile}
                />
                  <Icon style={{color:AppColors.colors.main_color}} name="md-call" />
              </Item>
    
          lbl: {
            paddingTop: Platform.OS === "ios" ? undefined : 5 ,
            paddingBottom: Platform.OS === "ios" ? undefined : 5 ,
            marginBottom: 5,
    
          },
          inputcolor: {
            flex: 1,
            paddingBottom:5,
    }
    

    enter image description here

    1 回复  |  直到 6 年前
        1
  •  0
  •   Maulik Patel    6 年前

    目前我已经做了浮动标签这一行的工作,它解决了我的问题

    paddingTop: Platform.OS === "ios" ? undefined : -15 ,