import React, { Component } from 'react';
import { View, Text, TextInput, TouchableOpacity, Platform } from 'react-native';
import { colors } from '../assets/styles/colors-theme';
import { width, height } from '../services/screen';
import MaterialCommunityIcons from 'react-native-vector-icons/dist/MaterialCommunityIcons';
import Swiper from 'react-native-swiper'
import FastImage from 'react-native-fast-image'
import { s, vs, ms } from 'react-native-size-matters';
MaterialCommunityIcons.loadFont();
class ImageSwiper extends Component {
    render() {
        return (
            <Swiper dot={<View></View>} activeDot={<View></View>} autoplay={true} style={{ height: 300, alignItems: 'center' }}>
                {this.props.images.map((items, index) => {
                    return (
                        <TouchableOpacity
                         onPress = {()=>{this.props.navigation.navigate('FullScreen',{uri:items.uri})}}
                            style={{
                                justifyContent: 'center',
                                alignItems: 'center',
                            }}>
                            <FastImage
                                source={{ uri: items.uri }}
                                style={{
                                    width: width - 20,
                                    height: 300,
                                    // marginLeft: 10,
                                    //  marginRight: 10,
                                    // borderRadius: 20,
                                }}
                                resizeMode={FastImage.resizeMode.contain}
                            />
                        </TouchableOpacity>
                    );
                })}
            </Swiper>
        );
    }
}
export default ImageSwiper;
