EProcurement/ProcureLinc-Mobile-App
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: smooth navigation transitions + config updates

Browse Source 
- Migrate MainStack from JS stack to native-stack for native-thread,
  jank-free screen transitions (slide_from_right, fade for auth screens)
- Add shift animation to bottom tab switching
- Install @react-navigation/native-stack
- Update API URLs, Axios, Login and Android network security config

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Abin Toppo
2026-06-11 11:19:32 +05:30
co-authored by Claude Opus 4.8
parent 44e84ff6f1
commit 9acec328a7
14 changed files with 260 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/Navigation/Bottom.tsx
+2
View File
@@ -193,6 +193,8 @@ export default function BottomTab() {
screenOptions={{
headerShown: false,
tabBarHideOnKeyboard: true,
// Smooth cross-fade when switching tabs instead of an instant cut.
animation: 'shift',
}}
>
<Tab.Screen name="Home" component={Screens.Home} />
src/Navigation/MainStack.jsx
+35 -28
View File
@@ -1,42 +1,49 @@
import * as React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import NavigationString from '../Constant/NavigationString';
import Screens from '../Screens';
import colors from '../Constant/Color';
import BottomTab from './Bottom';
import Login from '../Screens/Login/Login';
const Stack = createNativeStackNavigator();
export default function MainStack() {
const Stack = createStackNavigator();
const option = { headerShown: false };
// ...
return (
<Stack.Navigator
// ...
screenOptions={{
headerShown: false,
// Native-thread driven transitions for smooth, jank-free navigation.
animation: 'slide_from_right',
animationDuration: 250,
gestureEnabled: true,
// Avoids a white/black flash between screens during the transition.
contentStyle: { backgroundColor: colors.white },
}}
>
<Stack.Screen name={NavigationString.Splash} component={Screens.Splash} options={option} />
<Stack.Screen name={NavigationString.Signup} component={Screens.Signup} options={option} />
<Stack.Screen name={NavigationString.Onboarding} component={Screens.Onboarding} options={option} />
<Stack.Screen name={NavigationString.Login} component={Login} options={option} />
<Stack.Screen name={NavigationString.Home} component={BottomTab} options={option} />
<Stack.Screen name={NavigationString.PurchaseList} component={Screens.PurchaseList} options={option} />
<Stack.Screen name={NavigationString.Emd} component={Screens.Emd} options={option} />
<Stack.Screen name={NavigationString.StartBidding} component={Screens.StartBidding} options={option} />
<Stack.Screen name={NavigationString.PurchaseAuctionList} component={Screens.PurchaseAuctionList} options={option} />
<Stack.Screen name={NavigationString.PurchaseTenderList} component={Screens.PurchaseTenderList} options={option} />
<Stack.Screen name={NavigationString.ProceedToPurTender} component={Screens.ProceedToPurTender} options={option} />
<Stack.Screen name={NavigationString.TenderBidding} component={Screens.TenderBidding} options={option} />
<Stack.Screen name={NavigationString.ProceedToBidDetail} component={Screens.ProceedToBidDetail} options={option} />
<Stack.Screen name={NavigationString.StartReverseBidding} component={Screens.StartReverseBidding} options={option} />
<Stack.Screen name={NavigationString.Registration} component={Screens.Registration} options={option} />
<Stack.Screen name={NavigationString.Partnership} component={Screens.Partnership} options={option} />
<Stack.Screen name={NavigationString.LiveTenderDetail} component={Screens.LiveTenderDetail} options={option} />
<Stack.Screen name={NavigationString.ResetPassword} component={Screens.ResetPassword} options={option} />
<Stack.Screen name={NavigationString.KycWebViewScreen} component={Screens.KycWebViewScreen} options={option} />
<Stack.Screen name={NavigationString.StageThreeScreen} component={Screens.StageThreeScreen} options={option} />
<Stack.Screen name={NavigationString.DecryptionScreen} component={Screens.DecryptionScreen} options={option} />
<Stack.Screen name={NavigationString.DeviceBinding} component={Screens.DeviceBinding} options={option} />
<Stack.Screen name={NavigationString.DscBinding} component={Screens.DscBinding} options={option} />
<Stack.Screen name={NavigationString.Splash} component={Screens.Splash} options={{ animation: 'fade' }} />
<Stack.Screen name={NavigationString.Signup} component={Screens.Signup} />
<Stack.Screen name={NavigationString.Onboarding} component={Screens.Onboarding} />
<Stack.Screen name={NavigationString.Login} component={Login} options={{ animation: 'fade' }} />
<Stack.Screen name={NavigationString.Home} component={BottomTab} options={{ animation: 'fade', gestureEnabled: false }} />
<Stack.Screen name={NavigationString.PurchaseList} component={Screens.PurchaseList} />
<Stack.Screen name={NavigationString.Emd} component={Screens.Emd} />
<Stack.Screen name={NavigationString.StartBidding} component={Screens.StartBidding} />
<Stack.Screen name={NavigationString.PurchaseAuctionList} component={Screens.PurchaseAuctionList} />
<Stack.Screen name={NavigationString.PurchaseTenderList} component={Screens.PurchaseTenderList} />
<Stack.Screen name={NavigationString.ProceedToPurTender} component={Screens.ProceedToPurTender} />
<Stack.Screen name={NavigationString.TenderBidding} component={Screens.TenderBidding} />
<Stack.Screen name={NavigationString.ProceedToBidDetail} component={Screens.ProceedToBidDetail} />
<Stack.Screen name={NavigationString.StartReverseBidding} component={Screens.StartReverseBidding} />
<Stack.Screen name={NavigationString.Registration} component={Screens.Registration} />
<Stack.Screen name={NavigationString.Partnership} component={Screens.Partnership} />
<Stack.Screen name={NavigationString.LiveTenderDetail} component={Screens.LiveTenderDetail} />
<Stack.Screen name={NavigationString.ResetPassword} component={Screens.ResetPassword} />
<Stack.Screen name={NavigationString.KycWebViewScreen} component={Screens.KycWebViewScreen} />
<Stack.Screen name={NavigationString.StageThreeScreen} component={Screens.StageThreeScreen} />
<Stack.Screen name={NavigationString.DecryptionScreen} component={Screens.DecryptionScreen} />
<Stack.Screen name={NavigationString.DeviceBinding} component={Screens.DeviceBinding} />
<Stack.Screen name={NavigationString.DscBinding} component={Screens.DscBinding} />
</Stack.Navigator>
);
}