Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Purpur is a fork of Paper, Tuinity, and Airplane with the goal of providing new and interesting configuration options, which allow for creating a unique gameplay experience not seen anywhere else

Stars: ✭ 286 (-7.74%)

Mutual labels: paper

Skitter

Skitter - Slideshow for anytime

Stars: ✭ 295 (-4.84%)

Mutual labels: slider

Pocenter

整合多个软件外包平台项目信息，替你筛选优质项目。MVP + RxJava + Retrofit + Material Design

Stars: ✭ 306 (-1.29%)

Mutual labels: material

Primedatepicker

PrimeDatePicker is a tool that provides picking a single day, multiple days, and a range of days.

Stars: ✭ 292 (-5.81%)

Mutual labels: material

Mdui

MDUI 是一个基于 Material Design 的前端框架。

Stars: ✭ 3,342 (+978.06%)

Mutual labels: material

Speech Separation Paper Tutorial

A must-read paper for speech separation based on neural networks

Stars: ✭ 288 (-7.1%)

Mutual labels: paper

Snapshot Ensembles

Snapshot Ensemble in Keras

Stars: ✭ 289 (-6.77%)

Mutual labels: paper

Spheredissolve

Customizable procedural spherical dissolve shader for Unity3D, for all your customizable procedural spherical dissolve needs!

Stars: ✭ 311 (+0.32%)

Mutual labels: material

Leafpic

LeafPic is a fluid, material-designed alternative gallery, it also is ad-free and open source under GPLv3 license. It doesn't miss any of the main features of a stock gallery, and we also have plans to add more useful features.

Stars: ✭ 3,205 (+933.87%)

Mutual labels: material

Tucl

The first-ever paper on the Unix shell written by Ken Thompson in 1976 scanned, transcribed, and redistributed with permission

Stars: ✭ 303 (-2.26%)

Mutual labels: paper

View All Similar Projects ➔

Paper Onboarding

Paper Onboarding is a material design UI slider for React Native inspired by Ramotion Paper Onboarding.

Installation

yarn add @gorhom/paper-onboarding
# or
npm install @gorhom/paper-onboarding

Also, you need to install react-native-reanimated, react-native-gesture-handler & react-native-svg, and follow their installation instructions.

Usage

import PaperOnboarding, {PaperOnboardingItemType} from "@gorhom/paper-onboarding";

const data: PaperOnboardingItemType[] = [
  {
    title: 'Hotels',
    description: 'All hotels and hostels are sorted by hospitality rating',
    backgroundColor: '#698FB8',
    image: /* IMAGE COMPONENT */,
    icon: /* ICON COMPONENT */,
    content: /* CUSTOM COMPONENT */,
  },
  {
    title: 'Banks',
    description: 'We carefully verify all banks before add them into the app',
    backgroundColor: '#6CB2B8',
    image: /* IMAGE COMPONENT */,
    icon: /* ICON COMPONENT */,
    content: /* CUSTOM COMPONENT */,
  },
  {
    title: 'Stores',
    description: 'All local stores are categorized for your convenience',
    backgroundColor: '#9D8FBF',
    image: /* IMAGE COMPONENT */,
    icon: /* ICON COMPONENT */,
    content: /* CUSTOM COMPONENT */,
  },
];

const Screen = () => {
  const handleOnClosePress = () => console.log('navigate to other screen')
  return (
    <PaperOnboarding
      data={data}
      onCloseButtonPress={handleOnClosePress}
    />
  )
}

Props

name	description	required	type	default
data	Array of pages/slides to present.	YES	Array<PaperOnboardingItemType>
safeInsets	Safe area insets usually come from `react-native-safe-area-context`.	NO	Insets	{top: 50, bottom: 50, left: 50, right: 50}
direction	Pan gesture direction.	NO	'horizontal' \| 'vertical'	horizontal
indicatorSize	Indicator size (width and height).	NO	number	40
indicatorBackgroundColor	Indicator background color.	NO	string	white
indicatorBorderColor	Indicator border color.	NO	string	white
titleStyle	Text style to override `all` page/slide title style.	NO	StyleProp
descriptionStyle	Text style to override `all` page/slide description style.	NO	StyleProp
closeButton	Custom component to be used instead of the default close button.	NO	(() => React.ReactNode) \| React.ReactNode
closeButtonText	Close button text.	NO	string	close
closeButtonTextStyle	Close button text style.	NO	StyleProp
onCloseButtonPress	Callback on close button pressed.	NO	() => void
onIndexChange	Callback when index change.	NO	() => void

PaperOnboardingItemType

name	description	required	type
content	Slide/page content, this will replace default content.	NO	((props: PageContentProps) => React.ReactNode) \| React.ReactNode
image	Image cover.	NO	(() => React.ReactNode) \| React.ReactNode
icon	Indicator icon.	NO	(() => React.ReactNode) \| React.ReactNode
backgroundColor	Background color.	YES	string
title	Title text.	NO	string
description	Description text.	NO	string
titleStyle	Text style to override page/slide title default style.	NO	StyleProp
descriptionStyle	Text style to override page/slide description default style.	NO	StyleProp
showCloseButton	Show close button when page/slide is active, note: last page will always show close button.	NO	boolean

Built With ❤️

Author

Mo Gorhom

License

MIT

Liked the library? 😇

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].

Stars: ✭ 310

Visit Git Page 🔗Visit User Page 🔗Visit Issues Page (4) 🔗