UI ListView ne semble pas comme prévu. (Native-Base)

Question

Pourquoi est-il montre la marge gris laid gauche? J'ai essayé avec beaucoup de liste différente et il est encore en train d'imprimer la marge grise gauche. Est-ce commun?

J'ai suivi document de base autochtone: http://docs.nativebase.io/Components.html#list-avatar-headref

import { Container, Content, List, ListItem, Text, Left, Body, Thumbnail } from 'native-base'; 
import { View, AsyncStorage } from 'react-native'; 

... 
render() { 
    return (
    <View style={{flex:1}}> 
     <Content> 
      <List> 
      {this._renderProfile()} 
      <ListItem> 
       <Left> 
       <Text>! Edit Profile</Text> 
       </Left> 
      </ListItem> 
      <ListItem onPress={this._changePassword}> 
       <Left> 
       <Text>Change Password </Text> 
       </Left> 
      </ListItem> 

      <ListItem> 
       <Left> 
       <Text>! Language Setting</Text> 
       </Left> 
      </ListItem> 

      <ListItem onPress={this._showModal}> 
       <Left> 
       <Text>Logout</Text> 
       </Left> 
      </ListItem> 
      </List> 
     </Content> 
     {this._drawModal()} 
     </View> 

p.s-vous comme l'utilisation native-Base pour l'interface utilisateur?

Answer 1

J'utilise comme ceci:

render() { 
     return (
      <ListItem style={{marginLeft: -15, paddingLeft: 15}}> 
       <Left> 
        <Text>! Language Setting</Text> 
       </Left> 
      </ListItem> 
     ); 
    } 

et vous devez ajouter avatar ou l'icône. exm: <ListItem icon | avatart />

Answer 2

J'ai utilisé ceci mais son fonctionne bien pour moi. Je pense que vous devriez vérifier votre fichier parent si la marge sur le côté gauche. donc je préfère 100% de la largeur des parents.