的ListView UI看起來並不如預期。（本機庫）

爲什麼顯示醜左邊灰色保證金？我嘗試了許多不同的列表，它仍然打印左邊的灰色邊緣。這是常見的嗎？

我跟本機基本文檔：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你喜歡使用本機基地UI？

來源

2017-09-26 John Baek

我用這樣的：

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

，你應該添加頭像或圖標。 exm：<ListItem icon | avatart />

來源

2017-09-26 07:16:21

太棒了！有效！你是怎麼想到marginLeft和paddingLeft分別爲-15和15的？ '15'是否適用於所有移動設備？ –

剩下15個空間是跨平臺的。方法正常工作。我也在使用。 –

我已經使用這個，但它的工作對我很好。我想你應該檢查你的父文件，如果在左邊的保證金。所以我更喜歡100％父寬度。

來源

2017-09-26 07:20:09

這不是一個答案，它是一個評論。或者爲你的意思添加更多解釋。 – user5014677

我檢查了我的父文件，但實際上這是連接到根，所以你的答案不計算在這個問題上！雖然謝謝！ –

的ListView UI看起來並不如預期。（本機庫）

回答

相關問題