3.0.0 • Published 1 year ago

react-native-apple-card-views v3.0.0

Weekly downloads
5
License
MIT
Repository
github
Last release
1 year ago

Battle Tested ✅

Fully customizable and perfect clone of Apple, App Store Card Views for React Native

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

Installation

Add the dependency:

Pure React Native

npm i react-native-apple-card-views

Expo Version

npm i react-native-apple-card-views#expo

Peer Dependencies

IMPORTANT! You need install them
"react-native-androw": ">= 0.0.33",
"react-native-linear-gradient": ">= 2.5.6",
"@freakycoder/react-native-bounceable": ">= 0.1.1"

Expo Peer Dependencies

IMPORTANT! You need install them
"expo-linear-gradient": ">= 9.2.0"
"@freakycoder/react-native-bounceable": ">= 0.1.1"

Options

Usage

AppleCard Usage

<AppleCard
  smallTitle=""
  largeTitle=""
  footnoteText=""
  resizeMode="cover"
  source={require("./assets/hero_bg_brawlstars_.jpg")}
  backgroundStyle={{
    height: 200,
  }}
  onPress={() => {}}
/>

AppOfTheDayCard Usage

<AppOfTheDayCard
  iconSource={require("./assets/Colorfy.jpg")}
  backgroundSource={require("./assets/ColorfyBG.jpg")}
  onPress={() => {}}
  buttonOnPress={() => {}}
/>

Configuration - Props

AppleCard Props

PropertyTypeDefaultDescription
sourceimagedefault imageset the image background
stylestyledefaultchange the style of the card
shadowColorcolor#000change the main card's shadow color
smallTitlestringNEW GAMEchange the small title
largeTitlestringThe Brilliance of Brawl Starschange the main large title
footnoteTextstringThe next game from the markers of Clash Royale is here. Tap to learn more.change the footnote text
backgroundStylestyledefaultset custom style for background image
smallTitleTextStylestyledefaultset custom style for small title
largeTitleTextStylestyledefaultset custom style for large title
footnoteTextStylestyledefaultset custom style for footnote
onPressfunctionnulluse this to set onPress functionality

AppOfTheDayCard Props

PropertyTypeDefaultDescription
stylestyledefaultchange the style of the card and image background
shadowStylestyledefaultchange the style of the card's shadow
backgroundSourceimagedefault imageset the image background for main card
iconSourceimagedefault imageset the logo image
largeTitlestring"APP OF THE DAY"change the main large title
titlestring"Colorfy: Coloring Art Games"change the title text
subtitlestring"Drawing & painting for everyone"change the subtitle text
buttonTextstring"GET"change the button's text
gradientColorsArray"#de9c7c", "#ef9f81", "#efa192"change the gradient colors
buttonSubtitlestring"In-App Purchases"change the button's bottom subtitle
largeTitleTextStylestyledefaultset the custom style for large title
subtitleTextStylestyledefaultset the custom style for subtitle text
titleTextStylestyledefaultset the custom style for title text
iconStylestyledefaultset the custom style for icon
buttonOnPressfunctionnullset a function for button's onPress
onPressfunctionnullset a function for main card's onPress

Roadmap

  • AppleCard Rewritten and Code Cleaning
  • AppleCard More Customization Options

Author

FreakyCoder, kurayogun@gmail.com

License

React Native Apple Card Views Library is available under the MIT license. See the LICENSE file for more info.

3.0.0

1 year ago

2.2.0

2 years ago

2.1.3

3 years ago

2.1.2

3 years ago

2.1.1

3 years ago

2.1.0

3 years ago

2.0.0

4 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.0

4 years ago

0.0.12

5 years ago

0.0.11

5 years ago

0.0.1

5 years ago