Have error when use Icon component

[DinhHuyHoang]

Issue type

I'm submitting a ... (check one with "x")

• [x] bug report
• [ ] feature request

Issue description

Current behavior:

When I use Icon component, sometime I encounter error "view nested within a text must have a width and height"

Expected behavior:

It should not have error and crash app Steps to reproduce:

Use Icon component Related code:

Not applicable.

Other information:

OS, device, package version

samsung device
"react-native": "0.60.5"
"react": "16.9.0"
"@ui-kitten/eva-icons": "4.2.0-beta.2"
"@eva-design/eva": "1.1.0-beta.1"

[artyorsh]

Hi, please provide related code on how do you use this component. Thanks

[DinhHuyHoang]

Hi,

This is some examples that I use Icon component. I don't know where fired error. But when a replace and use package "react-native-eva-icons": "1.1.0", the error don't occurred.

On Sat, Sep 21, 2019 at 8:54 PM Artur Yorsh notifications@github.com wrote:

Hi, please provide related code on how do you use this component. Thanks

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/akveo/react-native-ui-kitten/issues/633?email_source=notifications&email_token=AGHR4HOGO5GDKJ77AL7PGGDQKYRQRA5CNFSM4IY6DQLKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD7ISGXY#issuecomment-533799775, or mute the thread https://github.com/notifications/unsubscribe-auth/AGHR4HJ2BATII7GLL7QXQGDQKYRQRANCNFSM4IY6DQLA .

[artyorsh]

@DinhHuyHoang unfortunately, there is no code I can see to determine what's wrong. I would like to see how do you use Icon, if possible

[DinhHuyHoang]

I sent two image attaches above.

this is some code I used Icon component, because it have error then I replace with package "react-native-eva-icons".

Two links bellow are code example in my project, I just know when I use "react-native-eva-icons", the error not fired,

Please, check my code and if have any problem tell me know.

Thanks you.

http://codepad.org/E8oApexl http://codepad.org/1knu3Abt

On Mon, Sep 23, 2019 at 4:06 PM Artur Yorsh notifications@github.com wrote:

@DinhHuyHoang https://github.com/DinhHuyHoang unfortunately, there is no code I can see to determine what's wrong. I would like to see how do you use Icon, if possible

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/akveo/react-native-ui-kitten/issues/633?email_source=notifications&email_token=AGHR4HJI3HXRTABVZME6QWDQLCBIFA5CNFSM4IY6DQLKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD7KHGQI#issuecomment-534016833, or mute the thread https://github.com/notifications/unsubscribe-auth/AGHR4HNQ2JS2RV5RQUM32K3QLCBIFANCNFSM4IY6DQLA .

[artyorsh]

Have you instantiated IconRegistry like it is described in this guide?

[DinhHuyHoang]

Yes, I did

this is my implementation code http://codepad.org/JKZ4gfM9

On Tue, Sep 24, 2019 at 5:51 PM Artur Yorsh notifications@github.com wrote:

Have you instantiated IconRegistry like it is described in this guide https://akveo.github.io/react-native-ui-kitten/docs/guides/eva-icons?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/akveo/react-native-ui-kitten/issues/633?email_source=notifications&email_token=AGHR4HJDOFMNPV7VAYIGDL3QLHWLVA5CNFSM4IY6DQLKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD7N6CDI#issuecomment-534503693, or mute the thread https://github.com/notifications/unsubscribe-auth/AGHR4HI5LVC6PLCKXMFIY2DQLHWLVANCNFSM4IY6DQLA .

[artyorsh]

Please try refactoring to something like this as it looks like we were wrong about this guide The main point is to render IconRegistry before ApplicationProvider.

import React from 'react';
import { mapping, light as lightTheme } from '@eva-design/eva';
import { EvaIconsPack } from '@ui-kitten/eva-icons';
import { ApplicationProvider, IconRegistry, Layout, Text } from 'react-native-ui-kitten';

const App = () => (
  <React.Fragment>
    <IconRegistry icons={EvaIconsPack} />
    <ApplicationProvider
      mapping={mapping}
      theme={lightTheme}>
      <YourApp />
    </ApplicationProvider>
  <React.Fragment />
);

export default App;

[DinhHuyHoang]

I solved my problem, the error fired when I wrap Text component with Icon component

Thank for your help.

On Wed, Sep 25, 2019 at 12:41 AM Artur Yorsh notifications@github.com wrote:

Please try refactoring to something like this as it looks like we were wrong about this guide The main point is to render IconRegistry before ApplicationProvider.

import React from 'react';import { mapping, light as lightTheme } from '@eva-design/eva';import { EvaIconsPack } from '@ui-kitten/eva-icons';import { ApplicationProvider, IconRegistry, Layout, Text } from 'react-native-ui-kitten'; const App = () => (

); export default App;`` — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub , or mute the thread .