React native 设置NativeBase输入的样式

我想更改输入的边框大小、颜色等。由于某种原因，当我将两个输入堆叠在一起，然后将marginTop添加到下面的输入中，或者尝试调整输入的大小，然后将它们放在页面的中心时，左侧或底部的边框将消失

<View style={styles.formAlign}>
    <Item regular style={styles.email}>
        <Input placeholder='Email' />
     </Item>
     <Item regular style={styles.password}>
         <Input placeholder='Password' />
     </Item>
</View>





email:{
   borderWidth:4,
   color:'red'
},
password:{

},
formAlign:{
    justifyContent:'center',
    alignItems:'center'
},

电邮：{
边框宽度：4，
颜色：'红色'
},
密码：{
},
正式签名：{
辩护内容：'中心'，
对齐项目：'center'
},

尝试了你的代码，修改了一点

import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native'
import { Item, Input } from 'native-base';

export default class App extends Component {

  render() {
    return (
      <View style={styles.formAlign}>
        <Item style={styles.email}>
          <Input placeholder='Email' style={styles.input} />
        </Item>
        <Item style={styles.password}>
          <Input placeholder='Password' style={styles.input} />
        </Item>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  email: {
    width: 300,
  },
  password: {
    width: 300,
    marginTop: 15,
  },
  formAlign: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  input: {
    borderWidth: 1,
    borderColor: 'blue'
  }
});

import React，{Component}来自'React'；
从“react native”导入{样式表，视图}
从“本机基”导入{Item，Input}；
导出默认类应用程序扩展组件{
render（）{
返回(
);
}
}
const styles=StyleSheet.create({
电邮：{
宽度：300，
},
密码：{
宽度：300，
玛金托普：15，
},
正式签名：{
弹性：1，
为内容辩护：“中心”，
对齐项目：“居中”，
},
输入：{
边框宽度：1，
边框颜色：“蓝色”
}
});

得到这个结果

导入React，{Component}来自'React'；
从“本地基”导入{输入、按钮、项目、文本、图标}；
导出默认类应用程序扩展组件{
render（）{
返回(
this.nameInput=input}
returnKeyType='next'
占位符=“输入行程名称”
占位符textcolor=“#ffffffff”
样式={{color:'#ffffff'}}
onSubmitEditing={（）=>this.\u focusInput（'dayInput'）}
值={this.state.tripName}
defaultValue={this.state.tripName}
onChangeText={tripName=>this.setState（{tripName}）}/>
)
}
}

不错，我会试试看。我的工作是在每个输入中添加边框宽度（上、下、左、右）。您在输入上放置边框，而不是项。并设置项目的宽度。添加一些说明

import React, { Component } from 'react';
import { Input, Button, Item, Text, Icon } from 'native-base';

export default class App extends Component{
    render(){
    return(
        <Item rounded style={styles.itemStyle}>
        <Icon active style={styles.iconstyle} name='navigate' />
            <Input keyboardType="default"
                getRef={(input) => this.nameInput = input}
                returnKeyType='next'
                placeholder="Enter Trip Name"
                placeholderTextColor="#FFFFFF"
                style={{ color: '#ffffff' }}
                onSubmitEditing={() => this._focusInput('dayInput')}
                value={this.state.tripName}
                defaultValue={this.state.tripName}
                onChangeText={tripName => this.setState({ tripName })} />
        </Item>
        )
    }
}