Launch Week Day 2: Introducing Reports: An Extensible Reporting Framework for Socket Data.Learn More
Socket
Book a DemoSign in
Socket

expo-shimmer-placeholder

Package Overview
Dependencies
Maintainers
1
Versions
3
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

expo-shimmer-placeholder

Expo Shimmer Placeholder <a href="https

latest
Source
npmnpm
Version
3.0.0
Version published
Weekly downloads
0
Maintainers
1
Weekly downloads
 
Created
Source

Expo Shimmer Placeholder

Placeholder for both IOS and Android

Get Started

Fork of https://www.npmjs.com/package/react-native-shimmer-loading to only require expo-linear-gradient as react-native-linear-gradient was causing issues

Installation

npm i expo-shimmer-placeholder --save

or

yarn add expo-shimmer-placeholder

Usage

Simple

import { createShimmerPlaceHolder } from 'expo-shimmer-placeholder'
import { LinearGradient } from 'expo-linear-gradient'
const ShimmerPlaceHolder = createShimmerPlaceHolder(LinearGradient)

<ShimmerPlaceHolder />
<ShimmerPlaceHolder visible={isFetched}>
  <Text>
    Wow, awesome here.
  </Text>
</ShimmerPlaceHolder>

Connect more components

More Detail see this

Props

PropDescriptionTypeDefault
LinearGradientLinear Gradient components ('expo-linear-gradient')Componentundefined
visibleVisible child componentsbooleanfalse
styleContainer StyleStyle{backgroundColor: '#ebebeb',overflow: 'hidden'}
shimmerStyleShimmer Style onlyStyle{}
contentStyleContent Style when visibleStyle{}
locationLocations of shimmernumber[][0.3, 0.5, 0.7]
widthWidth of rownumber200
durationDuration of shimmer over a rownumber1000
heightHeight of rownumber15
shimmerWidthPercentPercent of shimmer widthnumber1.0
isReversedReverse direction of animationbooleanfalse
stopAutoRunStop running shimmer animation at beginningbooleanfalse
isInteractionDefines whether or not the shimmer animation creates an interaction handle on the InteractionManagerbooleantrue
shimmerColorsColors of the shimmer.string[]['#ebebeb', '#c5c5c5', '#ebebeb']
containerPropsProps passed to the outermost ViewViewPropsundefined
shimmerContainerPropsProps passed to the View which contains the loading animationViewPropsundefined
childrenContainerPropsProps passed to the View which contains the childrenViewPropsundefined

Methods

MethodDescriptionType
getAnimatedget Animated of PlaceholderAnimated

Helpers

createShimmerPlaceHolder

Contribute

Welcome help me to build this awesome lib.

License

MIT

Keywords

loading

FAQs

Package last updated on 14 Feb 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts