diff --git a/.gitignore b/.gitignore index 2c1792d..224fed7 100644 --- a/.gitignore +++ b/.gitignore @@ -29,6 +29,7 @@ build/ .gradle local.properties *.iml +.history # node.js # diff --git a/.whitesource b/.whitesource new file mode 100644 index 0000000..e0aaa3e --- /dev/null +++ b/.whitesource @@ -0,0 +1,8 @@ +{ + "checkRunSettings": { + "vulnerableCheckRunConclusionLevel": "failure" + }, + "issueSettings": { + "minSeverityLevel": "LOW" + } +} \ No newline at end of file diff --git a/README.md b/README.md index 8b28b26..2b6709c 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,15 @@ # React Native Custom Tabs [![npm version](https://badge.fury.io/js/react-native-custom-tabs.svg)](https://badge.fury.io/js/react-native-custom-tabs) [![Software License](https://img.shields.io/badge/license-Apache%202.0-brightgreen.svg)](https://github.com/droibit/react-native-custom-tabs/blob/develop/LICENSE) -[Chrome Custom Tabs](https://developer.chrome.com/multidevice/android/customtabs) for React Native. -Custom Tabs is supported only for Android, so the behavior on each platform is bellow. - -* Android - If Chrome is installed, open the URL in Chrome that you have customized some of the look & feel. If it is not installed, open in other browser. +Chrome Custom Tabs for React Native. Custom Tabs is supported only Chrome for Android. For this reason, the interface is the same, but the behavior is following: * iOS If Chrome is installed, open the URL in it. If it is not installed, open in Safari. -Customization and detailed behavior refer to the [Usage](#Usage). +* Android + If Chrome is installed, open the URL in Chrome that you have customized some of the look & feel. If it is not installed, open in other browser. + +Customization and detailed behavior refer to the Usage. ## Installation @@ -26,7 +25,7 @@ rnpm link #### Android -In Android, Add it in your **root** `build.gradle`([e.g. example](https://github.com/droibit/react-native-custom-tabs/blob/develop/example/android/build.gradle)) at the end of repositories: +In Android, Add it in your root build.gradle at the end of repositories: ```groovy allprojects { @@ -37,40 +36,17 @@ allprojects { } ``` -And, provide `CustomTabsPackage` in your Application class. - -```java -import com.github.droibit.android.reactnative.customtabs.CustomTabsPackage; - -@Override -protected List getPackages() { - return Arrays.asList( - ..., - new CustomTabsPackage() - ); -} -``` +### Manually -If you use version `0.1.5` or higher, change the **app** `build.gradle`. - -```groovy -android { - ... - compileSdkVersion 25 - buildToolsVersion "25.0.1" -} - -dependencies { - ... - compile "com.android.support:appcompat-v7:25.0.1" -} -``` +TODO ## Usage Open the URL as `Linking` of React Native. ```javascript +import { CustomTabs } from 'react-native-custom-tabs'; + CustomTabs.openURL('https://www.google.com').then((launched: {boolean}) => { console.log(`Launched custom tabs: ${launched}`); }).catch(err => { @@ -78,12 +54,13 @@ CustomTabs.openURL('https://www.google.com').then((launched: {boolean}) => { }); ``` -#### Customize for Android +#### Customization(Android) You can customize the look & feel in Android. The following option is ignored in iOS. ```javascript import { + CustomTabs, ANIMATIONS_SLIDE, ANIMATIONS_FADE } from 'react-native-custom-tabs'; @@ -93,20 +70,13 @@ CustomTabs.openURL(url, { enableUrlBarHiding: true, showPageTitle: true, enableDefaultShare: true, - // Specify full animation resource identifier(package:anim/name) - // or only resource name(in case of animation bundled with app). - animations: { - startEnter: 'slide_in_bottom', - startExit: 'slide_out_bottom', - endEnter: 'slide_in_bottom', - endExit: 'slide_out_bottom', - }, - // And supports SLIDE and FADE as default animation. - // animations: ANIMATIONS_SLIDE or ANIMATIONS_FADE. + animations: ANIMATIONS_SLIDE, // or ANIMATIONS_FADE headers: { 'my-custom-header': 'my custom header value' }, - forceCloseOnRedirection: true, + backButton:true, // or false + backButtonColor:'light', // or dark + backButtonIcon:'ic_arrow_back_white_24dp' // to provide own back-button }); ``` @@ -118,19 +88,19 @@ The option to support: |enableUrlBarHiding|boolean|undefined|Enables the url bar to hide as the user scrolls down on the page.| |showPageTitle|boolean|undefined|Sets whether the title should be shown in the custom tab.| |enableDefaultShare|boolean|undefined|Whether to add a default shared items of the menu.| -|animations|Object|undefined|Sets the exit and start animations. ANIMATIONS_FADE, ANIMATIONS_SLIDE or custom object with string properties `startEnter`, `startExit`, `endEnter` and `endExit` each defining an Android animation resource ID to use for the animations, such as `slide_in_right`.| +|animations|number|undefined|Sets the exit and start animations. ANIMATIONS_FADE or ANIMATIONS_SLIDE.| |headers|Object|undefined|Sets any custom headers that should be used.| -|forceCloseOnRedirection|boolean|undefined|Workaround that Custom Tabs doesn't close on redirecting back to app scheme.([#11](https://github.com/droibit/react-native-custom-tabs/pull/11))| - +|backButton|Boolean|false|(android only), set '<' back button insted of cross icon.| +|backButtonColor|enum|dark|(android only), 'light' or 'dark', provide white or black color '<' icon| +|backButtonIcon|string|undefined| (android only), can provide own icon, just download the custom icons from https://material.io/icons/ and add them in REACTNATIVEPROJECT/android/app/src/main/res/mipmap-*| -`undefined` property is default behavior of the Custom Tabs. +`undefined` property is the default behavior of the Custom Tabs. Customize and default look & feel. ![screenshot](http://i.imgur.com/0qE2E7a.gif) ## License - Copyright (C) 2015 The Android Open Source Project Copyright (C) 2016 Shinya Kumagai Licensed under the Apache License, Version 2.0 (the "License"); diff --git a/android/build.gradle b/android/build.gradle index 53a1a73..1b83f7d 100644 --- a/android/build.gradle +++ b/android/build.gradle @@ -1,23 +1,28 @@ apply plugin: "com.android.library" +def safeExtGet(prop, fallback) { + rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback +} + android { - compileSdkVersion 25 - buildToolsVersion "25.0.1" + compileSdkVersion safeExtGet("compileSdkVersion", 28) + buildToolsVersion safeExtGet("buildToolsVersion", "28.0.3") defaultConfig { - minSdkVersion 16 - targetSdkVersion 23 + minSdkVersion safeExtGet("minSdkVersion", 16) + targetSdkVersion safeExtGet("targetSdkVersion", 28) versionCode 1 versionName "1.0" } } dependencies { - compile "com.facebook.react:react-native:+" // From node_modules - compile 'com.android.support:customtabs:25.0.1' - compile ('com.github.droibit.customtabslauncher:launcher:1.0.8') { + implementation "com.facebook.react:react-native:${safeExtGet('reactNativeVersion', '+')}" // From node_modules + //implementation 'com.android.support:customtabs:28.0.3' + implementation 'androidx.browser:browser:1.0.0' + implementation ('com.github.droibit.customtabslauncher:launcher:1.4.0') { exclude module: 'customtabs' } - testCompile 'junit:junit:4.12' -} \ No newline at end of file + testImplementation 'junit:junit:4.12' +} diff --git a/android/gradle/wrapper/gradle-wrapper.jar b/android/gradle/wrapper/gradle-wrapper.jar new file mode 100644 index 0000000..f6b961f Binary files /dev/null and b/android/gradle/wrapper/gradle-wrapper.jar differ diff --git a/android/gradle/wrapper/gradle-wrapper.properties b/android/gradle/wrapper/gradle-wrapper.properties new file mode 100644 index 0000000..953eb56 --- /dev/null +++ b/android/gradle/wrapper/gradle-wrapper.properties @@ -0,0 +1,6 @@ +#Sun Nov 17 11:28:50 CET 2019 +distributionBase=GRADLE_USER_HOME +distributionPath=wrapper/dists +zipStoreBase=GRADLE_USER_HOME +zipStorePath=wrapper/dists +distributionUrl=https\://services.gradle.org/distributions/gradle-5.4.1-all.zip diff --git a/android/gradlew b/android/gradlew new file mode 100644 index 0000000..cccdd3d --- /dev/null +++ b/android/gradlew @@ -0,0 +1,172 @@ +#!/usr/bin/env sh + +############################################################################## +## +## Gradle start up script for UN*X +## +############################################################################## + +# Attempt to set APP_HOME +# Resolve links: $0 may be a link +PRG="$0" +# Need this for relative symlinks. +while [ -h "$PRG" ] ; do + ls=`ls -ld "$PRG"` + link=`expr "$ls" : '.*-> \(.*\)$'` + if expr "$link" : '/.*' > /dev/null; then + PRG="$link" + else + PRG=`dirname "$PRG"`"/$link" + fi +done +SAVED="`pwd`" +cd "`dirname \"$PRG\"`/" >/dev/null +APP_HOME="`pwd -P`" +cd "$SAVED" >/dev/null + +APP_NAME="Gradle" +APP_BASE_NAME=`basename "$0"` + +# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. +DEFAULT_JVM_OPTS="" + +# Use the maximum available, or set MAX_FD != -1 to use that value. +MAX_FD="maximum" + +warn () { + echo "$*" +} + +die () { + echo + echo "$*" + echo + exit 1 +} + +# OS specific support (must be 'true' or 'false'). +cygwin=false +msys=false +darwin=false +nonstop=false +case "`uname`" in + CYGWIN* ) + cygwin=true + ;; + Darwin* ) + darwin=true + ;; + MINGW* ) + msys=true + ;; + NONSTOP* ) + nonstop=true + ;; +esac + +CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar + +# Determine the Java command to use to start the JVM. +if [ -n "$JAVA_HOME" ] ; then + if [ -x "$JAVA_HOME/jre/sh/java" ] ; then + # IBM's JDK on AIX uses strange locations for the executables + JAVACMD="$JAVA_HOME/jre/sh/java" + else + JAVACMD="$JAVA_HOME/bin/java" + fi + if [ ! -x "$JAVACMD" ] ; then + die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME + +Please set the JAVA_HOME variable in your environment to match the +location of your Java installation." + fi +else + JAVACMD="java" + which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. + +Please set the JAVA_HOME variable in your environment to match the +location of your Java installation." +fi + +# Increase the maximum file descriptors if we can. +if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then + MAX_FD_LIMIT=`ulimit -H -n` + if [ $? -eq 0 ] ; then + if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then + MAX_FD="$MAX_FD_LIMIT" + fi + ulimit -n $MAX_FD + if [ $? -ne 0 ] ; then + warn "Could not set maximum file descriptor limit: $MAX_FD" + fi + else + warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT" + fi +fi + +# For Darwin, add options to specify how the application appears in the dock +if $darwin; then + GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\"" +fi + +# For Cygwin, switch paths to Windows format before running java +if $cygwin ; then + APP_HOME=`cygpath --path --mixed "$APP_HOME"` + CLASSPATH=`cygpath --path --mixed "$CLASSPATH"` + JAVACMD=`cygpath --unix "$JAVACMD"` + + # We build the pattern for arguments to be converted via cygpath + ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null` + SEP="" + for dir in $ROOTDIRSRAW ; do + ROOTDIRS="$ROOTDIRS$SEP$dir" + SEP="|" + done + OURCYGPATTERN="(^($ROOTDIRS))" + # Add a user-defined pattern to the cygpath arguments + if [ "$GRADLE_CYGPATTERN" != "" ] ; then + OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)" + fi + # Now convert the arguments - kludge to limit ourselves to /bin/sh + i=0 + for arg in "$@" ; do + CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -` + CHECK2=`echo "$arg"|egrep -c "^-"` ### Determine if an option + + if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then ### Added a condition + eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"` + else + eval `echo args$i`="\"$arg\"" + fi + i=$((i+1)) + done + case $i in + (0) set -- ;; + (1) set -- "$args0" ;; + (2) set -- "$args0" "$args1" ;; + (3) set -- "$args0" "$args1" "$args2" ;; + (4) set -- "$args0" "$args1" "$args2" "$args3" ;; + (5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;; + (6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;; + (7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;; + (8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;; + (9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;; + esac +fi + +# Escape application args +save () { + for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done + echo " " +} +APP_ARGS=$(save "$@") + +# Collect all arguments for the java command, following the shell quoting and substitution rules +eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS" + +# by default we should be in the correct project dir, but when run from Finder on Mac, the cwd is wrong +if [ "$(uname)" = "Darwin" ] && [ "$HOME" = "$PWD" ]; then + cd "$(dirname "$0")" +fi + +exec "$JAVACMD" "$@" diff --git a/android/gradlew.bat b/android/gradlew.bat new file mode 100644 index 0000000..e95643d --- /dev/null +++ b/android/gradlew.bat @@ -0,0 +1,84 @@ +@if "%DEBUG%" == "" @echo off +@rem ########################################################################## +@rem +@rem Gradle startup script for Windows +@rem +@rem ########################################################################## + +@rem Set local scope for the variables with windows NT shell +if "%OS%"=="Windows_NT" setlocal + +set DIRNAME=%~dp0 +if "%DIRNAME%" == "" set DIRNAME=. +set APP_BASE_NAME=%~n0 +set APP_HOME=%DIRNAME% + +@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. +set DEFAULT_JVM_OPTS= + +@rem Find java.exe +if defined JAVA_HOME goto findJavaFromJavaHome + +set JAVA_EXE=java.exe +%JAVA_EXE% -version >NUL 2>&1 +if "%ERRORLEVEL%" == "0" goto init + +echo. +echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. +echo. +echo Please set the JAVA_HOME variable in your environment to match the +echo location of your Java installation. + +goto fail + +:findJavaFromJavaHome +set JAVA_HOME=%JAVA_HOME:"=% +set JAVA_EXE=%JAVA_HOME%/bin/java.exe + +if exist "%JAVA_EXE%" goto init + +echo. +echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% +echo. +echo Please set the JAVA_HOME variable in your environment to match the +echo location of your Java installation. + +goto fail + +:init +@rem Get command-line arguments, handling Windows variants + +if not "%OS%" == "Windows_NT" goto win9xME_args + +:win9xME_args +@rem Slurp the command line arguments. +set CMD_LINE_ARGS= +set _SKIP=2 + +:win9xME_args_slurp +if "x%~1" == "x" goto execute + +set CMD_LINE_ARGS=%* + +:execute +@rem Setup the command line + +set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar + +@rem Execute Gradle +"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS% + +:end +@rem End local scope for the variables with windows NT shell +if "%ERRORLEVEL%"=="0" goto mainEnd + +:fail +rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of +rem the _cmd.exe /c_ return code! +if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1 +exit /b 1 + +:mainEnd +if "%OS%"=="Windows_NT" endlocal + +:omega diff --git a/android/src/main/java/com/github/droibit/android/reactnative/customtabs/CustomTabsModule.java b/android/src/main/java/com/github/droibit/android/reactnative/customtabs/CustomTabsModule.java index 957c3ca..3915556 100644 --- a/android/src/main/java/com/github/droibit/android/reactnative/customtabs/CustomTabsModule.java +++ b/android/src/main/java/com/github/droibit/android/reactnative/customtabs/CustomTabsModule.java @@ -3,11 +3,11 @@ import android.app.Activity; import android.content.Context; import android.graphics.Color; -import android.content.Intent; import android.os.Bundle; import android.provider.Browser; -import android.support.customtabs.CustomTabsIntent; +// import android.support.customtabs.CustomTabsIntent; import android.text.TextUtils; +import androidx.browser.customtabs.CustomTabsIntent; import com.droibit.android.customtabs.launcher.CustomTabsLauncher; import com.facebook.react.bridge.JSApplicationIllegalArgumentException; @@ -22,11 +22,16 @@ import com.facebook.react.common.MapBuilder; import com.facebook.react.common.annotations.VisibleForTesting; + import java.util.Map; -import java.util.regex.Pattern; import javax.annotation.Nullable; +import android.graphics.Bitmap; +import android.graphics.BitmapFactory; +import android.content.res.Resources; +import android.R.drawable; + /** * CustomTabs module. */ @@ -43,6 +48,9 @@ public class CustomTabsModule extends ReactContextBaseJavaModule { private static final String KEY_ANIMATION_START_EXIT = "startExit"; private static final String KEY_ANIMATION_END_ENTER = "endEnter"; private static final String KEY_ANIMATION_END_EXIT = "endExit"; + private static final String KEY_BACKBUTTON = "backButton"; + private static final String KEY_BACKBUTTONCOLOR = "backButtonColor"; + private static final String KEY_BACKBUTTONICON = "backButtonIcon"; private static final Map CONSTANTS; @@ -55,6 +63,9 @@ public class CustomTabsModule extends ReactContextBaseJavaModule { CONSTANTS.put(KEY_ANIMATIONS, KEY_ANIMATIONS); CONSTANTS.put(KEY_HEADERS, KEY_HEADERS); CONSTANTS.put(KEY_FORCE_CLOSE_ON_REDIRECTION, KEY_FORCE_CLOSE_ON_REDIRECTION); + CONSTANTS.put(KEY_BACKBUTTON, KEY_BACKBUTTON); + CONSTANTS.put(KEY_BACKBUTTONCOLOR, KEY_BACKBUTTONCOLOR); + CONSTANTS.put(KEY_BACKBUTTONICON, KEY_BACKBUTTONICON); } private static final String MODULE_NAME = "CustomTabsManager"; @@ -67,6 +78,9 @@ public CustomTabsModule(ReactApplicationContext reactContext) { super(reactContext); } + /** + * {@inheritDoc} + */ @Override public String getName() { return MODULE_NAME; @@ -103,7 +117,8 @@ public void openURL(String url, ReadableMap option, Promise promise) { ); final Activity activity = getCurrentActivity(); if (activity != null) { - CustomTabsLauncher.launch(activity, customTabsIntent, url); + // CustomTabsLauncher.launch(activity, customTabsIntent, url); + CustomTabsLauncher.launch(activity, customTabsIntent, android.net.Uri.parse(url)); promise.resolve(true); } else { promise.resolve(false); @@ -118,9 +133,9 @@ public void openURL(String url, ReadableMap option, Promise promise) { } @VisibleForTesting - /* package */ CustomTabsIntent buildIntent(Context context, - CustomTabsIntent.Builder builder, - ReadableMap option) { + /* package */ CustomTabsIntent buildIntent(Context context, + CustomTabsIntent.Builder builder, + ReadableMap option) { if (option.hasKey(KEY_TOOLBAR_COLOR)) { final String colorString = option.getString(KEY_TOOLBAR_COLOR); try { @@ -130,6 +145,30 @@ public void openURL(String url, ReadableMap option, Promise promise) { "Invalid toolbar color '" + colorString + "': " + e.getMessage()); } } + //KEY_BACKBUTTON + if (option.hasKey(KEY_BACKBUTTON) && option.getBoolean(KEY_BACKBUTTON)) { + Resources res = context.getResources(); + String packageName = context.getPackageName(); + String icon = "ic_chevron_left_black_24dp"; + if (option.hasKey(KEY_BACKBUTTONCOLOR)) { + String color = option.getString(KEY_BACKBUTTONCOLOR); + icon = color.equalsIgnoreCase("light") ? "ic_chevron_left_white_24dp" : "ic_chevron_left_black_24dp"; + } + int iconId = res.getIdentifier(icon, "mipmap", packageName); + Bitmap iconBitMap = BitmapFactory.decodeResource(res, iconId); + builder.setCloseButtonIcon(iconBitMap); + } + + //KEY_BACKBUTTONICON + if (option.hasKey(KEY_BACKBUTTONICON)) { + Resources res = context.getResources(); + String packageName = context.getPackageName(); + String icon = !option.getString(KEY_BACKBUTTONICON).equals("") ? option.getString(KEY_BACKBUTTONICON) : "ic_chevron_left_black_24dp"; + int iconId = res.getIdentifier(icon, "mipmap", packageName); + Bitmap iconBitMap = BitmapFactory.decodeResource(res, iconId); + builder.setCloseButtonIcon(iconBitMap); + } + if (option.hasKey(KEY_ENABLE_URL_BAR_HIDING) && option.getBoolean(KEY_ENABLE_URL_BAR_HIDING)) { builder.enableUrlBarHiding(); @@ -177,32 +216,33 @@ public void openURL(String url, ReadableMap option, Promise promise) { if (option.hasKey(KEY_FORCE_CLOSE_ON_REDIRECTION) && option.getBoolean(KEY_FORCE_CLOSE_ON_REDIRECTION)) { - customTabsIntent.intent.addFlags(Intent.FLAG_ACTIVITY_NO_HISTORY); - customTabsIntent.intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK); + customTabsIntent.intent.addFlags(Intent.FLAG_ACTIVITY_NO_HISTORY); + customTabsIntent.intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK); } - + return customTabsIntent; } @VisibleForTesting - /* package */ boolean httpOrHttpsScheme(String url) { + /* package */ boolean httpOrHttpsScheme(String url) { return url.startsWith("http") || url.startsWith("https"); } + /** @VisibleForTesting - /* package */ void applyAnimation(Context context, CustomTabsIntent.Builder builder, ReadableMap animations) { + /* package *\/ void applyAnimation(Context context, CustomTabsIntent.Builder builder, ReadableMap animations) { final int startEnterAnimationId = animations.hasKey(KEY_ANIMATION_START_ENTER) - ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_START_ENTER)) - : -1; + ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_START_ENTER)) + : -1; final int startExitAnimationId = animations.hasKey(KEY_ANIMATION_START_EXIT) - ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_START_EXIT)) - : -1; + ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_START_EXIT)) + : -1; final int endEnterAnimationId = animations.hasKey(KEY_ANIMATION_END_ENTER) - ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_END_ENTER)) - : -1; + ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_END_ENTER)) + : -1; final int endExitAnimationId = animations.hasKey(KEY_ANIMATION_END_EXIT) - ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_END_EXIT)) - : -1; + ? resolveAnimationIdentifierIfNeeded(context, animations.getString(KEY_ANIMATION_END_EXIT)) + : -1; if (startEnterAnimationId != -1 && startExitAnimationId != -1) { builder.setStartAnimations(context, startEnterAnimationId, startExitAnimationId); @@ -212,6 +252,19 @@ public void openURL(String url, ReadableMap option, Promise promise) { builder.setExitAnimations(context, endEnterAnimationId, endExitAnimationId); } } + **/ + + @VisibleForTesting + /* package */ void applySlideAnimation(Context context, CustomTabsIntent.Builder builder) { + builder.setStartAnimations(context, R.anim.slide_in_right, R.anim.slide_out_left) + .setExitAnimations(context, android.R.anim.slide_in_left, android.R.anim.slide_out_right); + } + + @VisibleForTesting + /* package */ void applyFadeAnimation(Context context, CustomTabsIntent.Builder builder) { + builder.setStartAnimations(context, android.R.anim.fade_in, android.R.anim.fade_out) + .setExitAnimations(context, android.R.anim.fade_out, android.R.anim.fade_in); + } // Complement the application name of the resource qualifier as necessary. private int resolveAnimationIdentifierIfNeeded(Context context, String identifier) { diff --git a/android/src/main/res/mipmap-hdpi/ic_chevron_left_black_24dp.png b/android/src/main/res/mipmap-hdpi/ic_chevron_left_black_24dp.png new file mode 100644 index 0000000..f4ef28e Binary files /dev/null and b/android/src/main/res/mipmap-hdpi/ic_chevron_left_black_24dp.png differ diff --git a/android/src/main/res/mipmap-hdpi/ic_chevron_left_white_24dp.png b/android/src/main/res/mipmap-hdpi/ic_chevron_left_white_24dp.png new file mode 100644 index 0000000..bd23a06 Binary files /dev/null and b/android/src/main/res/mipmap-hdpi/ic_chevron_left_white_24dp.png differ diff --git a/android/src/main/res/mipmap-mdpi/ic_chevron_left_black_24dp.png b/android/src/main/res/mipmap-mdpi/ic_chevron_left_black_24dp.png new file mode 100644 index 0000000..e6dbd93 Binary files /dev/null and b/android/src/main/res/mipmap-mdpi/ic_chevron_left_black_24dp.png differ diff --git a/android/src/main/res/mipmap-mdpi/ic_chevron_left_white_24dp.png b/android/src/main/res/mipmap-mdpi/ic_chevron_left_white_24dp.png new file mode 100644 index 0000000..4d7869d Binary files /dev/null and b/android/src/main/res/mipmap-mdpi/ic_chevron_left_white_24dp.png differ diff --git a/android/src/main/res/mipmap-xhdpi/ic_chevron_left_black_24dp.png b/android/src/main/res/mipmap-xhdpi/ic_chevron_left_black_24dp.png new file mode 100644 index 0000000..8ead939 Binary files /dev/null and b/android/src/main/res/mipmap-xhdpi/ic_chevron_left_black_24dp.png differ diff --git a/android/src/main/res/mipmap-xhdpi/ic_chevron_left_white_24dp.png b/android/src/main/res/mipmap-xhdpi/ic_chevron_left_white_24dp.png new file mode 100644 index 0000000..62f3590 Binary files /dev/null and b/android/src/main/res/mipmap-xhdpi/ic_chevron_left_white_24dp.png differ diff --git a/android/src/main/res/mipmap-xxhdpi/ic_chevron_left_black_24dp.png b/android/src/main/res/mipmap-xxhdpi/ic_chevron_left_black_24dp.png new file mode 100644 index 0000000..f443b3c Binary files /dev/null and b/android/src/main/res/mipmap-xxhdpi/ic_chevron_left_black_24dp.png differ diff --git a/android/src/main/res/mipmap-xxhdpi/ic_chevron_left_white_24dp.png b/android/src/main/res/mipmap-xxhdpi/ic_chevron_left_white_24dp.png new file mode 100644 index 0000000..7141cc6 Binary files /dev/null and b/android/src/main/res/mipmap-xxhdpi/ic_chevron_left_white_24dp.png differ diff --git a/example/index.android.js b/example/index.android.js index 6019820..f87c775 100644 --- a/example/index.android.js +++ b/example/index.android.js @@ -20,53 +20,55 @@ import { ANIMATIONS_FADE } from 'react-native-custom-tabs'; -export default class Example extends Component { +import type {TabOption} from 'react-native-custom-tabs'; + +class Example extends Component { render() { return ( - - - - - - Click on the link below! - - this.openCustomizedCustomTabs()} > - - https://www.google.com + + + + + + Click on the link below! + + this.openCustomizedCustomTabs()} > + + https://www.google.com + + + + (Customized Look & Feel) - - - (Customized Look & Feel) - - this.openDefaultCustomTabs()} - style={{ marginTop: 8 }}> - - https://www.google.com + this.openDefaultCustomTabs()} + style={{marginTop: 8}}> + + https://www.google.com + + + + (Default Look & Feel) - - - (Default Look & Feel) - - this.errorOccur()} - style={{ marginTop: 8 }}> - - https://www.google.com + this.errorOccur()} + style={{marginTop: 8}}> + + https://www.google.com + + + + (Error occur) - - - (Error occur) - + - ); } @@ -76,14 +78,10 @@ export default class Example extends Component { enableUrlBarHiding: true, showPageTitle: true, enableDefaultShare: true, - animations: ANIMATIONS_FADE, - // animations: { - // startEnter: 'slide_up', - // startExit: 'android:anim/fade_out', - // endEnter: 'android:anim/fade_in', - // endExit: 'slide_down', - // }, - forceCloseOnRedirection: true, + animations: ANIMATIONS_SLIDE, + backButton:true, + backButtonColor:'light', + backButtonIcon:'ic_arrow_back_white_24dp' }); } @@ -98,7 +96,7 @@ export default class Example extends Component { }) } - openGoogle(option) { + openGoogle(option: ?TabOption) { CustomTabs.openURL('https://www.google.com', option).then((launched: boolean) => { console.log(`Launched custom tabs: ${launched}`); }).catch(err => { diff --git a/package.json b/package.json index d0b3836..d072047 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-custom-tabs", - "version": "0.1.7", + "version": "0.1.8", "description": "Chrome Custom Tabs for React Native.", "keywords": [ "react-native", @@ -8,16 +8,16 @@ "custom-tabs" ], "author": { - "name": "Shinya Kumagai", - "email": "roomful.rooms@gmail.com" + "name": "Patrick LUZOLO", + "email": "eldorplus@gmail.com" }, - "homepage": "https://github.com/droibit/react-native-custom-tabs", + "homepage": "https://github.com/eldorplus/react-native-custom-tabs", "bugs": { - "url": "https://github.com/droibit/react-native-custom-tabs/issues" + "url": "https://github.com/eldorplus/react-native-custom-tabs/issues" }, "repository": { "type": "git", - "url": "https://github.com/droibit/react-native-custom-tabs" + "url": "https://github.com/eldorplus/react-native-custom-tabs" }, "license": "Apache-2.0", "scripts": { @@ -28,12 +28,12 @@ "react": "*" }, "devDependencies": { - "react-native": "0.42.3", - "react": "15.4.2", - "babel-preset-react-native": "1.x.x", - "eslint": "3.x.x", - "eslint-plugin-babel": "3.x.x", - "eslint-plugin-react": "6.x.x", - "eslint-plugin-react-native": "2.x.x" + "react-native": "^0.61.2", + "react": "16.10.2", + "babel-preset-react-native": "^4.0.1", + "eslint": "^6.5.1", + "eslint-plugin-babel": "^5.3.0", + "eslint-plugin-react": "^7.16.0", + "eslint-plugin-react-native": "^3.7.0" } -} \ No newline at end of file +} diff --git a/react-native-custom-tabs.podspec b/react-native-custom-tabs.podspec new file mode 100644 index 0000000..f6bab79 --- /dev/null +++ b/react-native-custom-tabs.podspec @@ -0,0 +1,22 @@ +require 'json' + +package = JSON.parse(File.read(File.join(__dir__, 'package.json'))) + +Pod::Spec.new do |s| + s.name = "react-native-custom-tabs" + s.version = package['version'] + s.author = { "droibit" => "eldorplus@gmail.com" } + s.license = 'Apache' + s.summary = s.name + s.homepage = 'https://github.com/eldorplus/react-native-custom-tabs' + s.source = { :git => 'https://github.com/eldorplus/react-native-custom-tabs.git', :tag => "#{s.version}" } + s.requires_arc = true + s.platform = :ios, "8.0" + s.pod_target_xcconfig = { "CLANG_CXX_LANGUAGE_STANDARD" => "c++14" } + s.header_dir = 'ios' + s.preserve_paths = "ios/**" + s.dependency 'React' + s.source_files = 'ios/**/*.{h,m}' + s.exclude_files = 'android/**/*' + s.libraries = "stdc++" +end