diff --git a/README.md b/README.md
index a15eb04cc..67ecc70bc 100644
--- a/README.md
+++ b/README.md
@@ -50,6 +50,22 @@ No permissions required (`saveToPhotos` requires permission [check](#note-on-fil
Note: This library does not require `Manifest.permission.CAMERA`, if your app declares as using this permission in manifest then you have to obtain the permission before using `launchCamera`.
+#### Targeting Android API Levels Below 30
+
+If your app's `minSdkVersion` is set to below 30 and it does not already include or depend on `androidx.activity:activity:1.9.+` or a newer version, you'll need to add the following line to the dependencies section of your `app/build.gradle` file to ensure support for the backported AndroidX Photo Picker:
+
+```groovy
+dependencies {
+ ...
+ implementation("androidx.activity:activity:1.9.+")
+ ...
+}
+```
+
+Additionally, you may need to update your `AndroidManifest.xml` to trigger the installation of the backported Photo Picker. For reference, you can check the example app's configuration in `example/android/app/src/main/AndroidManifest.xml` and `example/android/app/build.gradle`.
+
+For more details, consult the Android documentation on AndroidX Photo Picker: [https://developer.android.com/training/data-storage/shared/photopicker](https://developer.android.com/training/data-storage/shared/photopicker)
+
## API Reference
## Methods
diff --git a/android/build.gradle b/android/build.gradle
index ab6f32077..7a1a51ec8 100644
--- a/android/build.gradle
+++ b/android/build.gradle
@@ -25,7 +25,7 @@ android {
}
defaultConfig {
- minSdkVersion 21
+ minSdkVersion safeExtGet('minSdkVersion', 21)
targetSdkVersion 33
versionCode 1
versionName "1.0"
diff --git a/android/src/main/java/com/imagepicker/ImagePickerModuleImpl.java b/android/src/main/java/com/imagepicker/ImagePickerModuleImpl.java
index afe4b3e71..67b6d2e10 100644
--- a/android/src/main/java/com/imagepicker/ImagePickerModuleImpl.java
+++ b/android/src/main/java/com/imagepicker/ImagePickerModuleImpl.java
@@ -22,6 +22,12 @@
import java.util.concurrent.Executors;
import static com.imagepicker.Utils.*;
+import com.imagepicker.Options;
+
+import androidx.activity.result.PickVisualMediaRequest;
+import androidx.activity.result.contract.ActivityResultContracts;
+import androidx.activity.result.contract.ActivityResultContracts.PickVisualMedia;
+import androidx.activity.result.contract.ActivityResultContracts.PickMultipleVisualMedia;
public class ImagePickerModuleImpl implements ActivityEventListener {
static final String NAME = "ImagePicker";
@@ -116,6 +122,9 @@ public void launchImageLibrary(final ReadableMap options, final Callback callbac
this.callback = callback;
this.options = new Options(options);
+ PickVisualMedia.VisualMediaType mediaType;
+ PickVisualMediaRequest mediaRequest;
+
int requestCode;
Intent libraryIntent;
requestCode = REQUEST_LAUNCH_LIBRARY;
@@ -125,36 +134,27 @@ public void launchImageLibrary(final ReadableMap options, final Callback callbac
boolean isPhoto = this.options.mediaType.equals(mediaTypePhoto);
boolean isVideo = this.options.mediaType.equals(mediaTypeVideo);
- if (Build.VERSION.SDK_INT < Build.VERSION_CODES.TIRAMISU) {
- if (isSingleSelect && (isPhoto || isVideo)) {
- libraryIntent = new Intent(Intent.ACTION_PICK);
- } else {
- libraryIntent = new Intent(Intent.ACTION_GET_CONTENT);
- libraryIntent.addCategory(Intent.CATEGORY_OPENABLE);
- }
+ // Note: Casting works, even though Android Studio complains about it
+ if (isPhoto) {
+ mediaType = (PickVisualMedia.VisualMediaType) PickVisualMedia.ImageOnly.INSTANCE;
+ } else if (isVideo) {
+ mediaType = (PickVisualMedia.VisualMediaType) PickVisualMedia.VideoOnly.INSTANCE;
} else {
- libraryIntent = new Intent(MediaStore.ACTION_PICK_IMAGES);
+ mediaType = (PickVisualMedia.VisualMediaType) PickVisualMedia.ImageAndVideo.INSTANCE;
}
- if (!isSingleSelect) {
- if (Build.VERSION.SDK_INT < Build.VERSION_CODES.TIRAMISU) {
- libraryIntent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, true);
- } else {
- if (selectionLimit != 1) {
- int maxNum = selectionLimit;
- if (selectionLimit == 0) maxNum = MediaStore.getPickImagesMaxLimit();
- libraryIntent.putExtra(MediaStore.EXTRA_PICK_IMAGES_MAX, maxNum);
- }
- }
- }
+ mediaRequest = new PickVisualMediaRequest.Builder()
+ .setMediaType(mediaType)
+ .build();
- if (isPhoto) {
- libraryIntent.setType("image/*");
- } else if (isVideo) {
- libraryIntent.setType("video/*");
- } else if (Build.VERSION.SDK_INT < Build.VERSION_CODES.TIRAMISU) {
- libraryIntent.setType("*/*");
- libraryIntent.putExtra(Intent.EXTRA_MIME_TYPES, new String[]{"image/*", "video/*"});
+ // https://developer.android.com/training/data-storage/shared/photopicker
+ if (isSingleSelect) {
+ libraryIntent = new PickVisualMedia().createIntent(this.reactContext.getApplicationContext(), mediaRequest);
+ } else {
+ PickMultipleVisualMedia pickMultipleVisualMedia = selectionLimit > 1
+ ? new PickMultipleVisualMedia(selectionLimit)
+ : new PickMultipleVisualMedia();
+ libraryIntent = pickMultipleVisualMedia.createIntent(this.reactContext.getApplicationContext(), mediaRequest);
}
try {
diff --git a/android/src/main/java/com/imagepicker/VideoMetadata.java b/android/src/main/java/com/imagepicker/VideoMetadata.java
index 9ef64308c..2cec8b2f0 100644
--- a/android/src/main/java/com/imagepicker/VideoMetadata.java
+++ b/android/src/main/java/com/imagepicker/VideoMetadata.java
@@ -41,9 +41,9 @@ public VideoMetadata(Uri uri, Context context) {
if (datetime != null) {
// METADATA_KEY_DATE gives us the following format: "20211214T102646.000Z"
- // This format is very hard to parse, so we convert it to "20211214 102646" ("yyyyMMdd HHmmss")
- String datetimeToFormat = datetime.substring(0, datetime.indexOf(".")).replace("T", " ");
- this.datetime = getDateTimeInUTC(datetimeToFormat, "yyyyMMdd HHmmss");
+ // This date is always returned in UTC, so we strip the ending that `SimpleDateFormat` can't parse, and append `+GMT`
+ String datetimeToFormat = datetime.substring(0, datetime.indexOf(".")) + "+GMT";
+ this.datetime = getDateTimeInUTC(datetimeToFormat, "yyyyMMdd'T'HHmmss+zzz");
}
String width = metadataRetriever.extractMetadata(MediaMetadataRetriever.METADATA_KEY_VIDEO_WIDTH);
diff --git a/example/.bundle/config b/example/.bundle/config
new file mode 100644
index 000000000..848943bb5
--- /dev/null
+++ b/example/.bundle/config
@@ -0,0 +1,2 @@
+BUNDLE_PATH: "vendor/bundle"
+BUNDLE_FORCE_RUBY_PLATFORM: 1
diff --git a/example/.editorconfig b/example/.editorconfig
deleted file mode 100644
index 7c286132f..000000000
--- a/example/.editorconfig
+++ /dev/null
@@ -1,3 +0,0 @@
-# Windows files
-[*.bat]
-end_of_line = crlf
diff --git a/example/.eslintrc.js b/example/.eslintrc.js
index 9dd57a791..187894b6a 100644
--- a/example/.eslintrc.js
+++ b/example/.eslintrc.js
@@ -1,16 +1,4 @@
module.exports = {
root: true,
extends: '@react-native',
- parser: '@typescript-eslint/parser',
- plugins: ['@typescript-eslint'],
- overrides: [
- {
- files: ['*.ts', '*.tsx'],
- rules: {
- '@typescript-eslint/no-shadow': ['error'],
- 'no-shadow': 'off',
- 'no-undef': 'off',
- },
- },
- ],
};
diff --git a/example/.gitattributes b/example/.gitattributes
deleted file mode 100644
index 45a3dcb2a..000000000
--- a/example/.gitattributes
+++ /dev/null
@@ -1,3 +0,0 @@
-# Windows files should use crlf line endings
-# https://help.github.com/articles/dealing-with-line-endings/
-*.bat text eol=crlf
diff --git a/example/.gitignore b/example/.gitignore
index 4c4ac05c0..d5ae45669 100644
--- a/example/.gitignore
+++ b/example/.gitignore
@@ -20,6 +20,7 @@ DerivedData
*.hmap
*.ipa
*.xcuserstate
+**/.xcode.env.local
# Android/IntelliJ
#
@@ -46,12 +47,28 @@ yarn-error.log
# For more information about the recommended setup visit:
# https://docs.fastlane.tools/best-practices/source-control/
-*/fastlane/report.xml
-*/fastlane/Preview.html
-*/fastlane/screenshots
+**/fastlane/report.xml
+**/fastlane/Preview.html
+**/fastlane/screenshots
+**/fastlane/test_output
# Bundle artifact
*.jsbundle
-# CocoaPods
-/ios/Pods/
+# Ruby / CocoaPods
+**/Pods/
+/vendor/bundle/
+
+# Temporary files created by Metro to check the health of the file watcher
+.metro-health-check*
+
+# testing
+/coverage
+
+# Yarn
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
diff --git a/example/.prettierrc.js b/example/.prettierrc.js
index 84196d95f..2b540746a 100644
--- a/example/.prettierrc.js
+++ b/example/.prettierrc.js
@@ -1,7 +1,7 @@
module.exports = {
+ arrowParens: 'avoid',
+ bracketSameLine: true,
bracketSpacing: false,
- jsxBracketSameLine: true,
singleQuote: true,
trailingComma: 'all',
- arrowParens: 'avoid',
};
diff --git a/example/.watchmanconfig b/example/.watchmanconfig
index 9e26dfeeb..0967ef424 100644
--- a/example/.watchmanconfig
+++ b/example/.watchmanconfig
@@ -1 +1 @@
-{}
\ No newline at end of file
+{}
diff --git a/example/Gemfile b/example/Gemfile
new file mode 100644
index 000000000..85d7f6828
--- /dev/null
+++ b/example/Gemfile
@@ -0,0 +1,9 @@
+source 'https://rubygems.org'
+
+# You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
+ruby ">= 2.6.10"
+
+# Exclude problematic versions of cocoapods and activesupport that causes build failures.
+gem 'cocoapods', '>= 1.13', '!= 1.15.0', '!= 1.15.1'
+gem 'activesupport', '>= 6.1.7.5', '!= 7.1.0'
+gem 'xcodeproj', '< 1.26.0'
diff --git a/example/README.md b/example/README.md
new file mode 100644
index 000000000..12470c30e
--- /dev/null
+++ b/example/README.md
@@ -0,0 +1,79 @@
+This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli).
+
+# Getting Started
+
+>**Note**: Make sure you have completed the [React Native - Environment Setup](https://reactnative.dev/docs/environment-setup) instructions till "Creating a new application" step, before proceeding.
+
+## Step 1: Start the Metro Server
+
+First, you will need to start **Metro**, the JavaScript _bundler_ that ships _with_ React Native.
+
+To start Metro, run the following command from the _root_ of your React Native project:
+
+```bash
+# using npm
+npm start
+
+# OR using Yarn
+yarn start
+```
+
+## Step 2: Start your Application
+
+Let Metro Bundler run in its _own_ terminal. Open a _new_ terminal from the _root_ of your React Native project. Run the following command to start your _Android_ or _iOS_ app:
+
+### For Android
+
+```bash
+# using npm
+npm run android
+
+# OR using Yarn
+yarn android
+```
+
+### For iOS
+
+```bash
+# using npm
+npm run ios
+
+# OR using Yarn
+yarn ios
+```
+
+If everything is set up _correctly_, you should see your new app running in your _Android Emulator_ or _iOS Simulator_ shortly provided you have set up your emulator/simulator correctly.
+
+This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.
+
+## Step 3: Modifying your App
+
+Now that you have successfully run the app, let's modify it.
+
+1. Open `App.tsx` in your text editor of choice and edit some lines.
+2. For **Android**: Press the R key twice or select **"Reload"** from the **Developer Menu** (Ctrl + M (on Window and Linux) or Cmd ⌘ + M (on macOS)) to see your changes!
+
+ For **iOS**: Hit Cmd ⌘ + R in your iOS Simulator to reload the app and see your changes!
+
+## Congratulations! :tada:
+
+You've successfully run and modified your React Native App. :partying_face:
+
+### Now what?
+
+- If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps).
+- If you're curious to learn more about React Native, check out the [Introduction to React Native](https://reactnative.dev/docs/getting-started).
+
+# Troubleshooting
+
+If you can't get this to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page.
+
+# Learn More
+
+To learn more about React Native, take a look at the following resources:
+
+- [React Native Website](https://reactnative.dev) - learn more about React Native.
+- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment.
+- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**.
+- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts.
+- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native.
diff --git a/example/__tests__/App.test.tsx b/example/__tests__/App.test.tsx
new file mode 100644
index 000000000..9eac6fbc8
--- /dev/null
+++ b/example/__tests__/App.test.tsx
@@ -0,0 +1,17 @@
+/**
+ * @format
+ */
+
+import 'react-native';
+import React from 'react';
+import App from '../App';
+
+// Note: import explicitly to use the types shipped with jest.
+import {it} from '@jest/globals';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+ renderer.create();
+});
diff --git a/example/android/app/build.gradle b/example/android/app/build.gradle
index ba8d7ee55..4c811729a 100644
--- a/example/android/app/build.gradle
+++ b/example/android/app/build.gradle
@@ -8,14 +8,14 @@ apply plugin: "com.facebook.react"
*/
react {
/* Folders */
- // The root of your project, i.e. where "package.json" lives. Default is '..'
- // root = file("../")
- // The folder where the react-native NPM package is. Default is ../node_modules/react-native
- // reactNativeDir = file("../node_modules/react-native")
- // The folder where the react-native Codegen package is. Default is ../node_modules/@react-native/codegen
- // codegenDir = file("../node_modules/@react-native/codegen")
- // The cli.js file which is the React Native CLI entrypoint. Default is ../node_modules/react-native/cli.js
- // cliFile = file("../node_modules/react-native/cli.js")
+ // The root of your project, i.e. where "package.json" lives. Default is '../..'
+ // root = file("../../")
+ // The folder where the react-native NPM package is. Default is ../../node_modules/react-native
+ // reactNativeDir = file("../../node_modules/react-native")
+ // The folder where the react-native Codegen package is. Default is ../../node_modules/@react-native/codegen
+ // codegenDir = file("../../node_modules/@react-native/codegen")
+ // The cli.js file which is the React Native CLI entrypoint. Default is ../../node_modules/react-native/cli.js
+ // cliFile = file("../../node_modules/react-native/cli.js")
/* Variants */
// The list of variants to that are debuggable. For those we're going to
@@ -49,6 +49,9 @@ react {
//
// The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
// hermesFlags = ["-O", "-output-source-map"]
+
+ /* Autolinking */
+ autolinkLibrariesWithApp()
}
/**
@@ -107,7 +110,6 @@ android {
dependencies {
// The version of react-native is set by the React Native Gradle Plugin
implementation("com.facebook.react:react-android")
- implementation("com.facebook.react:flipper-integration")
if (hermesEnabled.toBoolean()) {
implementation("com.facebook.react:hermes-android")
@@ -115,5 +117,3 @@ dependencies {
implementation jscFlavor
}
}
-
-apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
diff --git a/example/android/app/src/main/AndroidManifest.xml b/example/android/app/src/main/AndroidManifest.xml
index 2714f9227..e1892528b 100644
--- a/example/android/app/src/main/AndroidManifest.xml
+++ b/example/android/app/src/main/AndroidManifest.xml
@@ -2,22 +2,21 @@
-
-
+ android:theme="@style/AppTheme"
+ android:supportsRtl="true">
+ android:windowSoftInputMode="adjustResize"
+ android:exported="true">
diff --git a/example/android/app/src/main/java/com/example/MainApplication.kt b/example/android/app/src/main/java/com/example/MainApplication.kt
index 7bc3cbb65..33ac4a77d 100644
--- a/example/android/app/src/main/java/com/example/MainApplication.kt
+++ b/example/android/app/src/main/java/com/example/MainApplication.kt
@@ -9,7 +9,7 @@ import com.facebook.react.ReactPackage
import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.load
import com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost
import com.facebook.react.defaults.DefaultReactNativeHost
-import com.facebook.react.flipper.ReactNativeFlipper
+import com.facebook.react.soloader.OpenSourceMergedSoMapping
import com.facebook.soloader.SoLoader
class MainApplication : Application(), ReactApplication {
@@ -31,15 +31,14 @@ class MainApplication : Application(), ReactApplication {
}
override val reactHost: ReactHost
- get() = getDefaultReactHost(this.applicationContext, reactNativeHost)
+ get() = getDefaultReactHost(applicationContext, reactNativeHost)
override fun onCreate() {
super.onCreate()
- SoLoader.init(this, false)
+ SoLoader.init(this, OpenSourceMergedSoMapping)
if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
// If you opted-in for the New Architecture, we load the native entry point for this app.
load()
}
- ReactNativeFlipper.initializeFlipper(this, reactNativeHost.reactInstanceManager)
}
}
diff --git a/example/android/app/src/main/res/drawable/rn_edit_text_material.xml b/example/android/app/src/main/res/drawable/rn_edit_text_material.xml
new file mode 100644
index 000000000..5c25e728e
--- /dev/null
+++ b/example/android/app/src/main/res/drawable/rn_edit_text_material.xml
@@ -0,0 +1,37 @@
+
+
+
+
+
+
+