Themming
This commit is contained in:
22
App.js
22
App.js
@@ -4,7 +4,7 @@ import { StyleSheet, Text, View, TextInput, SafeAreaView } from 'react-native';
|
|||||||
import API from './API.js';
|
import API from './API.js';
|
||||||
import LoginForm from './components/Login.js';
|
import LoginForm from './components/Login.js';
|
||||||
import { Provider as PaperProvider } from 'react-native-paper';
|
import { Provider as PaperProvider } from 'react-native-paper';
|
||||||
import AwesomeIcon from 'react-native-vector-icons/FontAwesome';
|
import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
|
||||||
import { NavigationContainer } from '@react-navigation/native';
|
import { NavigationContainer } from '@react-navigation/native';
|
||||||
import { createNativeStackNavigator } from '@react-navigation/native-stack';
|
import { createNativeStackNavigator } from '@react-navigation/native-stack';
|
||||||
import Login from "./Views/Login.js"
|
import Login from "./Views/Login.js"
|
||||||
@@ -20,16 +20,16 @@ export default function App() {
|
|||||||
return (
|
return (
|
||||||
<NavigationContainer>
|
<NavigationContainer>
|
||||||
<Tab.Navigator initialRouteName="Home"
|
<Tab.Navigator initialRouteName="Home"
|
||||||
activeColor="#f0edf6"
|
activeColor="#0d6efd"
|
||||||
inactiveColor="#3e2465"
|
inactiveColor="#FFFFFF"
|
||||||
barStyle={{ backgroundColor: '#694fad' }}>
|
barStyle={{ backgroundColor: '#000000' }}>
|
||||||
<Tab.Screen
|
<Tab.Screen
|
||||||
name="Feed"
|
name="Feed"
|
||||||
component={Feed}
|
component={Feed}
|
||||||
options={{
|
options={{
|
||||||
tabBarLabel: 'Home',
|
tabBarLabel: 'Home',
|
||||||
tabBarIcon: ({ color }) => (
|
tabBarIcon: ({ color }) => (
|
||||||
<AwesomeIcon name="home" color={color} size={26} />
|
<MaterialIcons name="home" color={color} size={26} />
|
||||||
),
|
),
|
||||||
tabBarBadge: false
|
tabBarBadge: false
|
||||||
}}
|
}}
|
||||||
@@ -39,7 +39,17 @@ export default function App() {
|
|||||||
},
|
},
|
||||||
})}
|
})}
|
||||||
/>
|
/>
|
||||||
<Tab.Screen name="Profile" component={Profile} />
|
<Tab.Screen
|
||||||
|
name="Profile"
|
||||||
|
component={Profile}
|
||||||
|
options={{
|
||||||
|
tabBarLabel: 'Profile',
|
||||||
|
tabBarIcon: ({ color }) => (
|
||||||
|
<MaterialIcons name="person" color={color} size={26} />
|
||||||
|
),
|
||||||
|
tabBarBadge: false
|
||||||
|
}}
|
||||||
|
/>
|
||||||
<Tab.Screen name="Logou" component={Login} />
|
<Tab.Screen name="Logou" component={Login} />
|
||||||
</Tab.Navigator>
|
</Tab.Navigator>
|
||||||
</NavigationContainer>
|
</NavigationContainer>
|
||||||
|
|||||||
@@ -3,10 +3,20 @@ import React, { useState, useEffect } from 'react';
|
|||||||
import { View, ActivityIndicator, StyleSheet, SafeAreaView, FlatList } from 'react-native';
|
import { View, ActivityIndicator, StyleSheet, SafeAreaView, FlatList } from 'react-native';
|
||||||
import API from './../API.js';
|
import API from './../API.js';
|
||||||
import Post from './../components/Post.js';
|
import Post from './../components/Post.js';
|
||||||
import { Provider as PaperProvider } from 'react-native-paper';
|
import { Provider as PaperProvider, DefaultTheme, } from 'react-native-paper';
|
||||||
import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
|
import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
|
||||||
import NewPost from "./../components/NewPost.js";
|
import NewPost from "./../components/NewPost.js";
|
||||||
|
|
||||||
|
const theme = {
|
||||||
|
...DefaultTheme,
|
||||||
|
roundness: 2,
|
||||||
|
colors: {
|
||||||
|
...DefaultTheme.colors,
|
||||||
|
primary: '#000000',
|
||||||
|
accent: '#0d6efd',
|
||||||
|
background: "#edf2f7",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
let Feed = ({ navigation, route }) => {
|
let Feed = ({ navigation, route }) => {
|
||||||
@@ -33,7 +43,7 @@ let Feed = ({ navigation, route }) => {
|
|||||||
return (
|
return (
|
||||||
<PaperProvider settings={{
|
<PaperProvider settings={{
|
||||||
icon: props => <MaterialIcons {...props} />,
|
icon: props => <MaterialIcons {...props} />,
|
||||||
}}>
|
}} theme={theme}>
|
||||||
<SafeAreaView style={styles.container}>
|
<SafeAreaView style={styles.container}>
|
||||||
<View>
|
<View>
|
||||||
<FlatList
|
<FlatList
|
||||||
|
|||||||
Reference in New Issue
Block a user