react-native-kenburns-view 5.0.0 → 5.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/README.md +17 -5
  2. package/example/kenburns-example/App.js +5 -5
  3. package/example/kenburns-example/README.md +5 -17
  4. package/example/kenburns-example/app.json +4 -4
  5. package/example/kenburns-example/ios/KenBurnsExample/AppDelegate.swift +69 -0
  6. package/example/kenburns-example/ios/KenBurnsExample/Info.plist +73 -71
  7. package/example/kenburns-example/ios/KenBurnsExample/KenBurnsExample-Bridging-Header.h +1 -1
  8. package/example/kenburns-example/ios/KenBurnsExample/PrivacyInfo.xcprivacy +11 -0
  9. package/example/kenburns-example/ios/KenBurnsExample/SplashScreen.storyboard +7 -2
  10. package/example/kenburns-example/ios/KenBurnsExample.xcodeproj/project.pbxproj +114 -106
  11. package/example/kenburns-example/ios/Podfile +14 -17
  12. package/example/kenburns-example/ios/Podfile.lock +1058 -691
  13. package/example/kenburns-example/ios/Podfile.properties.json +1 -2
  14. package/example/kenburns-example/metro.config.js +4 -1
  15. package/example/kenburns-example/package-lock.json +1256 -5067
  16. package/example/kenburns-example/package.json +12 -8
  17. package/package.json +1 -1
  18. package/example/kenburns-example/assets/images/image1.jpg +0 -0
  19. package/example/kenburns-example/assets/images/image2.jpg +0 -0
  20. package/example/kenburns-example/assets/images/image3.jpg +0 -0
  21. package/example/kenburns-example/assets/images/placeholder.jpg +0 -0
  22. package/example/kenburns-example/ios/KenBurnsExample/AppDelegate.h +0 -7
  23. package/example/kenburns-example/ios/KenBurnsExample/AppDelegate.mm +0 -62
  24. package/example/kenburns-example/ios/KenBurnsExample/main.m +0 -10
  25. package/example/kenburns-example/ios/KenBurnsExample/noop-file.swift +0 -4
package/README.md CHANGED
@@ -14,10 +14,22 @@
14
14
  </a>
15
15
  </p>
16
16
 
