Skip to content

Avatar Image in ListItem beta4 not working #1069

@neogeno

Description

@neogeno

Description

Avatar Image not appearing in Listitem after upgrading to beta4. Code used to be avatar={{uri:l.avatar_url}} but even after changing to new syntax avatar={{ source: { uri: l.avatar_url } }} still nothing shows up

  1. Explain what you did

Upgraded fro beta3 to beta4 and left code unchanged. Found my ListItems no longer show Avatars.

  1. What you expected to happen

Round Avatar to show up on the left side of each List Item

  1. What actually happens

Text Content is rendered but not Avatar

Also please include the version of react-native-elements that you are using.

1.0.0-beta4

Reproduction Steps and Sample Code

`
const list = [
{
name: 'Amy Farha',
avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/ladylexy/128.jpg',
subtitle: 'test'
},
{
name: 'Chris Jackson',
avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/adhamdannaway/128.jpg',
subtitle: 'Testing'
}];

{
list.map((l, i) => (
<ListItem
containerStyle={{height:80, justifyContent:'center', borderBottomColor: '#E5E5E5', borderBottomWidth:0.5}}
roundAvatar
avatar={{ source: { uri: l.avatar_url } }}
key={i}
title={l.name}
titleStyle={{fontSize:15}}
subtitle={

<Text style={{color: 'rgba(72, 100, 124, 1)'}}>{l.subtitle}
5 months ago

}
subtitleStyle={{fontSize:12}}
rightTitle='+150 SAT'
rightTitleNumberOfLines={2}
rightTitleStyle={{color: 'rgba(44, 62, 80, 1)'}}
rightIcon={{name:'zap', type: 'octicon', color: 'rgba(72, 100, 124, 1)'}}
/>
))
}`

We highly recommend that you try to reproduce your bug on https://snack.expo.io/ and provide a link.

If you can't reproduce the bug on Snack, provide an example of your code and briefly explain what the code is suppose to be doing.

Solution

Can you suggest a possible fix that would address this issue? Ideally, you should be able to submit a PR to fix it. See our contributing guide for more details.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions