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

• Usage
• 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

| Prop | Type | Default | Note | | ----------------- | ---------- | ------- | ---------------------------------------------------------------------------------------------------------- | | shapeColor | string | #1e95cc | Shape color resource | shapeType | string | circle | Shape type (circle,round,rect) | letter | string |Leonardo Wilhelm DiCaprio | Letter, string or initials to get letters from | letterColor | string | #ffffff | Letter color | size | number |30 | Size MaterialLetter | single | bool | false | If you take only one letter | bold | bool |false | If the text must have the bold feature

📜 License

This library is provided under the Apache License.