main
alex 2023-07-07 00:34:48 +02:00
parent 81bd71a3cb
commit 81138e7e0c
1 changed files with 34 additions and 2 deletions

36
App.js
View File

@ -1,13 +1,37 @@
import React, {useState} from 'react'; import React, {useState} from 'react';
import {SafeAreaView, StyleSheet, Text, useColorScheme} from 'react-native'; import {
import {Button, MD3Colors, ProgressBar, TextInput} from 'react-native-paper'; SafeAreaView,
StyleSheet,
Text,
View,
useColorScheme,
} from 'react-native';
import {
Button,
MD3Colors,
ProgressBar,
Searchbar,
Snackbar,
Switch,
TextInput,
} from 'react-native-paper';
import {Colors} from 'react-native/Libraries/NewAppScreen'; import {Colors} from 'react-native/Libraries/NewAppScreen';
function App() { function App() {
const [text, setText] = useState(''); const [text, setText] = useState('');
const [visible, setVisible] = useState(false);
const [isSwitchOn, setIsSwitchOn] = React.useState(false);
const onToggleSwitch = () => setIsSwitchOn(!isSwitchOn);
const isDarkMode = useColorScheme() === 'dark'; const isDarkMode = useColorScheme() === 'dark';
const [searchQuery, setSearchQuery] = React.useState('');
const onChangeSearch = query => setSearchQuery(query);
const backgroundStyle = { const backgroundStyle = {
backgroundColor: isDarkMode ? Colors.darker : Colors.lighter, backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
}; };
@ -20,6 +44,14 @@ function App() {
<ProgressBar progress={0.3} color={MD3Colors.error50} /> <ProgressBar progress={0.3} color={MD3Colors.error50} />
<TextInput label="Email" /> <TextInput label="Email" />
<Switch value={isSwitchOn} onValueChange={onToggleSwitch} />
<Searchbar
placeholder="Search"
onChangeText={onChangeSearch}
value={searchQuery}
/>
</SafeAreaView> </SafeAreaView>
); );
} }