0.0.2 • Published 5 years ago

react-native-gradient-letter-icon v0.0.2

Weekly downloads
3
License
Apache License 2....
Repository
github
Last release
5 years ago

React Native: react-native-gradient-letter-icon

GitHub package version github home platforms github home npm

github issues github closed issues Issue Stats github license

📖 Getting started

$ npm install react-native-gradient-letter-icon --save

$ react-native link react-native-linear-gradient

💻 Usage

import * as React from 'react';
import { StyleSheet, View, Text } from 'react-native';
import MaterialLetter from 'react-native-gradient-letter-icon';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <MaterialLetter style={{ alignSelf: 'center' }} size={80} single />
        <MaterialLetter
          style={{ alignSelf: 'center' }}
          shapeColor={'#ffdf9e'}
          letterColor={'#000'}
          size={80}
        />
        <MaterialLetter
          style={{ alignSelf: 'center' }}
          shapeColor={'#e56969'}
          size={80}
          shapeType={'round'}
        />
        <MaterialLetter
          style={{ alignSelf: 'center' }}
          shapeColor={'#ffc273'}
          letterColor={'#000'}
          size={80}
          shapeType={'rect'}
        />
        <MaterialLetter
          style={{ alignSelf: 'center' }}
          shapeColor={['#8a49a1', '#c1558b', '#e56969', '#ffc273', '#ffdf9e']}
          size={80}
          bold
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
  },
});

💡 Props

PropTypeDefaultNote
shapeColorstring#1e95ccShape color resource
shapeTypestringcircleShape type (circle,round,rect)
letterstringLeonardo Wilhelm DiCaprioLetter, string or initials to get letters from
letterColorstring#ffffffLetter color
sizenumber30Size MaterialLetter
singleboolfalseIf you take only one letter
boldboolfalseIf the text must have the bold feature

📜 License

This library is provided under the Apache License.