GeekyAnts / NativeBase

Mobile-first, accessible components for React Native & Web to build consistent UI across Android, iOS and Web.
https://nativebase.io/
MIT License
20.1k stars 2.37k forks source link

icons not working except ios-* #425

Closed hishamkaram closed 7 years ago

hishamkaram commented 7 years ago

i am trying to use login icon but not working any icon starts with ios- work fine image code :

<Row style={styles.row}>

                            <Text style={styles.login}>
                                <Icon name='login'/> Login
                            </Text>
                        </Row>
sankhadeeproy007 commented 7 years ago

That is because login is an invalid icon name. You see that yellow bar down below? That is the warning message. Click on it and it'll give you the names of all the valid icon names.

hishamkaram commented 7 years ago

@sankhadeeproy007 where is the list of valid icons to search in it ? any link

sankhadeeproy007 commented 7 years ago

NativeBase uses this for icons. Please check there for the complete list.

brankopesevski commented 7 years ago

@sankhadeeproy007 I cannot understand you and your arrogance. The issue stated is clear, let me quote it again: "i am trying to use login icon but not working, any icon starts with ios- work fine".

So I run into this problem to. And in the link you @sankhadeeproy007 provide there is icon named "login". CTRL+F write "login" and you get it.

If you read the yellow warning it states that the prop types are the icon-set loaded from Ionicons by Ben Sperry, but if you open the list there are more icons there. So if you go to the source code, you will see that if you do not state a theme that uses different icon-set it will default to IonIcons, the one that start with the ios- prefix. But I don't understand why is that. There is no performance gain, all of the icons are required at the top.

Check it here https://github.com/GeekyAnts/NativeBase/blob/master/Components/Widgets/Icon/index.js

Poor design. We are forking and fixing this soon.

sankhadeeproy007 commented 7 years ago

@brankopesevski I cannot understand you but totally understand your ignorance. login is an invalid name because of the incorrect icon family. Is it a mistake that we didn't mention that we have set Ionicons as the default family? Yes. Have we documented it somewhere that we can change the icon family to a different one? Yes. Did you go through the docs and try changing the iconFamily and then try login? Apparently no.

We set the default to Ionicons because it looks and feels closest to the native icons. You are ofcourse free to change it whatever you wish to.

Poor design? Maybe. There is always room for improvement. Eagerly waiting for your

forking and fixing

brankopesevski commented 7 years ago

My ignorance? LOL

  1. You closed the issue with the statement

That is because login is an invalid icon name.

and than you gave the link with the icons from which there is icon with the name login

  1. You didn't bothered to explain how the icons work with themes to @hishamkaram

So please, stop it about my ignorance.

Next, about the documentation. If I have to go to NativeBase Theme Variables to discover there is iconFamily variable used in the source code and than to go to the source code to discover that Icons work with switch statement where there is only one possible Icon-set to be used, than call me ignorant. I want to discover that when I am in the icon section of the documentation.

Pardon my ignorance, I am pessimist that the PR for the fix will be accepted as it will break a lot of stuff that I don't need In my use-case but other users of this components maybe will need it. Actually I am not sure if NativeBase will be part of my tools as I was expecting to save me some time in development but from my initial experience with it (less than 8 hours) I am spending more time browsing through the source code than actual product development.

If me and my team came to easy and elegant fix we are happy to contribute and create PR.

sankhadeeproy007 commented 7 years ago

I closed it because this issue is a duplicate of #389, #358, #211, #209, #111, #64 and #62. You can LOL all you want to, but if you don't bother to check the previous issues regarding the same question and go all aggressive at me for closing a duplicate (with atleast 5 previous instances), ignorant fits you pretty well. Still waiting for your elegant fix though!

brankopesevski commented 7 years ago

Not a duplicate, and I did checked all issues related to Icon and Icons keyword. Even if it was a duplicate, you should mention that before closing the issue. Sorry for my aggressive approach, it is just a reaction to a closed issue without proper answer.

As I said before, I will submit PR only if I found an elegant fix that will not break the weird theme related design.

sankhadeeproy007 commented 7 years ago

If you did indeed check the aforementioned issues and still think that it's not a duplicate, there's no point in taking this discussion further. Also I'm curious to know where you get this sense of entitlement from. If you think this design is weird/poor, please suggest an alternative. We'd be happy to fix it and make it more user friendly. Or better still elegantly fix and fork this soon?

