Nativebase: Deckswiper doesn't show up on android

[LearnedVector]

native-base: 0.5.18
react-native: 0.39.2
Android: 6.0
iOS: 10.2

The Deckswiper works and is showing on iOS emulator but does not show up on Android. I've also tested it on an HTC One device android version 6.0.1 and it doesn't show up there either.

import React, { Component } from 'react';
import { Image } from 'react-native';
import { 
  Container, 
  Header, 
  Title, 
  Content,
  DeckSwiper,
  Text,
  Card,
  CardItem,
  View
} from 'native-base';

const restaraunts = [
  {
    image: require('../assets/z-man.png')
  },
  {
    image: require('../assets/Pork.png')
  },
  {
    image: require('../assets/Portebello-z-man.png')
  }
]

export default class Main extends Component {
  renderCards(imgsrc) {
    return (
      <Card style={{ elevation: 3 }}>
        <CardItem>
          <Text> Testing</Text>
        </CardItem>
        <CardItem>
          <Image style={{resizeMode: 'cover', width: null}} source={imgsrc}/>
        </CardItem>
      </Card>
    )
  }

  render() {
    return (
      <Container>
        <Header>
          <Title>Header</Title>
        </Header>
        <Content>
          <DeckSwiper 
            dataSource={restaraunts}
            renderItem={Item => this.renderCards(Item.image)}
          />
        </Content>
      </Container>
    );
  }
}

[mokhan]

I've noticed the same behavior as well.

[jcollum]

All I get (RN 0.39.2) is "Check the render method of CardSwiper". Same code as yours.

edit: actually the deckswiper started working when I put it in it's own container. Odd.

[sankhadeeproy007]

Cannot reproduce. Seems to work fine in my device. Any other details you can give me?

[Johncy1997]

I have the same issue.Why it is not shown in android.I tried to display within a content.

[kyledinh]

I just experienced this and I solved it with a minHeight for the containing <View>. This is my own work around, but it should hint at the potential cause of the problem. And hopefully, there will be a better fix then my solution.

          <View style={{minHeight: 500}}>
          <DeckSwiper
            ref={(c) => this._deckSwiper = c}
            dataSource={cards}
            renderItem={item =>
              <Card style={{ elevation: 3 }}>
                <CardItem>

[timhuff]

@kyledinh You're a life saver! Luckily I didn't run into the problem 5 days ago.

[valentinacala]

here another solution. I didn't test on different screen but it work well as the previous approach:
https://github.com/GeekyAnts/NativeBase/issues/1217

[MaciekLeks]

DeckSwiper doesn't like any additional styles then those suggested by the designers. I used to saw empty screen until I removed justify and alignment styles from the wrapper <View> (this one from NativeBase).
My code looks:

const { width, height } = Dimensions.get("window");
const styles = StyleSheet.create({
  container: {
    //for the NativeBase View
    flex: 1,
    width,
    height: height - 60,
    backgroundColor: "#bbbbbb"
  },
  image: {
    //for the Image
    flex: 1,
    height: height - 240,
    resizeMode: "cover",
    borderRadius: 20
  }
});