search

akveo / kittenTricks

React Native starter kit with over 40 screens and modern Light and Dark theme for creating stunning cross-platform mobile applications.
https://akveo.github.io/react-native-ui-kitten/
MIT License
7.15k stars 987 forks source link

How to use the screens in my own project #204

Closed Hashedx99 closed 5 years ago

Hashedx99 commented 5 years ago

i'm trying to use this kit to implement some UI mainly the article screens , there is no documentation on how to use them whatsoever , all help is appreciated.

artyorsh commented 5 years ago

Hi @HSHABx99 Simply copy and paste the code of a screen you're interested in your project

Hashedx99 commented 5 years ago

Hi @artyorsh thanks for the fast reply , i tried to do that but it returns an error with invariant violation , and from what i tested it seems to be from container view

artyorsh commented 5 years ago

Did you follow Getting Started Guide?

Hashedx99 commented 5 years ago

Yes i did

artyorsh commented 5 years ago

Please provide a code you're trying to run

thechosenjuan commented 5 years ago

i'm trying to use this kit to implement some UI mainly the article screens , there is no documentation on how to use them whatsoever , all help is appreciated.

+1

thechosenjuan commented 5 years ago

I was also trying the same as @HSHABx99 is trying to do.

@artyorsh ,the Getting Started Guide talks about how to create screens with UI Kitten, but if I would like to use the 'Sign In 2' screen on my app, there's no documentation regarding the steps about implementing it.

artyorsh commented 5 years ago

@thechosenjuan this App is also built with UI Kitten. To get these screens running in your app with simple copy-paste, you should:

  1. Configure Application Root as described in the guide.
  2. Copy an existing code (Sign In 2 for your purposes) and paste to your app

What else stops you?

artyorsh commented 5 years ago

Note that this app is built with TypeScript, so you also need to remove type definitions if you don't use it

thechosenjuan commented 5 years ago

@thechosenjuan this App is also built with UI Kitten. To get these screens running in your app with simple copy-paste, you should:

1. [Configure Application Root](https://akveo.github.io/react-native-ui-kitten/docs/guides/install-ui-kitten) as described in the guide.

2. Copy an existing code (Sign In 2 for your purposes) and paste to your app

What else stops you?

@artyorsh the thing that 'stops' me, is that in the code you want me to copy/paste, there are references to other components in this repository. I've tried to do it once; it's at least a 4 component chain that needs to be copy/pasted. It gets confusing.

The original question of @HSHABx99 refers to if there's a way to 'import' the screens the same way that we import the 'theme' from react-native-ui-kitten.

artyorsh commented 5 years ago

Ah, sorry for the misunderstanding. So the answer is that you can't. Like any production app, Kitten Tricks has common components that are shared between screens. So you also need to copy and paste them too. There is no automation tool for that.

we import the 'theme' from react-native-ui-kitten.

UI Kitten exports basic components. It's a UI Kit, not a package of production-ready layouts.

thechosenjuan commented 5 years ago

@artyorsh got it.

Thanks for the reply.

thechosenjuan commented 5 years ago

@HSHABx99 what I would suggest you to do is use this repository as a base template, and build your app on top of it.