React-native-elements: Fix ListItem checkmark on both platforms

[xavier-villelegier]

Description

The checkmark doesn't work on Android because of the position: absolute #1080. If you remove this, you'll have a big ListItem, which is not the expected behavior. This is due to Ionicon icons, that has a big padding.

Setting the height of the icon won't work neither, because of this padding

We need to find something that fits both platforms.

Solution

The solution might be to use the same MaterialIcon icon for both platforms, to avoid the Ionicon icons padding. They are almost the same, except that the material one is bigger because it doesn't have this padding.

|Ionicon|Material|
|-------|---------|
|||

[Updour]

How to create map in react native??

On Apr 6, 2018 6:46 PM, "Xavier Villelégier" [e-mail]
wrote:

Description

The checkmark doesn't work on Android because of the position: absolute

1080

https://github.com/react-native-training/react-native-elements/pull/1080.
If you remove this, you'll have a big ListItem, which is not the expected
behavior
[image: capture d ecran 2018-04-06 a 13 34 28]
https://user-images.githubusercontent.com/17592779/38419267-0f656eea-39a0-11e8-9b00-d36de3c4043b.png

This is due to Ionicon icons, that has a big padding. Setting the height of
the icon won't work neither, because of this padding in Ionicon icons
[image: image]
https://user-images.githubusercontent.com/17592779/38419322-52582b02-39a0-11e8-859f-394954f9dc49.png

We need to find something that fits both platforms.
Solution

The solution might be to use the same MaterialIcon icon for both platforms,
to avoid the Ionicon icons padding. They are almost the same, except that
the material one is bigger because it doesn't have this padding.
Ionicon Material
[image: image]
https://user-images.githubusercontent.com/17592779/38419398-9d6b3a62-39a0-11e8-94c9-de425fabbe7d.png
[image:
image]
https://user-images.githubusercontent.com/17592779/38419447-cdd87368-39a0-11e8-91df-372e13b67bb4.png

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/react-native-training/react-native-elements/issues/1081,
or mute the thread
https://github.com/notifications/unsubscribe-auth/Ai_hhsb2ced3xwXuR4wZiBixMRkNmnk_ks5tl1WfgaJpZM4TJ7GZ
.

[xavier-villelegier]

@Updour I don't think you're in the right place, this is not related to this issue or even to React Native Elements 😅

Here is a link that should help you though

[xavier-villelegier]

Fixed in v1.0.0-beta5