@freakycoder/react-native-image-swiper

    0.1.3 • Public • Published
    React Native Image Swiper

    Battle Tested ✅

    React Native Image Swiper

    npm version npm Platform - Android and iOS License: MIT styled with prettier

    React Native Image Swiper

    Installation

    Add the dependency:

    npm i @freakycoder/react-native-image-swiper

    Peer Dependencies

    IMPORTANT! You need install them
    "react"">= 16.x.x",
    "react-native"">= 0.55.x",

    Usage

    Import

    import ImageSwiper from "@freakycoder/react-native-image-swiper";

    Basic Usage

    <ImageSwiper
      imageHeight={700}
      onSwipeTop={() => alert("onSwipeTop")}
      onSwipeBottom={() => alert("onSwipeBottom")}
      images={[
        {
          uri:
            "https://images.unsplash.com/photo-1544550581-5f7ceaf7f992?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=958&q=80",
        },
        {
          uri:
            "https://images.unsplash.com/photo-1555149385-c50f336e28b0?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=675&q=80",
        },
        {
          uri:
            "https://images.unsplash.com/photo-1532517891316-72a08e5c03a7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=701&q=80",
        },
      ]}
    />

    Configuration - Props

    Property Type Default Description
    images array undefined the main data of image swiper
    ImageComponent component Image set your own Image component such as FastImage
    onPageSelected Function undefined handle the selected page with this function
    imageHeight number ScreenHeight change the image height
    imageWidth number ScreenWidth image width is changable but not recommended! You will broke the image swiper's horizontal swipe feature
    onSwipeTop Function undefined handle when the user swipe top on the image
    onSwipeBottom Function undefined handle when the user swipe bottom on the image

    Future Plans

    • LICENSE
    • initialPage Feature
    • Vertical Image Swiper Feature (Like Tiktok)
    • Write an article about the lib on Medium

    Author

    FreakyCoder, kurayogun@gmail.com

    License

    React Native Image Swiper is available under the MIT license. See the LICENSE file for more info.

    Install

    npm i @freakycoder/react-native-image-swiper

    DownloadsWeekly Downloads

    12

    Version

    0.1.3

    License

    MIT

    Unpacked Size

    29.1 kB

    Total Files

    13

    Last publish

    Collaborators

    • avatar