17
- [`KenBurns`](https://en.wikipedia.org/wiki/Ken_Burns_effect) Image Effect for React Native. Now implemented with the modern `Animated` API, supporting both smooth **zoom** and **pan**.
18
- Version: 5.0.0
17
+ ## About
19
18
 
20
- Tested on React Native 0.76.5 iOS and Android.
19
+ [**Ken Burns effect**](https://en.wikipedia.org/wiki/Ken_Burns_effect)—the slow zoom and pan over still images—for React Native. Drop in a single component, pass an image and size, and get a smooth, cinematic motion that’s great for hero images, galleries, or slideshows.
20
+
21
+ **Lightweight:** No native code or custom native modules. It uses only React Native’s built-in `Animated` API and core components, so it works with standard RN and Expo and adds minimal bundle size. Each instance uses randomized timing and pan direction so multiple images don’t move in lockstep.
22
+
23
+ Version: 5.1.1
24
+
25
+ ## Supported React Native versions
26
+
27
+ This library uses only React Native’s built-in `Animated` API and core components (`View`, `ImageBackground`). It has **no native code** and no custom native modules.
28
+
29
+ - **Compatible with:** React Native **0.76+** (and earlier 0.7x / 0.6x in practice).
30
+ - **Tested with:** React Native **0.76.x** and **0.83.x** (Expo SDK 52 and 55) on iOS and Android.
31
+
32
+ If you use Expo, the example app runs on **Expo SDK 55** (React Native 0.83.2).
21
33
 
22
34
  ## Installation
23
35
  ```bash
@@ -26,7 +38,7 @@ $ npm i react-native-kenburns-view --save
26
38
 
27
39
  ## Demo/Example
28
40
 
29
- ![kenburns view demo](https://media.giphy.com/media/xTcnT8ju8pHKhIZY9G/giphy.gif)
41
+ ![kenburns view demo](https://media.giphy.com/media/792gUTkm8Gic8AieQl/giphy.gif)
30
42
 
31
43
  Run the example app (Expo) from `example/kenburns-example`: `cd example/kenburns-example && npm install && npx expo start`.
32
44
 
@@ -75,5 +87,5 @@ Link: [`react-native-kenburns-view on npm`](https://www.npmjs.com/package/react-
75
87
 
76
88
  Website: [nimila.online](https://nimila.online)
77
89
  Email: nimilahiran@gmail.com
78
- Twitter: [@nHiRanZ](https://twitter.com/nHiRanZ)
90
+ X/Twitter: [@nHiRanZ](https://twitter.com/nHiRanZ)
79
91
 
package/example/kenburns-example/App.js CHANGED
@@ -7,18 +7,18 @@ const { width } = Dimensions.get('window');
7
7
  const CARD_HEIGHT = 220;
8
8
 
9
9
  const IMAGES = [
10
- require('./assets/images/image1.jpg'),
11
- require('./assets/images/image2.jpg'),
12
- require('./assets/images/image3.jpg'),
10
+ { uri: 'https://i.ibb.co/pjVgZTnf/image1.jpg' },
11
+ { uri: 'https://i.ibb.co/39n0tghZ/image2.jpg' },
12
+ { uri: 'https://i.ibb.co/YBcr2vHf/image3.jpg' },
13
13
  ];
14
- const PLACEHOLDER = require('./assets/images/placeholder.jpg');
14
+ const PLACEHOLDER = { uri: 'https://i.ibb.co/21NytpJN/placeholder.jpg' };
15
15
 
16
16
  export default function App() {
17
17
  return (
18
18
  <View style={styles.container}>
19
19
  <StatusBar style="light" />
20
20
  <Text style={styles.title}>Ken Burns Effect</Text>
21
- <Text style={styles.subtitle}>Zoom + pan animation</Text>
21
+ <Text style={styles.subtitle}>Zoom + pan</Text>
22
22
  <ScrollView
23
23
  style={styles.scroll}
24
24
  contentContainerStyle={styles.scrollContent}
package/example/kenburns-example/README.md CHANGED
@@ -1,32 +1,20 @@
1
1
  # Ken Burns Example
2
2
 
3
- Example app for `react-native-kenburns-view` using Expo.
3
+ Expo app that demonstrates `react-native-kenburns-view` with sample images (zoom + pan).
4
4
 
5
5
  ## Run
6
6
 
7
- From this folder:
8
-
9
7
  ```bash
8
+ cd example/kenburns-example
10
9
  npm install
11
- ```
12
-
13
- **Option A – development build (iOS simulator):**
14
-
15
- ```bash
16
- npx expo run:ios
17
- ```
18
-
19
- **Option B – Expo Go (no native build):**
20
-
21
- ```bash
22
10
  npx expo start
23
11
  ```
24
12
 
25
- Then scan the QR code or press `i` / `a` for simulator.
13
+ Then press `i` for iOS simulator or `a` for Android emulator, or scan the QR code with Expo Go.
26
14
 
27
- If you see "Unable to resolve module react-native-kenburns-view", clear Metro’s cache and try again: `npx expo start --clear` (then run `npx expo run:ios` in another terminal, or run `expo run:ios` after the dev server is up).
15
+ If you see "Unable to resolve module" for the library, restart with a clean cache: `npx expo start --clear`.
28
16
 
29
17
  ## Notes
30
18
 
31
19
  - The library is linked via `"react-native-kenburns-view": "file:../.."`.
32
- - Test images are in `assets/images/` (image1–3 and placeholder).
20
+ - Sample images are loaded from remote URLs (see `App.js`).
package/example/kenburns-example/app.json CHANGED
@@ -5,9 +5,6 @@
5
5
  "version": "1.0.0",
6
6
  "orientation": "portrait",
7
7
  "userInterfaceStyle": "light",
8
- "assetBundlePatterns": [
9
- "**/*"
10
- ],
11
8
  "ios": {
12
9
  "supportsTablet": true,
13
10
  "bundleIdentifier": "com.anonymous.kenburns-example"
@@ -16,6 +13,9 @@
16
13
  "adaptiveIcon": {
17
14
  "backgroundColor": "#1a1a2e"
18
15
  }
19
- }
16
+ },
17
+ "plugins": [
18
+ "expo-asset"
19
+ ]
20
20
  }
21
21
  }
package/example/kenburns-example/ios/KenBurnsExample/AppDelegate.swift ADDED
@@ -0,0 +1,69 @@
1
+ internal import Expo
2
+ import React
3
+ import ReactAppDependencyProvider
4
+
5
+ @main
6
+ class AppDelegate: ExpoAppDelegate {
7
+ var window: UIWindow?
8
+
9
+ var reactNativeDelegate: ExpoReactNativeFactoryDelegate?
10
+ var reactNativeFactory: RCTReactNativeFactory?
11
+
12
+ public override func application(
13
+ _ application: UIApplication,
14
+ didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
15
+ ) -> Bool {
16
+ let delegate = ReactNativeDelegate()
17
+ let factory = ExpoReactNativeFactory(delegate: delegate)
18
+ delegate.dependencyProvider = RCTAppDependencyProvider()
19
+
20
+ reactNativeDelegate = delegate
21
+ reactNativeFactory = factory
22
+
23
+ #if os(iOS) || os(tvOS)
24
+ window = UIWindow(frame: UIScreen.main.bounds)
25
+ factory.startReactNative(
26
+ withModuleName: "main",
27
+ in: window,
28
+ launchOptions: launchOptions)
29
+ #endif
30
+
31
+ return super.application(application, didFinishLaunchingWithOptions: launchOptions)
32
+ }
33
+
34
+ // Linking API
35
+ public override func application(
36
+ _ app: UIApplication,
37
+ open url: URL,
38
+ options: [UIApplication.OpenURLOptionsKey: Any] = [:]
39
+ ) -> Bool {
40
+ return super.application(app, open: url, options: options) || RCTLinkingManager.application(app, open: url, options: options)
41
+ }
42
+
43
+ // Universal Links
44
+ public override func application(
45
+ _ application: UIApplication,
46
+ continue userActivity: NSUserActivity,
47
+ restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void
48
+ ) -> Bool {
49
+ let result = RCTLinkingManager.application(application, continue: userActivity, restorationHandler: restorationHandler)
50
+ return super.application(application, continue: userActivity, restorationHandler: restorationHandler) || result
51
+ }
52
+ }
53
+
54
+ class ReactNativeDelegate: ExpoReactNativeFactoryDelegate {
55
+ // Extension point for config-plugins
56
+
57
+ override func sourceURL(for bridge: RCTBridge) -> URL? {
58
+ // needed to return the correct URL for expo-dev-client.
59
+ bridge.bundleURL ?? bundleURL()
60
+ }
61
+
62
+ override func bundleURL() -> URL? {
63
+ #if DEBUG
64
+ return RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: ".expo/.virtual-metro-entry")
65
+ #else
66
+ return Bundle.main.url(forResource: "main", withExtension: "jsbundle")
67
+ #endif
68
+ }
69
+ }
package/example/kenburns-example/ios/KenBurnsExample/Info.plist CHANGED
@@ -1,74 +1,76 @@
1
1
  <?xml version="1.0" encoding="UTF-8"?>
2
2
  <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
3
3
  <plist version="1.0">
4
- <dict>
5
- <key>CADisableMinimumFrameDurationOnPhone</key>
6
- <true/>
7
- <key>CFBundleDevelopmentRegion</key>
8
- <string>$(DEVELOPMENT_LANGUAGE)</string>
9
- <key>CFBundleDisplayName</key>
10
- <string>KenBurns Example</string>
11
- <key>CFBundleExecutable</key>
12
- <string>$(EXECUTABLE_NAME)</string>
13
- <key>CFBundleIdentifier</key>
14
- <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
15
- <key>CFBundleInfoDictionaryVersion</key>
16
- <string>6.0</string>
17
- <key>CFBundleName</key>
18
- <string>$(PRODUCT_NAME)</string>
19
- <key>CFBundlePackageType</key>
20
- <string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
21
- <key>CFBundleShortVersionString</key>
22
- <string>1.0.0</string>
23
- <key>CFBundleSignature</key>
24
- <string>????</string>
25
- <key>CFBundleURLTypes</key>
26
- <array>
27
- <dict>
28
- <key>CFBundleURLSchemes</key>
29
- <array>
30
- <string>com.anonymous.kenburns-example</string>
31
- </array>
32
- </dict>
33
- </array>
34
- <key>CFBundleVersion</key>
35
- <string>1</string>
36
- <key>LSMinimumSystemVersion</key>
37
- <string>12.0</string>
38
- <key>LSRequiresIPhoneOS</key>
39
- <true/>
40
- <key>NSAppTransportSecurity</key>
41
- <dict>
42
- <key>NSAllowsArbitraryLoads</key>
43
- <false/>
44
- <key>NSAllowsLocalNetworking</key>
45
- <true/>
46
- </dict>
47
- <key>UILaunchStoryboardName</key>
48
- <string>SplashScreen</string>
49
- <key>UIRequiredDeviceCapabilities</key>
50
- <array>
51
- <string>arm64</string>
52
- </array>
53
- <key>UIRequiresFullScreen</key>
54
- <false/>
55
- <key>UIStatusBarStyle</key>
56
- <string>UIStatusBarStyleDefault</string>
57
- <key>UISupportedInterfaceOrientations</key>
58
- <array>
59
- <string>UIInterfaceOrientationPortrait</string>
60
- <string>UIInterfaceOrientationPortraitUpsideDown</string>
61
- </array>
62
- <key>UISupportedInterfaceOrientations~ipad</key>
63
- <array>
64
- <string>UIInterfaceOrientationPortrait</string>
65
- <string>UIInterfaceOrientationPortraitUpsideDown</string>
66
- <string>UIInterfaceOrientationLandscapeLeft</string>
67
- <string>UIInterfaceOrientationLandscapeRight</string>
68
- </array>
69
- <key>UIUserInterfaceStyle</key>
70
- <string>Light</string>
71
- <key>UIViewControllerBasedStatusBarAppearance</key>
72
- <false/>
73
- </dict>
74
- </plist>
4
+ <dict>
5
+ <key>CADisableMinimumFrameDurationOnPhone</key>
6
+ <true/>
7
+ <key>CFBundleDevelopmentRegion</key>
8
+ <string>$(DEVELOPMENT_LANGUAGE)</string>
9
+ <key>CFBundleDisplayName</key>
10
+ <string>KenBurns Example</string>
11
+ <key>CFBundleExecutable</key>
12
+ <string>$(EXECUTABLE_NAME)</string>
13
+ <key>CFBundleIdentifier</key>
14
+ <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
15
+ <key>CFBundleInfoDictionaryVersion</key>
16
+ <string>6.0</string>
17
+ <key>CFBundleName</key>
18
+ <string>$(PRODUCT_NAME)</string>
19
+ <key>CFBundlePackageType</key>
20
+ <string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
21
+ <key>CFBundleShortVersionString</key>
22
+ <string>1.0.0</string>
23
+ <key>CFBundleSignature</key>
24
+ <string>????</string>
25
+ <key>CFBundleURLTypes</key>
26
+ <array>
27
+ <dict>
28
+ <key>CFBundleURLSchemes</key>
29
+ <array>
30
+ <string>com.anonymous.kenburns-example</string>
31
+ </array>
32
+ </dict>
33
+ </array>
34
+ <key>CFBundleVersion</key>
35
+ <string>1</string>
36
+ <key>LSMinimumSystemVersion</key>
37
+ <string>12.0</string>
38
+ <key>LSRequiresIPhoneOS</key>
39
+ <true/>
40
+ <key>NSAppTransportSecurity</key>
41
+ <dict>
42
+ <key>NSAllowsArbitraryLoads</key>
43
+ <false/>
44
+ <key>NSAllowsLocalNetworking</key>
45
+ <true/>
46
+ </dict>
47
+ <key>RCTNewArchEnabled</key>
48
+ <true/>
49
+ <key>UILaunchStoryboardName</key>
50
+ <string>SplashScreen</string>
51
+ <key>UIRequiredDeviceCapabilities</key>
52
+ <array>
53
+ <string>arm64</string>
54
+ </array>
55
+ <key>UIRequiresFullScreen</key>
56
+ <false/>
57
+ <key>UIStatusBarStyle</key>
58
+ <string>UIStatusBarStyleDefault</string>
59
+ <key>UISupportedInterfaceOrientations</key>
60
+ <array>
61
+ <string>UIInterfaceOrientationPortrait</string>
62
+ <string>UIInterfaceOrientationPortraitUpsideDown</string>
63
+ </array>
64
+ <key>UISupportedInterfaceOrientations~ipad</key>
65
+ <array>
66
+ <string>UIInterfaceOrientationPortrait</string>
67
+ <string>UIInterfaceOrientationPortraitUpsideDown</string>
68
+ <string>UIInterfaceOrientationLandscapeLeft</string>
69
+ <string>UIInterfaceOrientationLandscapeRight</string>
70
+ </array>
71
+ <key>UIUserInterfaceStyle</key>
72
+ <string>Light</string>
73
+ <key>UIViewControllerBasedStatusBarAppearance</key>
74
+ <false/>
75
+ </dict>
76
+ </plist>
package/example/kenburns-example/ios/KenBurnsExample/KenBurnsExample-Bridging-Header.h CHANGED
@@ -1,3 +1,3 @@
1
1
  //
2
- // Use this file to import your target's public headers that you would like to expose to Swift.
2
+ // Use this file to import your target's public headers that you would like to expose to Swift.
3
3
  //
package/example/kenburns-example/ios/KenBurnsExample/PrivacyInfo.xcprivacy CHANGED
@@ -17,9 +17,20 @@
17
17
  <string>NSPrivacyAccessedAPICategoryFileTimestamp</string>
18
18
  <key>NSPrivacyAccessedAPITypeReasons</key>
19
19
  <array>
20
+ <string>0A2A.1</string>
21
+ <string>3B52.1</string>
20
22
  <string>C617.1</string>
21
23
  </array>
22
24
  </dict>
25
+ <dict>
26
+ <key>NSPrivacyAccessedAPIType</key>
27
+ <string>NSPrivacyAccessedAPICategoryDiskSpace</string>
28
+ <key>NSPrivacyAccessedAPITypeReasons</key>
29
+ <array>
30
+ <string>E174.1</string>
31
+ <string>85F4.1</string>
32
+ </array>
33
+ </dict>
23
34
  <dict>
24
35
  <key>NSPrivacyAccessedAPIType</key>
25
36
  <string>NSPrivacyAccessedAPICategorySystemBootTime</string>
package/example/kenburns-example/ios/KenBurnsExample/SplashScreen.storyboard CHANGED
@@ -1,11 +1,12 @@
1
1
  <?xml version="1.0" encoding="UTF-8"?>
2
- <document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="32700.99.1234" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="EXPO-VIEWCONTROLLER-1">
2
+ <document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="24093.7" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="EXPO-VIEWCONTROLLER-1">
3
3
  <device id="retina6_12" orientation="portrait" appearance="light"/>
4
4
  <dependencies>
5
5
  <deployment identifier="iOS"/>
6
- <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22685"/>
6
+ <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="24053.1"/>
7
7
  <capability name="Named colors" minToolsVersion="9.0"/>
8
8
  <capability name="Safe area layout guides" minToolsVersion="9.0"/>
9
+ <capability name="System colors in document resources" minToolsVersion="11.0"/>
9
10
  <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
10
11
  </dependencies>
11
12
  <scenes>
@@ -21,6 +22,7 @@
21
22
  <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerY" secondItem="EXPO-ContainerView" secondAttribute="centerY" id="0VC-Wk-OaO"/>
22
23
  <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerX" secondItem="EXPO-ContainerView" secondAttribute="centerX" id="zR4-NK-mVN"/>
23
24
  </constraints>
25
+ <color key="backgroundColor" systemColor="systemBackgroundColor"/>
24
26
  </view>
25
27
  </viewController>
26
28
  <placeholder placeholderIdentifier="IBFirstResponder" id="EXPO-PLACEHOLDER-1" userLabel="First Responder" sceneMemberID="firstResponder"/>
@@ -30,5 +32,8 @@
30
32
  </scenes>
31
33
  <resources>
32
34
  <image name="SplashScreenLogo" width="100" height="90.333335876464844"/>
35
+ <systemColor name="systemBackgroundColor">
36
+ <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
37
+ </systemColor>
33
38
  </resources>
34
39
  </document>