1.0.3 • Published 4 years ago

react-native-kakao-logo v1.0.3

Weekly downloads
2
License
MIT
Repository
github
Last release
4 years ago

react-native-kakao-logo

(not official) Kakao svg-logo for React Native

Required

install react-native-svg

Preview

login_screen

Example code and screenshot

import React from 'react';
import {SafeAreaView, StyleSheet, StatusBar, Text, View} from 'react-native';
import KakaoLogo from 'react-native-kakao-logo';

const options = [
  {
    backgroundColor: '#ff4253',
    padding: 10,
  },
  {
    backgroundColor: '#81ca4e',
    padding: 10,
  },
  {
    backgroundColor: '#297ef5',
    padding: 10,
  },
  {
    backgroundColor: '#5b5b5b',
    padding: 10,
  },
];

const App = () => {
  return (
    <>
      <StatusBar barStyle={'dark-content'} />
      <SafeAreaView style={styles.safeArea}>
        <View style={styles.container}>
          {options.map(option => {
            return (
              <KakaoLogo
                key={option.backgroundColor}
                style={option}
                size={40}
                color={'white'}
              />
            );
          })}
        </View>
        <KakaoLogo style={styles.logo} size={100} color={'white'} />
        <Text>react-native-kakao-logo</Text>
      </SafeAreaView>
    </>
  );
};

const styles = StyleSheet.create({
  safeArea: {alignItems: 'center', justifyContent: 'center', flex: 1},
  container: {
    width: 120,
    justifyContent: 'center',
    flexWrap: 'wrap',
    flexDirection: 'row',
    borderRadius: 10,
    overflow: 'hidden',
  },
  logo: {
    backgroundColor: '#3c1e1e',
    padding: 10,
    margin: 10,
  },
});

export default App;

example_screen

Props

PropTypeDefaultDescription
size?number25Logo size
color?string#3C1E1ELogo color
style?ViewStylenoneLogo Wrapper Style