amanthegreatone commented 7 years ago

if it helps anyone this is the error message from the console. I was using fa-arrows as the icon name instead of just arrows (FontAwesome). This throws a list of icon names to be used.

This is the code i was running <Icon name='fa-arrows' style={{fontSize: 25, color:'black'}}/>

I think these are all from the default icon family.

Failed prop type: Invalid prop name of value fa-arrows supplied to Icon, expected one of ["ios-add","ios-add-circle","ios-add-circle-outline","ios-add-outline","ios-alarm","ios-alarm-outline","ios-albums","ios-albums-outline","ios-alert","ios-alert-outline","ios-american-football","ios-american-football-outline","ios-analytics","ios-analytics-outline","ios-aperture","ios-aperture-outline","ios-apps","ios-apps-outline","ios-appstore","ios-appstore-outline","ios-archive","ios-archive-outline","ios-arrow-back","ios-arrow-back-outline","ios-arrow-down","ios-arrow-down-outline","ios-arrow-dropdown","ios-arrow-dropdown-circle","ios-arrow-dropdown-circle-outline","ios-arrow-dropdown-outline","ios-arrow-dropleft","ios-arrow-dropleft-circle","ios-arrow-dropleft-circle-outline","ios-arrow-dropleft-outline","ios-arrow-dropright","ios-arrow-dropright-circle","ios-arrow-dropright-circle-outline","ios-arrow-dropright-outline","ios-arrow-dropup","ios-arrow-dropup-circle","ios-arrow-dropup-circle-outline","ios-arrow-dropup-outline","ios-arrow-forward","ios-arrow-forward-outline","ios-arrow-round-back","ios-arrow-round-back-outline","ios-arrow-round-down","ios-arrow-round-down-outline","ios-arrow-round-forward","ios-arrow-round-forward-outline","ios-arrow-round-up","ios-arrow-round-up-outline","ios-arrow-up","ios-arrow-up-outline","ios-at","ios-at-outline","ios-attach","ios-attach-outline","ios-backspace","ios-backspace-outline","ios-barcode","ios-barcode-outline","ios-baseball","ios-baseball-outline","ios-basket","ios-basket-outline","ios-basketball","ios-basketball-outline","ios-battery-charging","ios-battery-charging-outline","ios-battery-dead","ios-battery-dead-outline","ios-battery-full","ios-battery-full-outline","ios-beaker","ios-beaker-outline","ios-beer","ios-beer-outline","ios-bicycle","ios-bicycle-outline","ios-bluetooth","ios-bluetooth-outline","ios-boat","ios-boat-outline","ios-body","ios-body-outline","ios-bonfire","ios-bonfire-outline","ios-book","ios-book-outline","ios-bookmark","ios-bookmark-outline","ios-bookmarks","ios-bookmarks-outline","ios-bowtie","ios-bowtie-outline","ios-briefcase","ios-briefcase-outline","ios-browsers","ios-browsers-outline","ios-brush","ios-brush-outline","ios-bug","ios-bug-outline","ios-build","ios-build-outline","ios-bulb","ios-bulb-outline","ios-bus","ios-bus-outline","ios-cafe","ios-cafe-outline","ios-calculator","ios-calculator-outline","ios-calendar","ios-calendar-outline","ios-call","ios-call-outline","ios-camera","ios-camera-outline","ios-car","ios-car-outline","ios-card","ios-card-outline","ios-cart","ios-cart-outline","ios-cash","ios-cash-outline","ios-chatboxes","ios-chatboxes-outline","ios-chatbubbles","ios-chatbubbles-outline","ios-checkbox","ios-checkbox-outline","ios-checkmark","ios-checkmark-circle","ios-checkmark-circle-outline","ios-checkmark-outline","ios-clipboard","ios-clipboard-outline","ios-clock","ios-clock-outline","ios-close","ios-close-circle","ios-close-circle-outline","ios-close-outline","ios-closed-captioning","ios-closed-captioning-outline","ios-cloud","ios-cloud-circle","ios-cloud-circle-outline","ios-cloud-done","ios-cloud-done-outline","ios-cloud-download","ios-cloud-download-outline","ios-cloud-outline","ios-cloud-upload","ios-cloud-upload-outline","ios-cloudy","ios-cloudy-night","ios-cloudy-night-outline","ios-cloudy-outline","ios-code","ios-code-download","ios-code-download-outline","ios-code-outline","ios-code-working","ios-code-working-outline","ios-cog","ios-cog-outline","ios-color-fill","ios-color-fill-outline","ios-color-filter","ios-color-filter-outline","ios-color-palette","ios-color-palette-outline","ios-color-wand","ios-color-wand-outline","ios-compass","ios-compass-outline","ios-construct","ios-construct-outline","ios-contact","ios-contact-outline","ios-contacts","ios-contacts-outline","ios-contract","ios-contract-outline","ios-contrast","ios-contrast-outline","ios-copy","ios-copy-outline","ios-create","ios-create-outline","ios-crop","ios-crop-outline","ios-cube","ios-cube-outline","ios-cut","ios-cut-outline","ios-desktop","ios-desktop-outline","ios-disc","ios-disc-outline","ios-document","ios-document-outline","ios-done-all","ios-done-all-outline","ios-download","ios-download-outline","ios-easel","ios-easel-outline","ios-egg","ios-egg-outline","ios-exit","ios-exit-outline","ios-expand","ios-expand-outline","ios-eye","ios-eye-off","ios-eye-off-outline","ios-eye-outline","ios-fastforward","ios-fastforward-outline","ios-female","ios-female-outline","ios-filing","ios-filing-outline","ios-film","ios-film-outline","ios-finger-print","ios-finger-print-outline","ios-flag","ios-flag-outline","ios-flame","ios-flame-outline","ios-flash","ios-flash-outline","ios-flask","ios-flask-outline","ios-flower","ios-flower-outline","ios-folder","ios-folder-open","ios-folder-open-outline","ios-folder-outline","ios-football","ios-football-outline","ios-funnel","ios-funnel-outline","ios-game-controller-a","ios-game-controller-a-outline","ios-game-controller-b","ios-game-controller-b-outline","ios-git-branch","ios-git-branch-outline","ios-git-commit","ios-git-commit-outline","ios-git-compare","ios-git-compare-outline","ios-git-merge","ios-git-merge-outline","ios-git-network","ios-git-network-outline","ios-git-pull-request","ios-git-pull-request-outline","ios-glasses","ios-glasses-outline","ios-globe","ios-globe-outline","ios-grid","ios-grid-outline","ios-hammer","ios-hammer-outline","ios-hand","ios-hand-outline","ios-happy","ios-happy-outline","ios-headset","ios-headset-outline","ios-heart","ios-heart-outline","ios-help","ios-help-buoy","ios-help-buoy-outline","ios-help-circle","ios-help-circle-outline","ios-help-outline","ios-home","ios-home-outline","ios-ice-cream","ios-ice-cream-outline","ios-image","ios-image-outline","ios-images","ios-images-outline","ios-infinite","ios-infinite-outline","ios-information","ios-information-circle","ios-information-circle-outline","ios-information-outline","ios-ionic","ios-ionic-outline","ios-ionitron","ios-ionitron-outline","ios-jet","ios-jet-outline","ios-key","ios-key-outline","ios-keypad","ios-keypad-outline","ios-laptop","ios-laptop-outline","ios-leaf","ios-leaf-outline","ios-link","ios-link-outline","ios-list","ios-list-box","ios-list-box-outline","ios-list-outline","ios-locate","ios-locate-outline","ios-lock","ios-lock-outline","ios-log-in","ios-log-in-outline","ios-log-out","ios-log-out-outline","ios-magnet","ios-magnet-outline","ios-mail","ios-mail-open","ios-mail-open-outline","ios-mail-outline","ios-male","ios-male-outline","ios-man","ios-man-outline","ios-map","ios-map-outline","ios-medal","ios-medal-outline","ios-medical","ios-medical-outline","ios-medkit","ios-medkit-outline","ios-megaphone","ios-megaphone-outline","ios-menu","ios-menu-outline","ios-mic","ios-mic-off","ios-mic-off-outline","ios-mic-outline","ios-microphone","ios-microphone-outline","ios-moon","ios-moon-outline","ios-more","ios-more-outline","ios-move","ios-move-outline","ios-musical-note","ios-musical-note-outline","ios-musical-notes","ios-musical-notes-outline","ios-navigate","ios-navigate-outline","ios-no-smoking","ios-no-smoking-outline","ios-notifications","ios-notifications-off","ios-notifications-off-outline","ios-notifications-outline","ios-nuclear","ios-nuclear-outline","ios-nutrition","ios-nutrition-outline","ios-open","ios-open-outline","ios-options","ios-options-outline","ios-outlet","ios-outlet-outline","ios-paper","ios-paper-outline","ios-paper-plane","ios-paper-plane-outline","ios-partly-sunny","ios-partly-sunny-outline","ios-pause","ios-pause-outline","ios-paw","ios-paw-outline","ios-people","ios-people-outline","ios-person","ios-person-add","ios-person-add-outline","ios-person-outline","ios-phone-landscape","ios-phone-landscape-outline","ios-phone-portrait","ios-phone-portrait-outline","ios-photos","ios-photos-outline","ios-pie","ios-pie-outline","ios-pin","ios-pin-outline","ios-pint","ios-pint-outline","ios-pizza","ios-pizza-outline","ios-plane","ios-plane-outline","ios-planet","ios-planet-outline","ios-play","ios-play-outline","ios-podium","ios-podium-outline","ios-power","ios-power-outline","ios-pricetag","ios-pricetag-outline","ios-pricetags","ios-pricetags-outline","ios-print","ios-print-outline","ios-pulse","ios-pulse-outline","ios-qr-scanner","ios-qr-scanner-outline","ios-quote","ios-quote-outline","ios-radio","ios-radio-button-off","ios-radio-button-off-outline","ios-radio-button-on","ios-radio-button-on-outline","ios-radio-outline","ios-rainy","ios-rainy-outline","ios-recording","ios-recording-outline","ios-redo","ios-redo-outline","ios-refresh","ios-refresh-circle","ios-refresh-circle-outline","ios-refresh-outline","ios-remove","ios-remove-circle","ios-remove-circle-outline","ios-remove-outline","ios-reorder","ios-reorder-outline","ios-repeat","ios-repeat-outline","ios-resize","ios-resize-outline","ios-restaurant","ios-restaurant-outline","ios-return-left","ios-return-left-outline","ios-return-right","ios-return-right-outline","ios-reverse-camera","ios-reverse-camera-outline","ios-rewind","ios-rewind-outline","ios-ribbon","ios-ribbon-outline","ios-rose","ios-rose-outline","ios-sad","ios-sad-outline","ios-school","ios-school-outline","ios-search","ios-search-outline","ios-send","ios-send-outline","ios-settings","ios-settings-outline","ios-share","ios-share-alt","ios-share-alt-outline","ios-share-outline","ios-shirt","ios-shirt-outline","ios-shuffle","ios-shuffle-outline","ios-skip-backward","ios-skip-backward-outline","ios-skip-forward","ios-skip-forward-outline","ios-snow","ios-snow-outline","ios-speedometer","ios-speedometer-outline","ios-square","ios-square-outline","ios-star","ios-star-half","ios-star-half-outline","ios-star-outline","ios-stats","ios-stats-outline","ios-stopwatch","ios-stopwatch-outline","ios-subway","ios-subway-outline","ios-sunny","ios-sunny-outline","ios-swap","ios-swap-outline","ios-switch","ios-switch-outline","ios-sync","ios-sync-outline","ios-tablet-landscape","ios-tablet-landscape-outline","ios-tablet-portrait","ios-tablet-portrait-outline","ios-tennisball","ios-tennisball-outline","ios-text","ios-text-outline","ios-thermometer","ios-thermometer-outline","ios-thumbs-down","ios-thumbs-down-outline","ios-thumbs-up","ios-thumbs-up-outline","ios-thunderstorm","ios-thunderstorm-outline","ios-time","ios-time-outline","ios-timer","ios-timer-outline","ios-train","ios-train-outline","ios-transgender","ios-transgender-outline","ios-trash","ios-trash-outline","ios-trending-down","ios-trending-down-outline","ios-trending-up","ios-trending-up-outline","ios-trophy","ios-trophy-outline","ios-umbrella","ios-umbrella-outline","ios-undo","ios-undo-outline","ios-unlock","ios-unlock-outline","ios-videocam","ios-videocam-outline","ios-volume-down","ios-volume-down-outline","ios-volume-mute","ios-volume-mute-outline","ios-volume-off","ios-volume-off-outline","ios-volume-up","ios-volume-up-outline","ios-walk","ios-walk-outline","ios-warning","ios-warning-outline","ios-watch","ios-watch-outline","ios-water","ios-water-outline","ios-wifi","ios-wifi-outline","ios-wine","ios-wine-outline","ios-woman","ios-woman-outline","logo-android","logo-angular","logo-apple","logo-bitcoin","logo-buffer","logo-chrome","logo-codepen","logo-css3","logo-designernews","logo-dribbble","logo-dropbox","logo-euro","logo-facebook","logo-foursquare","logo-freebsd-devil","logo-github","logo-google","logo-googleplus","logo-hackernews","logo-html5","logo-instagram","logo-javascript","logo-linkedin","logo-markdown","logo-nodejs","logo-octocat","logo-pinterest","logo-playstation","logo-python","logo-reddit","logo-rss","logo-sass","logo-skype","logo-snapchat","logo-steam","logo-tumblr","logo-tux","logo-twitch","logo-twitter","logo-usd","logo-vimeo","logo-whatsapp","logo-windows","logo-wordpress","logo-xbox","logo-yahoo","logo-yen","logo-youtube","md-add","md-add-circle","md-alarm","md-albums","md-alert","md-american-football","md-analytics","md-aperture","md-apps","md-appstore","md-archive","md-arrow-back","md-arrow-down","md-arrow-dropdown","md-arrow-dropdown-circle","md-arrow-dropleft","md-arrow-dropleft-circle","md-arrow-dropright","md-arrow-dropright-circle","md-arrow-dropup","md-arrow-dropup-circle","md-arrow-forward","md-arrow-round-back","md-arrow-round-down","md-arrow-round-forward","md-arrow-round-up","md-arrow-up","md-at","md-attach","md-backspace","md-barcode","md-baseball","md-basket","md-basketball","md-battery-charging","md-battery-dead","md-battery-full","md-beaker","md-beer","md-bicycle","md-bluetooth","md-boat","md-body","md-bonfire","md-book","md-bookmark","md-bookmarks","md-bowtie","md-briefcase","md-browsers","md-brush","md-bug","md-build","md-bulb","md-bus","md-cafe","md-calculator","md-calendar","md-call","md-camera","md-car","md-card","md-cart","md-cash","md-chatboxes","md-chatbubbles","md-checkbox","md-checkbox-outline","md-checkmark","md-checkmark-circle","md-checkmark-circle-outline","md-clipboard","md-clock","md-close","md-close-circle","md-closed-captioning","md-cloud","md-cloud-circle","md-cloud-done","md-cloud-download","md-cloud-outline","md-cloud-upload","md-cloudy","md-cloudy-night","md-code","md-code-download","md-code-working","md-cog","md-color-fill","md-color-filter","md-color-palette","md-color-wand","md-compass","md-construct","md-contact","md-contacts","md-contract","md-contrast","md-copy","md-create","md-crop","md-cube","md-cut","md-desktop","md-disc","md-document","md-done-all","md-download","md-easel","md-egg","md-exit","md-expand","md-eye","md-eye-off","md-fastforward","md-female","md-filing","md-film","md-finger-print","md-flag","md-flame","md-flash","md-flask","md-flower","md-folder","md-folder-open","md-football","md-funnel","md-game-controller-a","md-game-controller-b","md-git-branch","md-git-commit","md-git-compare","md-git-merge","md-git-network","md-git-pull-request","md-glasses","md-globe","md-grid","md-hammer","md-hand","md-happy","md-headset","md-heart","md-heart-outline","md-help","md-help-buoy","md-help-circle","md-home","md-ice-cream","md-image","md-images","md-infinite","md-information","md-information-circle","md-ionic","md-ionitron","md-jet","md-key","md-keypad","md-laptop","md-leaf","md-link","md-list","md-list-box","md-locate","md-lock","md-log-in","md-log-out","md-magnet","md-mail","md-mail-open","md-male","md-man","md-map","md-medal","md-medical","md-medkit","md-megaphone","md-menu","md-mic","md-mic-off","md-microphone","md-moon","md-more","md-move","md-musical-note","md-musical-notes","md-navigate","md-no-smoking","md-notifications","md-notifications-off","md-notifications-outline","md-nuclear","md-nutrition","md-open","md-options","md-outlet","md-paper","md-paper-plane","md-partly-sunny","md-pause","md-paw","md-people","md-person","md-person-add","md-phone-landscape","md-phone-portrait","md-photos","md-pie","md-pin","md-pint","md-pizza","md-plane","md-planet","md-play","md-podium","md-power","md-pricetag","md-pricetags","md-print","md-pulse","md-qr-scanner","md-quote","md-radio","md-radio-button-off","md-radio-button-on","md-rainy","md-recording","md-redo","md-refresh","md-refresh-circle","md-remove","md-remove-circle","md-reorder","md-repeat","md-resize","md-restaurant","md-return-left","md-return-right","md-reverse-camera","md-rewind","md-ribbon","md-rose","md-sad","md-school","md-search","md-send","md-settings","md-share","md-share-alt","md-shirt","md-shuffle","md-skip-backward","md-skip-forward","md-snow","md-speedometer","md-square","md-square-outline","md-star","md-star-half","md-star-outline","md-stats","md-stopwatch","md-subway","md-sunny","md-swap","md-switch","md-sync","md-tablet-landscape","md-tablet-portrait","md-tennisball","md-text","md-thermometer","md-thumbs-down","md-thumbs-up","md-thunderstorm","md-time","md-timer","md-train","md-transgender","md-trash","md-trending-down","md-trending-up","md-trophy","md-umbrella","md-undo","md-unlock","md-videocam","md-volume-down","md-volume-mute","md-volume-off","md-volume-up","md-walk","md-warning","md-watch","md-water","md-wifi","md-wine","md-woman"].

