UI changes

nolostra · Aug 25, 2023 · 37e59b2 · 37e59b2
1 parent 6c08aa6
commit 37e59b2
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 21 deletions.
diff --git a/TestBex/App.tsx b/TestBex/App.tsx
@@ -12,9 +12,9 @@ export default function App() {
   return (
     <NavigationContainer>
       <Stack.Navigator initialRouteName="Login">
-        <Stack.Screen name="Login" component={LoginScreen} />
-        <Stack.Screen name="Sharing" component={SharingScreen} />
-        <Stack.Screen name="pinlock" component={PinLockScreen} />
+        <Stack.Screen name="Login" component={LoginScreen} options={{ headerShown: false }} />
+        <Stack.Screen name="Sharing" component={SharingScreen} options={{ headerShown: false }}/>
+        <Stack.Screen name="pinlock" component={PinLockScreen} options={{ headerShown: false }} />
       </Stack.Navigator>
     </NavigationContainer>
   );

diff --git a/TestBex/screens/LoginScreen.js b/TestBex/screens/LoginScreen.js
@@ -46,18 +46,13 @@ export default function LoginScreen({ navigation }) {
 
   };
 
-  return (
-    <View style={{backgroundColor:'grey'}}>
-      <TextInput placeholder="Username" onChangeText={setUsername} />
-      <TextInput placeholder="Password" secureTextEntry onChangeText={setPassword} />
-      {/* <PinView onComplete={(value) => setPin(value)} /> */}
-      {/* <TextInput
-              placeholder="Enter PIN"
-              value={inputPin}
-              onChangeText={setInputPin}
-              secureTextEntry
-            /> */}
-      <Button title="Login" onPress={handleLogin} />
+  return ( 
+    <View style={{ backgroundColor: '#121212', flex: 1, alignItems: 'center', justifyContent: 'center' }}>
+    <View style={{ backgroundColor: '#1e1e1e', borderRadius: 10, padding: 20, width: '80%' }}>
+      <TextInput style={{ borderRadius: 10, marginBottom: 20, textAlign: 'center', padding: 15, backgroundColor: '#333', color: '#f0f0f0', fontSize: 16 }} placeholder="Username" placeholderTextColor="#999" onChangeText={setUsername} />
+      <TextInput style={{ borderRadius: 10, marginBottom: 20, textAlign: 'center', padding: 15, backgroundColor: '#333', color: '#f0f0f0', fontSize: 16 }} placeholder="Password" placeholderTextColor="#999" secureTextEntry onChangeText={setPassword} />
+      <Button title="Login" onPress={handleLogin} color="#007AFF" />
     </View>
+  </View>
   );
 }
diff --git a/TestBex/screens/SharingScreen.js b/TestBex/screens/SharingScreen.js
@@ -8,6 +8,7 @@ import RNFS from 'react-native-fs';
 import files from './data'
 export default function SharingScreen() {
   const [typeFile,setTypeFile] = useState('')
+  const [fileName, setFileName ] = useState('')
   const [fileUri, setFileUri] = useState('');
   const [message, setMessage] = useState('');
   useEffect(() => {
@@ -71,6 +72,7 @@ export default function SharingScreen() {
         type: [DocumentPicker.types.allFiles],
       });
       console.log("file",res)
+      setFileName(res.name)
       setTypeFile(res.type)
       setFileUri(res.uri);
       console.log(fileUri)
@@ -115,11 +117,18 @@ export default function SharingScreen() {
   };
 
   return (
-    <View style={{ backgroundColor: 'grey', flex: 1, justifyContent: 'center', alignItems: 'center' }}>
-      <Text>{fileUri ? `${fileUri}`:''}</Text> 
-      <Button title="Select File" onPress={handleFilePicker} />
-      <TextInput placeholder="Message" onChangeText={setMessage} />
-      <Button title="SHARE" onPress={handleShare} />
-    </View>
+    <View style={{ backgroundColor: '#121212', flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+    <Text style={{ fontSize: 18, marginBottom: 20, color: '#f0f0f0', padding:30 , backgroundColor: fileName ? '#1e1e1e' : '#121212' ,borderRadius: 10, marginHorizontal:20 }}>{fileName ? `Selected File: ${fileName}` : ''}</Text>
+    <Button title="Select File" onPress={handleFilePicker} color="#007AFF" />
+    <TextInput
+      style={{ borderRadius: 10, marginVertical: 20, padding: 15, width: '80%', backgroundColor: '#1e1e1e', fontSize: 16, color: '#f0f0f0' }}
+      placeholder="Message"
+      placeholderTextColor="#888"
+      onChangeText={setMessage}
+      value={message}
+    />
+    <Button title="SHARE" onPress={handleShare} color="#007AFF" />
+  </View>
+
   );
 }