Version: Next

SocialIcon

SocialIcons are visual cues to online and social media networks.

Social Icons

Usage#

import { SocialIcon } from 'react-native-elements'
// Icon
<SocialIcon
type='twitter'
/>
<SocialIcon
raised={false}
type='gitlab'
/>
<SocialIcon
light
type='medium'
/>
<SocialIcon
light
raised={false}
type='medium'
/>
// Button
<SocialIcon
title='Sign In With Facebook'
button
type='facebook'
/>
<SocialIcon
title='Some Twitter Message'
button
type='twitter'
/>
<SocialIcon
button
type='medium'
/>
<SocialIcon
button
light
type='instagram'
/>

Props#


Reference#

activityIndicatorStyle#

style to render when in loading state

TypeDefault
objectnone

button#

creates button (optional)

TypeDefault
booleanfalse

Component#

type of button (optional)

TypeDefault
React Native ComponentTouchableHighlight

disabled#

disable button (optional)

TypeDefault
booleanfalse

fontFamily#

specify different font family (optional)

TypeDefault
stringSystem font bold (iOS), Sans Serif Black (android)

fontStyle#

specify text styling (optional)

TypeDefault
object (style)none

fontWeight#

specify font weight of title if set as a button with a title

TypeDefault
stringbold (ios), black(android)

iconColor#

icon color (optional)

TypeDefault
stringwhite

iconSize#

icon size (optional)

TypeDefault
number24

iconStyle#

extra styling for icon component (optional)

TypeDefault
object (style)none

iconType#

type of icon set. Supported sets here.

TypeDefault
stringfont-awesome

light#

reverses icon color scheme, setting background to white and icon to primary color

TypeDefault
booleanfalse

loading#

shows loading indicator (optional)

TypeDefault
booleanfalse

onLongPress#

onLongPress method (optional)

TypeDefault
functionnone

onPress#

onPress method (optional)

TypeDefault
functionnone

raised#

raised adds a drop shadow, set to false to remove

TypeDefault
booleantrue

style#

button styling (optional)

TypeDefault
object (style)none

title#

title if made into a button (optional)

TypeDefault
stringnone

type#

social media type (required)

TypeDefault
social media type (angellist, codepen, envelope, etsy, facebook, facebook-messenger, flickr, foursquare, github-alt, github, gitlab, instagram, linkedin, medium, pinterest, quora, reddit-alien, soundcloud, stack-overflow, steam, stumbleupon, tumblr, twitch, twitter, google, google-plus-official, vimeo, vk, weibo, whatsapp, wordpress, youtube, microsoft)none

underlayColor#

underlay color (optional)

TypeDefault
stringnone