ListView UI看起来并不像预期的那样。（Native-Base）

Question

为什么显示丑陋的左灰边？我尝试了许多不同的List，它仍然打印左灰色边距。这是常见的吗？

我遵循了基于原生的文档：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你喜欢使用Native-Base for UI吗？

Answer 1

我这样用：

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

你应该添加头像或图标。 exm：<ListItem icon | avatart />

Answer 2

我用过这个，但它对我来说很好。 我认为你应该检查你的父文件，如果左边的边距。 所以我更喜欢100％的父宽度。