Added theme prop to the Icon and got another list of icon names.

<Icon theme={{ iconFamily: 'FontAwesome' }} name='fa-arrows' style={{fontSize: 25, color:'black'}}/>

Warning: Failed prop type: Invalid prop name of value fa-arrows supplied to Icon, expected one of ["glass","music","search","envelope-o","heart","star","star-o","user","film","th-large","th","th-list","check","remove","close","times","search-plus","search-minus","power-off","signal","gear","cog","trash-o","home","file-o","clock-o","road","download","arrow-circle-o-down","arrow-circle-o-up","inbox","play-circle-o","rotate-right","repeat","refresh","list-alt","lock","flag","headphones","volume-off","volume-down","volume-up","qrcode","barcode","tag","tags","book","bookmark","print","camera","font","bold","italic","text-height","text-width","align-left","align-center","align-right","align-justify","list","dedent","outdent","indent","video-camera","photo","image","picture-o","pencil","map-marker","adjust","tint","edit","pencil-square-o","share-square-o","check-square-o","arrows","step-backward","fast-backward","backward","play","pause","stop","forward","fast-forward","step-forward","eject","chevron-left","chevron-right","plus-circle","minus-circle","times-circle","check-circle","question-circle","info-circle","crosshairs","times-circle-o","check-circle-o","ban","arrow-left","arrow-right","arrow-up","arrow-down","mail-forward","share","expand","compress","plus","minus","asterisk","exclamation-circle","gift","leaf","fire","eye","eye-slash","warning","exclamation-triangle","plane","calendar","random","comment","magnet","chevron-up","chevron-down","retweet","shopping-cart","folder","folder-open","arrows-v","arrows-h","bar-chart-o","bar-chart","twitter-square","facebook-square","camera-retro","key","gears","cogs","comments","thumbs-o-up","thumbs-o-down","star-half","heart-o","sign-out","linkedin-square","thumb-tack","external-link","sign-in","trophy","github-square","upload","lemon-o","phone","square-o","bookmark-o","phone-square","twitter","facebook-f","facebook","github","unlock","credit-card","feed","rss","hdd-o","bullhorn","bell","certificate","hand-o-right","hand-o-left","hand-o-up","hand-o-down","arrow-circle-left","arrow-circle-right","arrow-circle-up","arrow-circle-down","globe","wrench","tasks","filter","briefcase","arrows-alt","group","users","chain","link","cloud","flask","cut","scissors","copy","files-o","paperclip","save","floppy-o","square","navicon","reorder","bars","list-ul","list-ol","strikethrough","underline","table","magic","truck","pinterest","pinterest-square","google-plus-square","google-plus","money","caret-down","caret-up","caret-left","caret-right","columns","unsorted","sort","sort-down","sort-desc","sort-up","sort-asc","envelope","linkedin","rotate-left","undo","legal","gavel","dashboard","tachometer","comment-o","comments-o","flash","bolt","sitemap","umbrella","paste","clipboard","lightbulb-o","exchange","cloud-download","cloud-upload","user-md","stethoscope","suitcase","bell-o","coffee","cutlery","file-text-o","building-o","hospital-o","ambulance","medkit","fighter-jet","beer","h-square","plus-square","angle-double-left","angle-double-right","angle-double-up","angle-double-down","angle-left","angle-right","angle-up","angle-down","desktop","laptop","tablet","mobile-phone","mobile","circle-o","quote-left","quote-right","spinner","circle","mail-reply","reply","github-alt","folder-o","folder-open-o","smile-o","frown-o","meh-o","gamepad","keyboard-o","flag-o","flag-checkered","terminal","code","mail-reply-all","reply-all","star-half-empty","star-half-full","star-half-o","location-arrow","crop","code-fork","unlink","chain-broken","question","info","exclamation","superscript","subscript","eraser","puzzle-piece","microphone","microphone-slash","shield","calendar-o","fire-extinguisher","rocket","maxcdn","chevron-circle-left","chevron-circle-right","chevron-circle-up","chevron-circle-down","html5","css3","anchor","unlock-alt","bullseye","ellipsis-h","ellipsis-v","rss-square","play-circle","ticket","minus-square","minus-square-o","level-up","level-down","check-square","pencil-square","external-link-square","share-square","compass","toggle-down","caret-square-o-down","toggle-up","caret-square-o-up","toggle-right","caret-square-o-right","euro","eur","gbp","dollar","usd","rupee","inr","cny","rmb","yen","jpy","ruble","rouble","rub","won","krw","bitcoin","btc","file","file-text","sort-alpha-asc","sort-alpha-desc","sort-amount-asc","sort-amount-desc","sort-numeric-asc","sort-numeric-desc","thumbs-up","thumbs-down","youtube-square","youtube","xing","xing-square","youtube-play","dropbox","stack-overflow","instagram","flickr","adn","bitbucket","bitbucket-square","tumblr","tumblr-square","long-arrow-down","long-arrow-up","long-arrow-left","long-arrow-right","apple","windows","android","linux","dribbble","skype","foursquare","trello","female","male","gittip","gratipay","sun-o","moon-o","archive","bug","vk","weibo","renren","pagelines","stack-exchange","arrow-circle-o-right","arrow-circle-o-left","toggle-left","caret-square-o-left","dot-circle-o","wheelchair","vimeo-square","turkish-lira","try","plus-square-o","space-shuttle","slack","envelope-square","wordpress","openid","institution","bank","university","mortar-board","graduation-cap","yahoo","google","reddit","reddit-square","stumbleupon-circle","stumbleupon","delicious","digg","pied-piper-pp","pied-piper-alt","drupal","joomla","language","fax","building","child","paw","spoon","cube","cubes","behance","behance-square","steam","steam-square","recycle","automobile","car","cab","taxi","tree","spotify","deviantart","soundcloud","database","file-pdf-o","file-word-o","file-excel-o","file-powerpoint-o","file-photo-o","file-picture-o","file-image-o","file-zip-o","file-archive-o","file-sound-o","file-audio-o","file-movie-o","file-video-o","file-code-o","vine","codepen","jsfiddle","life-bouy","life-buoy","life-saver","support","life-ring","circle-o-notch","ra","resistance","rebel","ge","empire","git-square","git","y-combinator-square","yc-square","hacker-news","tencent-weibo","qq","wechat","weixin","send","paper-plane","send-o","paper-plane-o","history","circle-thin","header","paragraph","sliders","share-alt","share-alt-square","bomb","soccer-ball-o","futbol-o","tty","binoculars","plug","slideshare","twitch","yelp","newspaper-o","wifi","calculator","paypal","google-wallet","cc-visa","cc-mastercard","cc-discover","cc-amex","cc-paypal","cc-stripe","bell-slash","bell-slash-o","trash","copyright","at","eyedropper","paint-brush","birthday-cake","area-chart","pie-chart","line-chart","lastfm","lastfm-square","toggle-off","toggle-on","bicycle","bus","ioxhost","angellist","cc","shekel","sheqel","ils","meanpath","buysellads","connectdevelop","dashcube","forumbee","leanpub","sellsy","shirtsinbulk","simplybuilt","skyatlas","cart-plus","cart-arrow-down","diamond","ship","user-secret","motorcycle","street-view","heartbeat","venus","mars","mercury","intersex","transgender","transgender-alt","venus-double","mars-double","venus-mars","mars-stroke","mars-stroke-v","mars-stroke-h","neuter","genderless","facebook-official","pinterest-p","whatsapp","server","user-plus","user-times","hotel","bed","viacoin","train","subway","medium","yc","y-combinator","optin-monster","opencart","expeditedssl","battery-4","battery","battery-full","battery-3","battery-three-quarters","battery-2","battery-half","battery-1","battery-quarter","battery-0","battery-empty","mouse-pointer","i-cursor","object-group","object-ungroup","sticky-note","sticky-note-o","cc-jcb","cc-diners-club","clone","balance-scale","hourglass-o","hourglass-1","hourglass-start","hourglass-2","hourglass-half","hourglass-3","hourglass-end","hourglass","hand-grab-o","hand-rock-o","hand-stop-o","hand-paper-o","hand-scissors-o","hand-lizard-o","hand-spock-o","hand-pointer-o","hand-peace-o","trademark","registered","creative-commons","gg","gg-circle","tripadvisor","odnoklassniki","odnoklassniki-square","get-pocket","wikipedia-w","safari","chrome","firefox","opera","internet-explorer","tv","television","contao","500px","amazon","calendar-plus-o","calendar-minus-o","calendar-times-o","calendar-check-o","industry","map-pin","map-signs","map-o","map","commenting","commenting-o","houzz","vimeo","black-tie","fonticons","reddit-alien","edge","credit-card-alt","codiepie","modx","fort-awesome","usb","product-hunt","mixcloud","scribd","pause-circle","pause-circle-o","stop-circle","stop-circle-o","shopping-bag","shopping-basket","hashtag","bluetooth","bluetooth-b","percent","gitlab","wpbeginner","wpforms","envira","universal-access","wheelchair-alt","question-circle-o","blind","audio-description","volume-control-phone","braille","assistive-listening-systems","asl-interpreting","american-sign-language-interpreting","deafness","hard-of-hearing","deaf","glide","glide-g","signing","sign-language","low-vision","viadeo","viadeo-square","snapchat","snapchat-ghost","snapchat-square","pied-piper","first-order","yoast","themeisle","google-plus-circle","google-plus-official","fa","font-awesome","handshake-o","envelope-open","envelope-open-o","linode","address-book","address-book-o","vcard","address-card","vcard-o","address-card-o","user-circle","user-circle-o","user-o","id-badge","drivers-license","id-card","drivers-license-o","id-card-o","quora","free-code-camp","telegram","thermometer-4","thermometer","thermometer-full","thermometer-3","thermometer-three-quarters","thermometer-2","thermometer-half","thermometer-1","thermometer-quarter","thermometer-0","thermometer-empty","shower","bathtub","s15","bath","podcast","window-maximize","window-minimize","window-restore","times-rectangle","window-close","times-rectangle-o","window-close-o","bandcamp","grav","etsy","imdb","ravelry","eercast","microchip","snowflake-o","superpowers","wpexplorer","meetup"].

For FontAwesome we dont need to use the fa prefix for the icon names.

sankhadeeproy007 commented 7 years ago

@amanthegreatone Please check #389 for you use case. Also the README has been updated for <Icon /> configuration.

gus-waritthorn commented 6 years ago

This way it work for me ! . Set type attribute depend on Bundled Icon Sets(list below) Example <Icon name="flash-off" type="MaterialIcons" /> . Bundled Icon Sets Entypo EvilIcons Feather FontAwesome Foundation Ionicons MaterialIcons MaterialCommunityIcons Octicons Zocial SimpleLineIcons . Nativebase use: react-native-vector-icons See full docs here: https://github.com/oblador/react-native-vector-icons

rottenoats commented 6 years ago

@waritthornnudee thank you. Saved me so much time.