callstack/react-native-material-palette

Name: react-native-material-palette

Owner: Callstack

Description: Bringing Material Palette API to React Native

Created: 2017-06-05 12:43:41.0

Updated: 2018-05-02 12:50:51.0

Pushed: 2018-05-20 16:30:55.0

Homepage: null

Size: 1539

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

react-native-material-palette

Android Palette API brought to react native. It extracts prominent colors from images to help you create visually engaging apps. At the moment it only supports Android.

Check out this medium article for a broader introduction!

Installation

Installation and setup guide can be found here: Setup guide.

Usage with createMaterialPalette

rt { createMaterialPalette } from "react-native-material-palette";

t palette = await createMaterialPalette({ uri: 'http://dummySite/images/yummy.jpg' });

Usage with MaterialPaletteProvider and withMaterialPalette

rt { MaterialPaletteProvider, withMaterialPalette } from 'react-native-material-palette';

t PaletteView = withMaterialPalette(
lette => ({ backgroundColor: palette.vibrant.color }),
ew);

ater ...

erialPaletteProvider
age={require('../assets/image.png')}
tions={{
type: 'vibrant',

faults={{
vibrant: {
  color: '#3792dd',
  bodyTextColor: '#ffffff',
  titleTextColor: '#ffffff',
},


aletteView style={{ flex: 1 }}>
<Text>Hello World</Text>
PaletteView>
terialPaletteProvider>

API

Full API documentation can be found here: API documentation.

Future work

• [ ] iOS support
• [ ] Providing own color profiles

Example app

The repo includes an example app that covers all the API cases. Go here to try it out!

Development

Development instructions can be found here: react-native-material-palette development.