*Total -- 272.34kb -> 260.85kb (4.22%) /packages/stack/src/views/assets/back-icon-mask.png -- 1.58kb -> 0.89kb (43.61%) /example/assets/avatar-1.png -- 3.33kb -> 2.40kb (27.96%) /example/assets/avatar-2.png -- 2.29kb -> 1.67kb (26.87%) /example/assets/icon.png -- 1.07kb -> 0.88kb (17.51%) /example/assets/album-art-4.jpg -- 34.70kb -> 33.05kb (4.75%) /example/assets/album-art-1.jpg -- 28.85kb -> 27.58kb (4.38%) /example/assets/album-art-3.jpg -- 28.53kb -> 27.37kb (4.05%) /example/assets/book.jpg -- 97.60kb -> 94.13kb (3.56%) /example/assets/album-art-2.jpg -- 20.94kb -> 20.33kb (2.94%) /example/assets/album-art-6.jpg -- 22.07kb -> 21.57kb (2.26%) /example/assets/album-art-8.jpg -- 21.28kb -> 20.92kb (1.69%) /example/assets/album-art-7.jpg -- 10.10kb -> 10.05kb (0.5%) Signed-off-by: ImgBotApp <ImgBotHelp@gmail.com> Co-authored-by: Imgbot <help@imgbot.net>
@react-navigation/stack
Stack navigator for React Navigation.
Installation
Open a Terminal in your project's folder and run,
yarn add @react-navigation/native @react-navigation/stack @react-native-community/masked-view
Now we need to install react-native-gesture-handler, react-native-screens and react-native-safe-area-context.
If you are using Expo, to ensure that you get the compatible versions of the libraries, run:
expo install react-native-gesture-handler react-native-screens react-native-safe-area-context
If you are not using Expo, run the following:
yarn add react-native-gesture-handler react-native-screens react-native-safe-area-context
If you are using Expo, you are done. Otherwise, continue to the next steps.
To complete the linking on iOS, make sure you have Cocoapods installed. Then run:
cd ios
pod install
cd ..
To finalize installation of react-native-screens for Android, add the following two lines to dependencies section in android/app/build.gradle:
implementation 'androidx.appcompat:appcompat:1.1.0-rc01'
implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'
IMPORTANT: There are additional steps required for react-native-gesture-handler on Android after linking (for all React Native versions). Check the this guide to complete the installation.
Usage
import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
export default function App() {
return (
<Stack.Navigator>
<Stack.Screen name="home" component={Home} options={{ title: 'Home' }} />
<Stack.Screen name="feed" component={Feed} options={{ title: 'Feed' }} />
<Stack.Screen
name="profile"
component={Profile}
options={{ title: 'Profile' }}
/>
</Stack.Navigator>
);
}