From ecb77e645af077bb6d790c10df0fe12d0251aa04 Mon Sep 17 00:00:00 2001 From: troZee <12766071+troZee@users.noreply.github.com> Date: Wed, 30 Aug 2023 22:11:04 +0200 Subject: [PATCH] chore: remove fabric example and migrate to 72 (#730) * chore: remove fabric example and add old arch support for the example * Apply fixes * use JS stack instead of the native one * change to false * migrate to 72 * fix lint * change maestro version * change android workflow * Revert "change android workflow" This reverts commit d42ccec1acc5021cd18ada5d0d3e86584e0fa8d2. * upload artifacts * record a video * just a basic example * turn off new architecture * update podflie.lock --------- Co-authored-by: Piotr Trocki --- .eslintrc.js | 2 +- .github/workflows/android.yml | 49 +- .gitignore | 8 +- README.md | 58 +- example/.node-version | 1 - example/Gemfile | 4 +- example/Gemfile.lock | 30 +- example/android/app/build.gradle | 3 + .../android/app/src/main/AndroidManifest.xml | 39 +- .../com/pagerviewexample/MainActivity.java | 10 +- .../app/src/main/res/layout/activity_main.xml | 28 + example/android/build.gradle | 57 +- example/android/gradle.properties | 2 +- .../gradle/wrapper/gradle-wrapper.properties | 3 +- example/android/gradlew | 20 +- example/android/gradlew.bat | 17 +- example/android/settings.gradle | 2 +- .../project.pbxproj | 2 + example/ios/PagerViewExample/AppDelegate.mm | 10 - example/ios/Podfile | 15 +- example/ios/Podfile.lock | 662 ++- example/jest.config.js | 3 + example/metro.config.js | 17 +- example/package.json | 30 +- example/src/App.tsx | 105 +- example/src/PaperExample.tsx | 198 + example/yarn.lock | 3001 +++++++---- fabricexample/.buckconfig | 6 - fabricexample/.bundle/config | 2 - fabricexample/.ruby-version | 1 - fabricexample/.watchmanconfig | 1 - fabricexample/Gemfile | 6 - fabricexample/Gemfile.lock | 100 - fabricexample/__tests__/App-test.tsx | 3 - fabricexample/_node-version | 1 - fabricexample/android/app/_BUCK | 55 - fabricexample/android/app/build.gradle | 313 -- fabricexample/android/app/build_defs.bzl | 19 - fabricexample/android/app/debug.keystore | Bin 2257 -> 0 bytes fabricexample/android/app/proguard-rules.pro | 10 - .../android/app/src/debug/AndroidManifest.xml | 13 - .../com/fabricexample/ReactNativeFlipper.java | 73 - .../android/app/src/main/AndroidManifest.xml | 26 - .../java/com/fabricexample/MainActivity.java | 48 - .../com/fabricexample/MainApplication.java | 91 - .../MainApplicationReactNativeHost.java | 116 - .../components/MainComponentsRegistry.java | 36 - ...ApplicationTurboModuleManagerDelegate.java | 48 - .../android/app/src/main/jni/CMakeLists.txt | 7 - .../jni/MainApplicationModuleProvider.cpp | 32 - .../main/jni/MainApplicationModuleProvider.h | 16 - ...nApplicationTurboModuleManagerDelegate.cpp | 45 - ...ainApplicationTurboModuleManagerDelegate.h | 38 - .../src/main/jni/MainComponentsRegistry.cpp | 65 - .../app/src/main/jni/MainComponentsRegistry.h | 32 - .../android/app/src/main/jni/OnLoad.cpp | 11 - .../res/drawable/rn_edit_text_material.xml | 36 - .../src/main/res/mipmap-hdpi/ic_launcher.png | Bin 3056 -> 0 bytes .../res/mipmap-hdpi/ic_launcher_round.png | Bin 5024 -> 0 bytes .../src/main/res/mipmap-mdpi/ic_launcher.png | Bin 2096 -> 0 bytes .../res/mipmap-mdpi/ic_launcher_round.png | Bin 2858 -> 0 bytes .../src/main/res/mipmap-xhdpi/ic_launcher.png | Bin 4569 -> 0 bytes .../res/mipmap-xhdpi/ic_launcher_round.png | Bin 7098 -> 0 bytes .../main/res/mipmap-xxhdpi/ic_launcher.png | Bin 6464 -> 0 bytes .../res/mipmap-xxhdpi/ic_launcher_round.png | Bin 10676 -> 0 bytes .../main/res/mipmap-xxxhdpi/ic_launcher.png | Bin 9250 -> 0 bytes .../res/mipmap-xxxhdpi/ic_launcher_round.png | Bin 15523 -> 0 bytes .../app/src/main/res/values/strings.xml | 3 - .../app/src/main/res/values/styles.xml | 9 - fabricexample/android/build.gradle | 55 - fabricexample/android/gradle.properties | 40 - .../android/gradle/wrapper/gradle-wrapper.jar | Bin 59821 -> 0 bytes .../gradle/wrapper/gradle-wrapper.properties | 5 - fabricexample/android/gradlew | 234 - fabricexample/android/gradlew.bat | 89 - fabricexample/android/settings.gradle | 11 - fabricexample/app.json | 4 - fabricexample/assets/tabView/album-art-1.jpg | Bin 28246 -> 0 bytes fabricexample/assets/tabView/album-art-2.jpg | Bin 20815 -> 0 bytes fabricexample/assets/tabView/album-art-3.jpg | Bin 28030 -> 0 bytes fabricexample/assets/tabView/album-art-4.jpg | Bin 33845 -> 0 bytes fabricexample/assets/tabView/album-art-5.jpg | Bin 11665 -> 0 bytes fabricexample/assets/tabView/album-art-6.jpg | Bin 22089 -> 0 bytes fabricexample/assets/tabView/album-art-7.jpg | Bin 10291 -> 0 bytes fabricexample/assets/tabView/album-art-8.jpg | Bin 21423 -> 0 bytes fabricexample/assets/tabView/avatar-1.png | Bin 2458 -> 0 bytes fabricexample/assets/tabView/avatar-2.png | Bin 1712 -> 0 bytes fabricexample/assets/tabView/book.jpg | Bin 96384 -> 0 bytes fabricexample/assets/tabView/icon.png | Bin 2833 -> 0 bytes fabricexample/assets/ue_black_logo.png | Bin 7876 -> 0 bytes fabricexample/assets/urbanears_blue.png | Bin 163344 -> 0 bytes fabricexample/assets/urbanears_grey.png | Bin 129131 -> 0 bytes fabricexample/assets/urbanears_mint.png | Bin 158233 -> 0 bytes fabricexample/assets/urbanears_pink.png | Bin 160663 -> 0 bytes fabricexample/babel.config.js | 18 - fabricexample/index.js | 5 - fabricexample/ios/.xcode.env | 11 - .../ios/FabricExample-Bridging-Header.h | 3 - .../FabricExample.xcodeproj/project.pbxproj | 702 --- .../xcschemes/FabricExample.xcscheme | 88 - .../contents.xcworkspacedata | 10 - .../xcshareddata/IDEWorkspaceChecks.plist | 8 - fabricexample/ios/FabricExample/AppDelegate.h | 8 - .../ios/FabricExample/AppDelegate.mm | 133 - .../AppIcon.appiconset/Contents.json | 53 - .../Images.xcassets/Contents.json | 6 - fabricexample/ios/FabricExample/Info.plist | 55 - .../ios/FabricExample/LaunchScreen.storyboard | 47 - fabricexample/ios/FabricExample/main.m | 10 - .../FabricExampleTests/FabricExampleTests.m | 66 - .../ios/FabricExampleTests/Info.plist | 24 - fabricexample/ios/File.swift | 6 - fabricexample/ios/Podfile | 46 - fabricexample/ios/Podfile.lock | 1042 ---- fabricexample/metro.config.js | 40 - fabricexample/package.json | 40 - fabricexample/react-native.config.js | 9 - fabricexample/src/App.tsx | 155 - fabricexample/src/BasicPagerViewExample.tsx | 64 - .../src/HeadphonesCarouselExample.tsx | 393 -- fabricexample/src/KeyboardExample.tsx | 136 - fabricexample/src/NestPagerView.tsx | 109 - fabricexample/src/OnPageScrollExample.tsx | 89 - fabricexample/src/OnPageSelectedExample.tsx | 56 - fabricexample/src/PaginationDotsExample.tsx | 216 - .../src/ReanimatedOnPageScrollExample.tsx | 56 - fabricexample/src/ScrollViewInsideExample.tsx | 49 - .../src/ScrollablePagerViewExample.tsx | 45 - fabricexample/src/component/Button.tsx | 60 - fabricexample/src/component/LikeCount.tsx | 53 - .../NavigationPanel/ControlPanel.tsx | 172 - .../component/NavigationPanel/LogsPanel.tsx | 53 - .../NavigationPanel/NavigationPanel.tsx | 100 - .../src/component/NavigationPanel/index.ts | 1 - .../src/component/NavigationPanel/types.ts | 8 - fabricexample/src/component/ProgressBar.tsx | 41 - fabricexample/src/hook/useNavigationPanel.ts | 163 - .../src/tabView/AutoWidthTabBarExample.tsx | 92 - .../src/tabView/CoverflowExample.tsx | 151 - .../src/tabView/CustomIndicatorExample.tsx | 174 - .../src/tabView/CustomTabBarExample.tsx | 160 - .../src/tabView/ScrollableTabBarExample.tsx | 89 - fabricexample/src/tabView/Shared/Albums.tsx | 42 - fabricexample/src/tabView/Shared/Article.tsx | 102 - fabricexample/src/tabView/Shared/Chat.tsx | 114 - fabricexample/src/tabView/Shared/Contacts.tsx | 135 - fabricexample/src/tabView/Shared/Profile.tsx | 102 - .../src/tabView/TabBarIconExample.tsx | 80 - fabricexample/src/utils.ts | 32 - fabricexample/yarn.lock | 4786 ----------------- .../tc14_pager_basic_example.yaml.yaml | 5 + package.json | 8 +- tsconfig.build.json | 2 +- tsconfig.json | 3 +- yarn.lock | 735 ++- 155 files changed, 3473 insertions(+), 13864 deletions(-) delete mode 100644 example/.node-version create mode 100644 example/android/app/src/main/res/layout/activity_main.xml create mode 100644 example/jest.config.js create mode 100644 example/src/PaperExample.tsx delete mode 100644 fabricexample/.buckconfig delete mode 100644 fabricexample/.bundle/config delete mode 100644 fabricexample/.ruby-version delete mode 100644 fabricexample/.watchmanconfig delete mode 100644 fabricexample/Gemfile delete mode 100644 fabricexample/Gemfile.lock delete mode 100644 fabricexample/__tests__/App-test.tsx delete mode 100644 fabricexample/_node-version delete mode 100644 fabricexample/android/app/_BUCK delete mode 100644 fabricexample/android/app/build.gradle delete mode 100644 fabricexample/android/app/build_defs.bzl delete mode 100644 fabricexample/android/app/debug.keystore delete mode 100644 fabricexample/android/app/proguard-rules.pro delete mode 100644 fabricexample/android/app/src/debug/AndroidManifest.xml delete mode 100644 fabricexample/android/app/src/debug/java/com/fabricexample/ReactNativeFlipper.java delete mode 100644 fabricexample/android/app/src/main/AndroidManifest.xml delete mode 100644 fabricexample/android/app/src/main/java/com/fabricexample/MainActivity.java delete mode 100644 fabricexample/android/app/src/main/java/com/fabricexample/MainApplication.java delete mode 100644 fabricexample/android/app/src/main/java/com/fabricexample/newarchitecture/MainApplicationReactNativeHost.java delete mode 100644 fabricexample/android/app/src/main/java/com/fabricexample/newarchitecture/components/MainComponentsRegistry.java delete mode 100644 fabricexample/android/app/src/main/java/com/fabricexample/newarchitecture/modules/MainApplicationTurboModuleManagerDelegate.java delete mode 100644 fabricexample/android/app/src/main/jni/CMakeLists.txt delete mode 100644 fabricexample/android/app/src/main/jni/MainApplicationModuleProvider.cpp delete mode 100644 fabricexample/android/app/src/main/jni/MainApplicationModuleProvider.h delete mode 100644 fabricexample/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.cpp delete mode 100644 fabricexample/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.h delete mode 100644 fabricexample/android/app/src/main/jni/MainComponentsRegistry.cpp delete mode 100644 fabricexample/android/app/src/main/jni/MainComponentsRegistry.h delete mode 100644 fabricexample/android/app/src/main/jni/OnLoad.cpp delete mode 100644 fabricexample/android/app/src/main/res/drawable/rn_edit_text_material.xml delete mode 100644 fabricexample/android/app/src/main/res/mipmap-hdpi/ic_launcher.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-mdpi/ic_launcher.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png delete mode 100644 fabricexample/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png delete mode 100644 fabricexample/android/app/src/main/res/values/strings.xml delete mode 100644 fabricexample/android/app/src/main/res/values/styles.xml delete mode 100644 fabricexample/android/build.gradle delete mode 100644 fabricexample/android/gradle.properties delete mode 100644 fabricexample/android/gradle/wrapper/gradle-wrapper.jar delete mode 100644 fabricexample/android/gradle/wrapper/gradle-wrapper.properties delete mode 100755 fabricexample/android/gradlew delete mode 100644 fabricexample/android/gradlew.bat delete mode 100644 fabricexample/android/settings.gradle delete mode 100644 fabricexample/app.json delete mode 100644 fabricexample/assets/tabView/album-art-1.jpg delete mode 100644 fabricexample/assets/tabView/album-art-2.jpg delete mode 100644 fabricexample/assets/tabView/album-art-3.jpg delete mode 100644 fabricexample/assets/tabView/album-art-4.jpg delete mode 100644 fabricexample/assets/tabView/album-art-5.jpg delete mode 100644 fabricexample/assets/tabView/album-art-6.jpg delete mode 100644 fabricexample/assets/tabView/album-art-7.jpg delete mode 100644 fabricexample/assets/tabView/album-art-8.jpg delete mode 100644 fabricexample/assets/tabView/avatar-1.png delete mode 100644 fabricexample/assets/tabView/avatar-2.png delete mode 100644 fabricexample/assets/tabView/book.jpg delete mode 100644 fabricexample/assets/tabView/icon.png delete mode 100644 fabricexample/assets/ue_black_logo.png delete mode 100644 fabricexample/assets/urbanears_blue.png delete mode 100644 fabricexample/assets/urbanears_grey.png delete mode 100644 fabricexample/assets/urbanears_mint.png delete mode 100644 fabricexample/assets/urbanears_pink.png delete mode 100644 fabricexample/babel.config.js delete mode 100644 fabricexample/index.js delete mode 100644 fabricexample/ios/.xcode.env delete mode 100644 fabricexample/ios/FabricExample-Bridging-Header.h delete mode 100644 fabricexample/ios/FabricExample.xcodeproj/project.pbxproj delete mode 100644 fabricexample/ios/FabricExample.xcodeproj/xcshareddata/xcschemes/FabricExample.xcscheme delete mode 100644 fabricexample/ios/FabricExample.xcworkspace/contents.xcworkspacedata delete mode 100644 fabricexample/ios/FabricExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist delete mode 100644 fabricexample/ios/FabricExample/AppDelegate.h delete mode 100644 fabricexample/ios/FabricExample/AppDelegate.mm delete mode 100644 fabricexample/ios/FabricExample/Images.xcassets/AppIcon.appiconset/Contents.json delete mode 100644 fabricexample/ios/FabricExample/Images.xcassets/Contents.json delete mode 100644 fabricexample/ios/FabricExample/Info.plist delete mode 100644 fabricexample/ios/FabricExample/LaunchScreen.storyboard delete mode 100644 fabricexample/ios/FabricExample/main.m delete mode 100644 fabricexample/ios/FabricExampleTests/FabricExampleTests.m delete mode 100644 fabricexample/ios/FabricExampleTests/Info.plist delete mode 100644 fabricexample/ios/File.swift delete mode 100644 fabricexample/ios/Podfile delete mode 100644 fabricexample/ios/Podfile.lock delete mode 100644 fabricexample/metro.config.js delete mode 100644 fabricexample/package.json delete mode 100644 fabricexample/react-native.config.js delete mode 100644 fabricexample/src/App.tsx delete mode 100644 fabricexample/src/BasicPagerViewExample.tsx delete mode 100644 fabricexample/src/HeadphonesCarouselExample.tsx delete mode 100644 fabricexample/src/KeyboardExample.tsx delete mode 100644 fabricexample/src/NestPagerView.tsx delete mode 100644 fabricexample/src/OnPageScrollExample.tsx delete mode 100644 fabricexample/src/OnPageSelectedExample.tsx delete mode 100644 fabricexample/src/PaginationDotsExample.tsx delete mode 100644 fabricexample/src/ReanimatedOnPageScrollExample.tsx delete mode 100644 fabricexample/src/ScrollViewInsideExample.tsx delete mode 100644 fabricexample/src/ScrollablePagerViewExample.tsx delete mode 100644 fabricexample/src/component/Button.tsx delete mode 100644 fabricexample/src/component/LikeCount.tsx delete mode 100644 fabricexample/src/component/NavigationPanel/ControlPanel.tsx delete mode 100644 fabricexample/src/component/NavigationPanel/LogsPanel.tsx delete mode 100644 fabricexample/src/component/NavigationPanel/NavigationPanel.tsx delete mode 100644 fabricexample/src/component/NavigationPanel/index.ts delete mode 100644 fabricexample/src/component/NavigationPanel/types.ts delete mode 100644 fabricexample/src/component/ProgressBar.tsx delete mode 100644 fabricexample/src/hook/useNavigationPanel.ts delete mode 100644 fabricexample/src/tabView/AutoWidthTabBarExample.tsx delete mode 100644 fabricexample/src/tabView/CoverflowExample.tsx delete mode 100644 fabricexample/src/tabView/CustomIndicatorExample.tsx delete mode 100644 fabricexample/src/tabView/CustomTabBarExample.tsx delete mode 100755 fabricexample/src/tabView/ScrollableTabBarExample.tsx delete mode 100644 fabricexample/src/tabView/Shared/Albums.tsx delete mode 100644 fabricexample/src/tabView/Shared/Article.tsx delete mode 100644 fabricexample/src/tabView/Shared/Chat.tsx delete mode 100644 fabricexample/src/tabView/Shared/Contacts.tsx delete mode 100644 fabricexample/src/tabView/Shared/Profile.tsx delete mode 100644 fabricexample/src/tabView/TabBarIconExample.tsx delete mode 100644 fabricexample/src/utils.ts delete mode 100644 fabricexample/yarn.lock diff --git a/.eslintrc.js b/.eslintrc.js index d5770403..3e610bd5 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,6 +1,6 @@ module.exports = { root: true, - extends: '@react-native-community', + extends: '@react-native', globals: { expect: true, element: true, diff --git a/.github/workflows/android.yml b/.github/workflows/android.yml index d442f104..b7127b9f 100644 --- a/.github/workflows/android.yml +++ b/.github/workflows/android.yml @@ -55,21 +55,62 @@ jobs: ~/.gradle/wrapper key: gradle-${{ runner.os }}-${{ hashFiles('**/*.gradle*') }}-${{ hashFiles('**/gradle/wrapper/gradle-wrapper.properties') }}-${{ hashFiles('**/buildSrc/**/*.kt') }} + - name: AVD cache + uses: actions/cache@v3 + id: avd-cache + with: + path: | + ~/.android/avd/* + ~/.android/adb* + key: avd-cache + - name: Install Maestro CLI - run: export MAESTRO_VERSION=1.21.3; curl -Ls "https://get.maestro.mobile.dev" | bash + run: export MAESTRO_VERSION=1.31.0; curl -Ls "https://get.maestro.mobile.dev" | bash - name: Add Maestro to path run: echo "${HOME}/.maestro/bin" >> $GITHUB_PATH + - name: create AVD and generate snapshot for caching + if: steps.avd-cache.outputs.cache-hit != 'true' + uses: reactivecircus/android-emulator-runner@v2 + with: + api-level: 29 + force-avd-creation: false + emulator-options: -no-window -gpu swiftshader_indirect -noaudio -no-boot-anim -camera-back none + disable-animations: false + cores: 2 + ram-size: 4096M + profile: Nexus 6 + script: echo "Generated AVD snapshot for caching." + - name: Run Android Emulator and app uses: reactivecircus/android-emulator-runner@v2 with: api-level: 29 - arch: x86_64 - target: google_apis force-avd-creation: false emulator-options: -no-snapshot-save -no-window -gpu swiftshader_indirect -noaudio -no-boot-anim -camera-back none - disable-animations: true + disable-animations: false + cores: 2 + ram-size: 4096M + profile: Nexus 6 script: | yarn run-example-android yarn test:e2e:android + + - name: Upload report + if: always() + uses: actions/upload-artifact@v3 + with: + name: E2E Report + path: | + ${{ github.workspace }}/*.mp4 + ${{ github.workspace }}/*.png + ${{ github.workspace }}/report*.xml + ~/.maestro/tests/**/* + + - name: Store tests result + uses: actions/upload-artifact@v3 + with: + name: e2e_android_report + path: | + report.xml diff --git a/.gitignore b/.gitignore index 138a6fac..644a9566 100644 --- a/.gitignore +++ b/.gitignore @@ -64,13 +64,15 @@ test-butler-app.apk example/vendor #Example -fabricexample/ios/Pods -fabricexample/vendor -fabricexample/android/app/.cxx +example/ios/Pods +example/vendor .lefthookrc lefthook.yml # Temporary files created by Metro to check the health of the file watcher .metro-health-check* + +# testing +/coverage .cxx diff --git a/README.md b/README.md index 014b449a..2719bd0a 100644 --- a/README.md +++ b/README.md @@ -20,7 +20,7 @@ This component allows the user to swipe left and right through pages of data. Un ## Versions | 4.x | 5.x and above | -| ---------- | ----------- | +| ---------- | ------------- | | iOS | iOS support | | ViewPager1 | ViewPager2 | @@ -34,29 +34,6 @@ In version **6.x** support for `transitionStyle` property has been dropped. More `yarn add react-native-pager-view` -## New architecture setup (Fabric) - -This library supports new architecture! We have two example folders one for each architecture. If you are using this library in your own project there some extra steps needed. -### iOS -Install pods with this flag inside `ios` folder: -```sh -RCT_NEW_ARCH_ENABLED=1 bundle exec pod install -``` -(Inside of `fabricexample` the `RCT_NEW_ARCH_ENABLED` is already set to true by default inside `Podfile`) - -### Android -Set `newArchEnabled` to `true` inside `android/gradle.properties` (this flag is already set to true in `fabricexample`) and then run: -```sh -yarn android -``` - -If you have issues with running android build you can try to generate codegen before the build using this command: - -```sh -cd android && ./gradlew generateCodegenArtifactsFromSchema -``` - - ## Linking ### >= 0.60 @@ -172,8 +149,8 @@ For advanced usage please take a look into our [example project](https://github. | `orientation: Orientation` | Set `horizontal` or `vertical` scrolling orientation (it does **not** work dynamically) | both | | `overScrollMode: OverScollMode` | Used to override default value of overScroll mode. Can be `auto`, `always` or `never`. Defaults to `auto` | Android | | `offscreenPageLimit: number` | Set the number of pages that should be retained to either side of the currently visible page(s). Pages beyond this limit will be recreated from the adapter when needed. Defaults to RecyclerView's caching strategy. The given value must either be larger than 0. | Android | -| `overdrag: boolean` | Allows for overscrolling after reaching the end or very beginning or pages. Defaults to `false` | iOS | -| `layoutDirection: ('ltr' / 'rtl' / 'locale')` | Specifies layout direction. Use `ltr` or `rtl` to set explicitly or `locale` to deduce from the default language script of a locale. Defaults to `locale` | both | +| `overdrag: boolean` | Allows for overscrolling after reaching the end or very beginning or pages. Defaults to `false` | iOS | +| `layoutDirection: ('ltr' / 'rtl' / 'locale')` | Specifies layout direction. Use `ltr` or `rtl` to set explicitly or `locale` to deduce from the default language script of a locale. Defaults to `locale` | both | | Method | Description | Platform | | ------------------------------------------ | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :------: | @@ -205,7 +182,7 @@ requestAnimationFrame(() => refPagerView.current?.setPage(index)); ### iOS -| horizontal | vertical | +| horizontal | vertical | | :------------------------------------------------------------------: | :--------------------------------------------------------------------: | | ViewPager | ViewPager | @@ -220,37 +197,38 @@ To attach reanimated handler with `onPageScroll` follow the below steps. ```jsx // 1. Define the handler function usePageScrollHandler(handlers, dependencies) { - const {context, doDependenciesDiffer} = useHandler(handlers, dependencies); + const { context, doDependenciesDiffer } = useHandler(handlers, dependencies); const subscribeForEvents = ['onPageScroll']; return useEvent( - event => { + (event) => { 'worklet'; - const {onPageScroll} = handlers; + const { onPageScroll } = handlers; if (onPageScroll && event.eventName.endsWith('onPageScroll')) { onPageScroll(event, context); } }, subscribeForEvents, - doDependenciesDiffer, + doDependenciesDiffer ); } - + // 2. Attach the event handler -import PagerView from "react-native-pager-view"; -import Animated from "react-native-reanimated"; +import PagerView from 'react-native-pager-view'; +import Animated from 'react-native-reanimated'; const AnimatedPagerView = Animated.createAnimatedComponent(PagerView); const pageScrollHandler = usePageScrollHandler({ - onPageScroll: e => { - 'worklet'; - offset.value = e.offset; - console.log(e.offset, e.position); - }, + onPageScroll: (e) => { + 'worklet'; + offset.value = e.offset; + console.log(e.offset, e.position); + }, }); - +; ``` + ## License MIT diff --git a/example/.node-version b/example/.node-version deleted file mode 100644 index 3c032078..00000000 --- a/example/.node-version +++ /dev/null @@ -1 +0,0 @@ -18 diff --git a/example/Gemfile b/example/Gemfile index feee0df0..51df2487 100644 --- a/example/Gemfile +++ b/example/Gemfile @@ -1,5 +1,5 @@ source 'https://rubygems.org' # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version -ruby '>= 2.6.10' -gem 'cocoapods', '>= 1.11.3' +ruby ">= 2.6.10" +gem 'cocoapods', '~> 1.12' diff --git a/example/Gemfile.lock b/example/Gemfile.lock index 013bc0fb..fd4c5d4c 100644 --- a/example/Gemfile.lock +++ b/example/Gemfile.lock @@ -1,30 +1,29 @@ GEM remote: https://rubygems.org/ specs: - CFPropertyList (3.0.5) + CFPropertyList (3.0.6) rexml - activesupport (6.1.7.6) + activesupport (7.0.7.2) concurrent-ruby (~> 1.0, >= 1.0.2) i18n (>= 1.6, < 2) minitest (>= 5.1) tzinfo (~> 2.0) - zeitwerk (~> 2.3) - addressable (2.8.1) + addressable (2.8.5) public_suffix (>= 2.0.2, < 6.0) algoliasearch (1.27.5) httpclient (~> 2.8, >= 2.8.3) json (>= 1.5.1) atomos (0.1.3) claide (1.1.0) - cocoapods (1.11.3) + cocoapods (1.12.1) addressable (~> 2.8) claide (>= 1.0.2, < 2.0) - cocoapods-core (= 1.11.3) + cocoapods-core (= 1.12.1) cocoapods-deintegrate (>= 1.0.3, < 2.0) - cocoapods-downloader (>= 1.4.0, < 2.0) + cocoapods-downloader (>= 1.6.0, < 2.0) cocoapods-plugins (>= 1.0.0, < 2.0) cocoapods-search (>= 1.0.0, < 2.0) - cocoapods-trunk (>= 1.4.0, < 2.0) + cocoapods-trunk (>= 1.6.0, < 2.0) cocoapods-try (>= 1.1.0, < 2.0) colored2 (~> 3.1) escape (~> 0.0.4) @@ -32,10 +31,10 @@ GEM gh_inspector (~> 1.0) molinillo (~> 0.8.0) nap (~> 1.0) - ruby-macho (>= 1.0, < 3.0) + ruby-macho (>= 2.3.0, < 3.0) xcodeproj (>= 1.21.0, < 2.0) - cocoapods-core (1.11.3) - activesupport (>= 5.0, < 7) + cocoapods-core (1.12.1) + activesupport (>= 5.0, < 8) addressable (~> 2.8) algoliasearch (~> 1.0) concurrent-ruby (~> 1.1) @@ -56,7 +55,7 @@ GEM colored2 (3.1.2) concurrent-ruby (1.2.2) escape (0.0.4) - ethon (0.15.0) + ethon (0.16.0) ffi (>= 1.15.0) ffi (1.15.5) fourflusher (2.3.1) @@ -65,14 +64,14 @@ GEM httpclient (2.8.3) i18n (1.14.1) concurrent-ruby (~> 1.0) - json (2.6.2) + json (2.6.3) minitest (5.19.0) molinillo (0.8.0) nanaimo (0.3.0) nap (1.1.0) netrc (0.11.0) public_suffix (4.0.7) - rexml (3.2.5) + rexml (3.2.6) ruby-macho (2.5.1) typhoeus (1.4.0) ethon (>= 0.9.0) @@ -85,13 +84,12 @@ GEM colored2 (~> 3.1) nanaimo (~> 0.3.0) rexml (~> 3.2.4) - zeitwerk (2.6.11) PLATFORMS ruby DEPENDENCIES - cocoapods (>= 1.11.3) + cocoapods (~> 1.12) RUBY VERSION ruby 2.7.5p203 diff --git a/example/android/app/build.gradle b/example/android/app/build.gradle index c59aef53..400d88ee 100644 --- a/example/android/app/build.gradle +++ b/example/android/app/build.gradle @@ -153,6 +153,9 @@ dependencies { implementation("com.facebook.react:react-android") implementation("androidx.swiperefreshlayout:swiperefreshlayout:1.0.0") + implementation 'androidx.appcompat:appcompat:1.6.1' + implementation 'com.google.android.material:material:1.4.+' + implementation 'androidx.constraintlayout:constraintlayout:2.1.4' debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") { diff --git a/example/android/app/src/main/AndroidManifest.xml b/example/android/app/src/main/AndroidManifest.xml index 4122f36a..06c61d4e 100644 --- a/example/android/app/src/main/AndroidManifest.xml +++ b/example/android/app/src/main/AndroidManifest.xml @@ -1,25 +1,28 @@ + - - - - - - + android:roundIcon="@mipmap/ic_launcher_round" + android:theme="@style/AppTheme"> + + + + + + + - + + \ No newline at end of file diff --git a/example/android/app/src/main/java/com/pagerviewexample/MainActivity.java b/example/android/app/src/main/java/com/pagerviewexample/MainActivity.java index 1a2683de..71e2bf96 100644 --- a/example/android/app/src/main/java/com/pagerviewexample/MainActivity.java +++ b/example/android/app/src/main/java/com/pagerviewexample/MainActivity.java @@ -1,10 +1,5 @@ package com.pagerviewexample; -import com.facebook.react.ReactActivity; -import com.facebook.react.ReactActivityDelegate; -import com.facebook.react.ReactRootView; - - import com.facebook.react.ReactActivity; import com.facebook.react.ReactActivityDelegate; import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint; @@ -32,9 +27,6 @@ protected ReactActivityDelegate createReactActivityDelegate() { this, getMainComponentName(), // If you opted-in for the New Architecture, we enable the Fabric Renderer. - DefaultNewArchitectureEntryPoint.getFabricEnabled(), // fabricEnabled - // If you opted-in for the New Architecture, we enable Concurrent React (i.e. React 18). - DefaultNewArchitectureEntryPoint.getConcurrentReactEnabled() // concurrentRootEnabled - ); + DefaultNewArchitectureEntryPoint.getFabricEnabled()); } } diff --git a/example/android/app/src/main/res/layout/activity_main.xml b/example/android/app/src/main/res/layout/activity_main.xml new file mode 100644 index 00000000..e26ac0d2 --- /dev/null +++ b/example/android/app/src/main/res/layout/activity_main.xml @@ -0,0 +1,28 @@ + + + +