npmpackage.info

react-native-image-swiper

A Simple Images Slider using react-native-swiper

0.0.8

JavaScript

Installations

npm install react-native-image-swiper

Pull Requests

Open

0

Total

0

Closed

0

Issues

Open

1

Total

1

Closed

0

Releases

Unable to fetch releases

Developer

7772

Developer Guide

BETA

Module System

CommonJS

Min. Node Version

Typescript Support

No

Node Version

8.9.0

NPM Version

6.4.0 Statistics

16 Commits

1 Watching

1 Branches

1 Contributors

Updated on 07 Oct 2020

Languages

JavaScript (100%)

Total Downloads

Cumulative downloads

Total Downloads

7,021

Last day

400%

Compared to previous day

Last week

63.6%

Compared to previous week

Last month

-38.5%

Compared to previous month

Last year

-31.1%

1,153

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

react-native-swiper

Peer Dependencies

react react-native prop-types

Versions

react-native-image-swiper

A Simple Images Slider using react-native-swiper

Getting Started

init your app

  $ react-native init ImagesSwiperApp

npm install in root

  $ cd ImagesSwiperApp
  $ npm install --save react-native-image-swiper

import ImagesSwiper

  $ import ImagesSwiper from "react-native-image-swiper";

Usage

import ImagesSwiper from "react-native-image-swiper";

const customImg = [
  "https://firebasestorage.googleapis.com/v0/b/lotapp-9e84d.appspot.com/o/aster.jpg?alt=media&token=166e66b0-9c8e-4803-918e-25762c58dbda",
  "https://firebasestorage.googleapis.com/v0/b/lotapp-9e84d.appspot.com/o/fan.jpg?alt=media&token=b419d507-9de8-4c4c-97e3-6b4eb2202e68",
  "https://firebasestorage.googleapis.com/v0/b/lotapp-9e84d.appspot.com/o/stone.jpg?alt=media&token=e9d41537-7f26-4bfd-86eb-c2ef6fc58a9c"
];

class ImagesSwiperApp extends Component {
  render() {
    return (
      <View style={styles.container}>
        <ScrollView style={{flex: 1}}>
          <Text style={styles.welcome}>Default</Text>
          <ImagesSwiper />
          <Text style={styles.welcome}>Custom Images and Styles</Text>
          <ImagesSwiper 
            images={customImg}
            autoplay={true} 
            autoplayTimeout={1.5}
            showsPagination={false}
            width={width} 
            height={height - 400} 
          />
        </ScrollView>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    marginTop: 30,
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    marginTop: 30,
    marginBottom: 10,
  },
});

Properties

Prop	Type	Description	Default	Required
`images`	array of objects	Data to be rendered in the slider	3 example images in array	Optional (Recommend that you add it yourself)
`autoplay`	Boolean	Set to `true` enable auto play mode	`false` (autoplay has currently error on Android's Dev mode)	Optional
`autoplayTimeout`	number	Delay between auto play transitions (in second).	1.5	Optional
`showsPagination`	Boolean	Set to `true` make pagination visible	`false`	Optional
`width`	number	width of image	400	Optional
`height`	number	height of image	400	Optional

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

0

Maintained

Determines if the project is "actively maintained".

0

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

SAST

Determines if the project uses static code analysis.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

License

Determines if the project has defined a license.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

1.3

/10

Last Scanned on 2024-11-25

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More

Other packages similar to react-native-image-swiper

swiper

11.1.15

Most modern mobile touch slider and framework with hardware accelerated transitions

react-native-swiper

1.6.0

Swiper component for React Native.

react-native-onboarding-swiper

1.3.0

Delightful Onboarding for your React-Native App

react-native-swiper-flatlist

3.2.5

React native swiper flatlist component