Skip to content

imageListView.md

Latest commit

 

History

History
110 lines (65 loc) · 2.88 KB

imageListView.md

File metadata and controls

110 lines (65 loc) · 2.88 KB
Raw

ImageListView

Image list using Glide and Guiso with native list

Usage

  import { ImageListView } from 'react-native-jjkit'
  
  <ImageListView {...props}  />

Properties

source?: object

Data source

source.data?: Array:Object

require field uri e.g. 'https://facebook.github.io/react/img/logo_og.png'.
optional field mediaType[image,video,gif](Default: image) : string

source.options?: Object

Name description type default
spanCount Sets the number of spans to be laid out. number 3
orientation Sets the orientation of the layout. ("vertical","horizontal") string "vertical"
selectable Elements are selectable boolean false
selectableIconSize Sets the size number 11
selectableColor Set a color , hex6 hex8 string "#262626"
threshold Selection limit number 2
progressVisible if you want to render a progressView as footer. Helpful in showing a loader while doing incremental loads boolean false
progressSize Sets the size number 60
progressCellSize Sets the container size number 60
progressColor Set a color for the stroke string "#262626"
videoIconVisible show the video icon boolean true
videoIconSize sets the size number 14
durationVisible show the video duration (Requires field duration) boolean true
durationTextSize sets the text size number 11
allowGif if the image you load is an animated GIF, Image will display a animated gif boolean false

source.resize?: Object

Name description type default
width The width to be used in the resize, -1 ignore number 300
height The height to be used in the resize, -1 ignore number 300
mode Determines how to resize the image [contain,cover] string "cover"

source.cell?: Object

Name description type default
size Sets the size number android(window.width / 3) - ios(view.size / 3)
backgroundColor hex 6, hex8 string "#cccccc"
scaleType Controls how the image should be displayed [contain,cover] string "cover"
margin Sets the margin object { left: 0,top: 0,right:0,bottom: 0}

onEndReached?: () => void

Callback function executed when the end of the view is hit

onItemClicked?: (event) => void

Callback function executed when the view is clicked

e.g. onItemClicked={e => console.log(e.nativeEvent.item)}

Methods

addItems: (items:Array<Object>) => void

adds an items to the end of the List

getSelectedItems: () => Promise

e.g ImageListViewRef.getSelectedItems().then(r => { console.log(r) })