How to switch to material design in Ui Kitten?

Question

I would like to use UI Kitten. I have seen in the documentation examples of components using Material Design and Eva Design. I would like to know how to switch to different styles. But I didn't find anything on how to do it.

But I didn't find anything in the documentation on how to do it.

Answer 1

You need to use ApplicationProvider and provide @eva-design/eva or @eva-design/material theme property. Here an example:

import React, {useState} from 'react';
import { ApplicationProvider, Layout, Text } from '@ui-kitten/components';
import * as eva from '@eva-design/eva';
import * as material from '@eva-design/material';

export default () => (
  const [theme, setTheme] = useState()
  <ApplicationProvider {...eva} theme={eva.light}>
    <Layout>
      <Button onPress={() => setTheme(material.light)}>
        Siwtch to material
      </Button>
    </Layout>
  </ApplicationProvider>
);