NativeBase 中的自定义图标

Question

我想在 native-base.i 中使用我自己的图标组 base.i 阅读此 post 如何将自定义图标添加到 NativeBase 但没有什么可展示的。这是我要使用的代码，首先 Item 添加图标占位符后删除：

<View style={styles.view}>
            <Item floatingLabel style={{ width: w / 1.9, height: w / 7, borderColor: '#507783', marginBottom: 0, }} >
              <Icon><MyIcon name="ico_user" style={{ color: "#fff" }}/></Icon>
              <Input returnKeyType='next' autoCapitalize="none" onChangeText={text => setUsername(text)} style={{ paddingBottom: 0, color: '#fff', textAlign: 'left', fontFamily: 'IRANSansMobile', fontSize: 12, marginLeft: 8, }} placeholderTextColor="#507783" placeholder='نام کاربری' />
            </Item>
            <Item floatingLabel secureTextEntry={true} style={{ width: w / 1.9, height: w / 7, borderColor: '#507783' }} >
              <Icon type="Fontisto" name="locked" fontSize={25} style={{ color: "#fff" }} />
              <Input returnKeyType='next' autoCapitalize="none" onChangeText={text => setUsername(text)} style={{ color: '#fff', textAlign: 'left', fontFamily: 'IRANSansMobile', fontSize: 12, marginLeft: 8, }} placeholderTextColor="#507783" placeholder='رمز عبور' />
            </Item>
            <Button block style={{ width: w / 1.9, height: 40, backgroundColor: '#59c5b9', marginTop: 56 }} onPress={() => internet.isConnected ? _goLogin() : Alert.alert('لطفا اتصال به اینترنت خود را بررسی نمایید')}>
              <Text style={styles.btntext}>ورود</Text>
            </Button>

          </View>

这是我的 icon-fon.js:

import {createIconSetFromFontello} from 'react-native-vector-icons';
import fontelloConfig from './ecfco.json';
const Icon = createIconSetFromFontello(fontelloConfig,'ecfco');
export default Icon;

并且我在 android:android/app/src/main/assets/fonts 中检查了这个目录是否正确添加了字体。并检查 ios 版本 evry 认为没问题但不工作。和原生版本："native-base": "^2.13.12",

更新：当在 Item 之外使用 MyIcon 时效果很好，但是当使用 Input 的图标时没有显示感谢您帮助解决这个问题。

Answer 1

我解决了。在 gihub 上阅读这个 post：Trying to add an Image on the right of a Label. It's working fine with stackedlabel but floating label is making the image 改变我的方式，将 Icon 替换为 Thumbnail 并更正以下代码：

<Item floatingLabel >
              <Thumbnail square source={require('../../assets/Newimage/Login/ico_user.png')} resizeMode='center' />
              <Label>نام کاربری</Label>
              <Input returnKeyType='next' autoCapitalize="none" onChangeText={text => setUsername(text)}  />
 </Item>

NativeBase 中的自定义图标

custom Icons in NativeBase

react-native

native-base