Android overlay (#2557)

* Initial overlay implementation on Android

* Move logic to touch delegate

* Implement dismiss Overlay

* Overlay e2e

* fix iOS e2e

AndroidE2E/app/src/androidTest/java/com/reactnativenavigation/e2e/androide2e/OverlayTest.java

@@ -1,20 +1,18 @@
 package com.reactnativenavigation.e2e.androide2e;
 
-public class OverlayTest {//extends BaseTest {
+import android.support.test.uiautomator.By;
 
-//	@Test
-//	public void testOverlayAlertAppear() throws Exception {
-//		elementByText("PUSH OPTIONS SCREEN").click();
-//		elementByText("SHOW CUSTOM ALERT").click();
-//		assertExists(By.text("Test view"));
-//		elementByText("OK").click();
-//		assertExists(By.text("Static Title"));
-//	}
-//
-//	@Test
-//	public void testSnackbarAppear() throws Exception {
-//		elementByText("PUSH OPTIONS SCREEN").click();
-//		elementByText("SHOW SNACKBAR").click();
-//		assertExists(By.text("Test!"));
-//	}
+import org.junit.Test;
+
+public class OverlayTest extends BaseTest {
+
+	@Test
+	public void testOverlayAlertAppear() throws Exception {
+		elementByText("PUSH OPTIONS SCREEN").click();
+        elementByText("SHOW OVERLAY").click();
+		assertExists(By.text("Test view"));
+		elementByText("OK").click();
+		assertExists(By.text("Overlay disappeared"));
+        elementByText("OK").click();
+	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/parse/ButtonOptions.java

@@ -1,46 +0,0 @@
-package com.reactnativenavigation.parse;
-
-
-import android.support.annotation.ColorInt;
-
-import org.json.JSONObject;
-
-import static com.reactnativenavigation.parse.OverlayOptions.NO_COLOR;
-
-public class ButtonOptions {
-
-	public static ButtonOptions parse(JSONObject json) {
-		ButtonOptions options = new ButtonOptions();
-		if (json == null) return new ButtonOptions();
-
-		//TODO: parse
-		options.text = json.optString("text");
-		options.action = json.optString("action");
-		options.visible = json.optBoolean("visible", true);
-		options.textColor = json.optInt("textColor", NO_COLOR);
-
-		return options;
-	}
-
-	private String text = "";
-	private String action;
-	private boolean visible = false;
-	@ColorInt
-	private int textColor;
-
-	public String getText() {
-		return text;
-	}
-
-	public String getAction() {
-		return action;
-	}
-
-	public boolean isVisible() {
-		return visible;
-	}
-
-	public int getTextColor() {
-		return textColor;
-	}
-}

lib/android/app/src/main/java/com/reactnativenavigation/parse/LayoutFactory.java

@@ -10,7 +10,6 @@ import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 import com.reactnativenavigation.viewcontrollers.SideMenuController;
 import com.reactnativenavigation.viewcontrollers.StackController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
-import com.reactnativenavigation.viewcontrollers.toptabs.TopTabController;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsController;
 import com.reactnativenavigation.views.ComponentViewCreator;
 import com.reactnativenavigation.views.TopTabsLayoutCreator;
@@ -91,7 +90,7 @@ public class LayoutFactory {
 	private ViewController createComponent(LayoutNode node) {
 		String id = node.id;
 		String name = node.data.optString("name");
-		Options options = Options.parse(typefaceManager, node.data.optJSONObject("options"), defaultOptions);
+		Options options = Options.parse(typefaceManager, node.getNavigationOptions(), defaultOptions);
 		return new ComponentViewController(activity,
                 id,
                 name,

lib/android/app/src/main/java/com/reactnativenavigation/parse/Options.java

@@ -36,6 +36,7 @@ public class Options implements DEFAULT_VALUES {
 		result.topTabsOptions = TopTabsOptions.parse(json.optJSONObject("topTabs"));
         result.topTabOptions = TopTabOptions.parse(typefaceManager, json.optJSONObject("topTab"));
 		result.bottomTabsOptions = BottomTabsOptions.parse(json.optJSONObject("bottomTabs"));
+        result.overlayOptions = OverlayOptions.parse(json.optJSONObject("overlay"));
 
 		return result.withDefaultOptions(defaultOptions);
 	}
@@ -44,6 +45,7 @@ public class Options implements DEFAULT_VALUES {
     @NonNull public TopTabsOptions topTabsOptions = new TopTabsOptions();
     @NonNull public TopTabOptions topTabOptions = new TopTabOptions();
     @NonNull public BottomTabsOptions bottomTabsOptions = new BottomTabsOptions();
+    @NonNull public OverlayOptions overlayOptions = new OverlayOptions();
 
     void setTopTabIndex(int i) {
         topTabOptions.tabIndex = i;

lib/android/app/src/main/java/com/reactnativenavigation/parse/OverlayOptions.java

@@ -1,86 +1,15 @@
 package com.reactnativenavigation.parse;
 
-
-import android.support.annotation.ColorInt;
-
-import com.reactnativenavigation.viewcontrollers.ViewController;
-
 import org.json.JSONObject;
 
 public class OverlayOptions {
+    public Options.BooleanOptions interceptTouchOutside = Options.BooleanOptions.False;
 
-	public static final int NO_COLOR = -1;
-
-	public static OverlayOptions parse(JSONObject json) {
-		OverlayOptions options = new OverlayOptions();
-		if (json == null) return options;
-
-		options.title = json.optString("title");
-		options.text = json.optString("text");
-		options.positiveButton = ButtonOptions.parse(json.optJSONObject("positiveButton"));
-		options.negativeButton = ButtonOptions.parse(json.optJSONObject("negativeButton"));
-		options.button = ButtonOptions.parse(json.optJSONObject("button"));
-		options.textColor = json.optInt("textColor", NO_COLOR);
-		options.duration = json.optString("duration");
-		options.backgroundColor = json.optInt("backgroundColor", NO_COLOR);
-
-		return options;
-	}
-
-	public static OverlayOptions create(ViewController componentView) {
-		OverlayOptions options = new OverlayOptions();
-		if (componentView == null) return options;
-
-		options.customView = componentView;
-		return options;
-	}
-
-	private String title = "";
-	private String text = "";
-	private ButtonOptions positiveButton;
-	private ButtonOptions negativeButton;
-	private ButtonOptions button;
-	@ColorInt
-	private int textColor;
-	private String duration;
-	@ColorInt
-	private int backgroundColor;
-
-	private ViewController customView;
-
-	public String getText() {
-		return text;
-	}
-
-	public String getTitle() {
-		return title;
-	}
-
-	public ButtonOptions getPositiveButton() {
-		return positiveButton;
-	}
-
-	public ButtonOptions getNegativeButton() {
-		return negativeButton;
-	}
-
-	public ViewController getCustomView() {
-		return customView;
-	}
-
-	public ButtonOptions getButton() {
-		return button;
-	}
-
-	public int getTextColor() {
-		return textColor;
-	}
-
-	public String getDuration() {
-		return duration;
-	}
+    public static OverlayOptions parse(JSONObject json) {
+        OverlayOptions options = new OverlayOptions();
+        if (json == null) return options;
 
-	public int getBackgroundColor() {
-		return backgroundColor;
-	}
+        options.interceptTouchOutside = Options.BooleanOptions.parse(json.optString("interceptTouchOutside", ""));
+        return options;
+    }
 }

lib/android/app/src/main/java/com/reactnativenavigation/presentation/OverlayManager.java

@@ -0,0 +1,22 @@
+package com.reactnativenavigation.presentation;
+
+import android.view.View;
+import android.view.ViewGroup;
+
+import com.reactnativenavigation.viewcontrollers.ViewController;
+
+import java.util.HashMap;
+
+public class OverlayManager {
+    private final HashMap<String, Integer> overlayRegistry = new HashMap<>();
+
+    public void show(ViewGroup root, ViewController overlay) {
+        View view = overlay.getView();
+        overlayRegistry.put(overlay.getId(), view.getId());
+        root.addView(view);
+    }
+
+    public void dismiss(ViewGroup root, String componentId) {
+        root.removeView(root.findViewById(overlayRegistry.get(componentId)));
+    }
+}

lib/android/app/src/main/java/com/reactnativenavigation/presentation/OverlayPresenter.java

@@ -1,27 +0,0 @@
-package com.reactnativenavigation.presentation;
-
-
-import android.content.Context;
-
-import com.reactnativenavigation.parse.OverlayOptions;
-import com.reactnativenavigation.viewcontrollers.ViewController;
-import com.reactnativenavigation.viewcontrollers.overlay.OverlayFactory;
-import com.reactnativenavigation.viewcontrollers.overlay.OverlayInterface;
-
-public class OverlayPresenter {
-
-	private OverlayInterface overlay;
-
-	public OverlayPresenter(ViewController viewController, String type, OverlayOptions options) {
-		this.overlay = OverlayFactory.create(type, viewController, options);
-	}
-
-
-	public void show() {
-		overlay.show();
-	}
-
-	public void dismiss() {
-		overlay.dismiss();
-	}
-}

lib/android/app/src/main/java/com/reactnativenavigation/react/NavigationModule.java

@@ -14,7 +14,6 @@ import com.reactnativenavigation.parse.LayoutFactory;
 import com.reactnativenavigation.parse.LayoutNode;
 import com.reactnativenavigation.parse.LayoutNodeParser;
 import com.reactnativenavigation.parse.Options;
-import com.reactnativenavigation.parse.OverlayOptions;
 import com.reactnativenavigation.utils.TypefaceLoader;
 import com.reactnativenavigation.utils.UiThread;
 import com.reactnativenavigation.viewcontrollers.Navigator;
@@ -100,14 +99,17 @@ public class NavigationModule extends ReactContextBaseJavaModule {
 	}
 
 	@ReactMethod
-	public void showOverlay(final String type, final ReadableMap data, final Promise promise) {
-        final OverlayOptions overlayOptions = OverlayOptions.parse(JSONParser.parse(data));
-        handle(() -> navigator().showOverlay(type, overlayOptions, promise));
+	public void showOverlay(final ReadableMap rawLayoutTree) {
+        final LayoutNode layoutTree = LayoutNodeParser.parse(JSONParser.parse(rawLayoutTree));
+        handle(() -> {
+            final ViewController viewController = newLayoutFactory().create(layoutTree);
+            navigator().showOverlay(viewController);
+        });
 	}
 
 	@ReactMethod
-	public void dismissOverlay() {
-		handle(() -> navigator().dismissOverlay());
+	public void dismissOverlay(final String componentId) {
+		handle(() -> navigator().dismissOverlay(componentId));
 	}
 
 	private NavigationActivity activity() {

lib/android/app/src/main/java/com/reactnativenavigation/react/ReactView.java

@@ -3,11 +3,13 @@ package com.reactnativenavigation.react;
 import android.annotation.SuppressLint;
 import android.content.Context;
 import android.os.Bundle;
+import android.view.MotionEvent;
 import android.view.View;
 
 import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactRootView;
 import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.uimanager.JSTouchDispatcher;
 import com.facebook.react.uimanager.UIManagerModule;
 import com.facebook.react.uimanager.events.EventDispatcher;
 import com.reactnativenavigation.interfaces.ScrollEventListener;
@@ -20,12 +22,14 @@ public class ReactView extends ReactRootView implements ComponentViewController.
 	private final String componentId;
 	private final String componentName;
 	private boolean isAttachedToReactInstance = false;
+    private final JSTouchDispatcher jsTouchDispatcher;
 
-	public ReactView(final Context context, ReactInstanceManager reactInstanceManager, String componentId, String componentName) {
+    public ReactView(final Context context, ReactInstanceManager reactInstanceManager, String componentId, String componentName) {
 		super(context);
 		this.reactInstanceManager = reactInstanceManager;
 		this.componentId = componentId;
 		this.componentName = componentName;
+		jsTouchDispatcher = new JSTouchDispatcher(this);
 		start();
 	}
 
@@ -74,6 +78,11 @@ public class ReactView extends ReactRootView implements ComponentViewController.
         return new ScrollEventListener(getEventDispatcher());
     }
 
+    @Override
+    public void dispatchTouchEventToJs(MotionEvent event) {
+        jsTouchDispatcher.handleTouchEvent(event, getEventDispatcher());
+    }
+
     public EventDispatcher getEventDispatcher() {
         ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
         return reactContext == null ? null : reactContext.getNativeModule(UIManagerModule.class).getEventDispatcher();

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/ComponentViewController.java

@@ -31,6 +31,8 @@ public class ComponentViewController extends ViewController implements Navigatio
         void sendOnNavigationButtonPressed(String buttonId);
 
         ScrollEventListener getScrollEventListener();
+
+        void dispatchTouchEventToJs(MotionEvent event);
     }
 
     private final String componentName;
@@ -60,6 +62,7 @@ public class ComponentViewController extends ViewController implements Navigatio
     public void onViewAppeared() {
         super.onViewAppeared();
         ensureViewIsCreated();
+        component.applyOptions(options);
         applyOnParentController(parentController -> {
             parentController.clearOptions();
             parentController.applyOptions(options, component);

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/Navigator.java

@@ -8,9 +8,8 @@ import android.widget.FrameLayout;
 
 import com.facebook.react.bridge.Promise;
 import com.reactnativenavigation.parse.Options;
-import com.reactnativenavigation.parse.OverlayOptions;
 import com.reactnativenavigation.presentation.NavigationOptionsListener;
-import com.reactnativenavigation.presentation.OverlayPresenter;
+import com.reactnativenavigation.presentation.OverlayManager;
 import com.reactnativenavigation.utils.CompatUtils;
 import com.reactnativenavigation.utils.NoOpPromise;
 
@@ -22,7 +21,7 @@ public class Navigator extends ParentController {
     private static final NoOpPromise NO_OP = new NoOpPromise();
     private final ModalStack modalStack = new ModalStack();
 	private ViewController root;
-	private OverlayPresenter overlayPresenter;
+    private OverlayManager overlayManager = new OverlayManager();
     private Options defaultOptions = new Options();
 
     public Navigator(final Activity activity) {
@@ -131,14 +130,12 @@ public class Navigator extends ParentController {
 		modalStack.dismissAll(promise);
 	}
 
-	public void showOverlay(String type, OverlayOptions options, Promise promise) {
-		overlayPresenter = new OverlayPresenter(root, type, options);
-		overlayPresenter.show();
-		promise.resolve(true);
+	public void showOverlay(ViewController overlay) {
+        overlayManager.show((ViewGroup) root.getView(), overlay);
 	}
 
-	public void dismissOverlay() {
-		overlayPresenter.dismiss();
+	public void dismissOverlay(final String componentId) {
+		overlayManager.dismiss((ViewGroup) root.getView(), componentId);
 	}
 
 	static void rejectPromise(Promise promise) {

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/overlay/AlertOverlay.java

@@ -1,55 +0,0 @@
-package com.reactnativenavigation.viewcontrollers.overlay;
-
-
-import android.content.Context;
-import android.content.DialogInterface;
-import android.support.v7.app.AlertDialog;
-
-import com.reactnativenavigation.parse.OverlayOptions;
-import com.reactnativenavigation.viewcontrollers.ViewController;
-
-public class AlertOverlay implements OverlayInterface {
-
-	private AlertDialog dialog;
-
-	@Override
-	public AlertOverlay create(ViewController viewController, final OverlayOptions options) {
-		AlertDialog.Builder builder = new AlertDialog.Builder(viewController.getActivity());
-
-		builder.setTitle(options.getTitle());
-		builder.setMessage(options.getText());
-		if (options.getPositiveButton().isVisible()) {
-			builder.setPositiveButton(options.getPositiveButton().getText(), new DialogInterface.OnClickListener() {
-				@Override
-				public void onClick(DialogInterface dialog, int which) {
-					//TODO: perform action options.getPositiveButton().getAction();
-					dialog.dismiss();
-				}
-			});
-		}
-		if (options.getNegativeButton().isVisible()) {
-			builder.setNegativeButton(options.getNegativeButton().getText(), new DialogInterface.OnClickListener() {
-				@Override
-				public void onClick(DialogInterface dialog, int which) {
-					//TODO: perform action options.getNegativeButton().getAction();
-					dialog.dismiss();
-				}
-			});
-		}
-		dialog = builder.create();
-
-		return this;
-	}
-
-	@Override
-	public void show() {
-		dialog.show();
-	}
-
-	@Override
-	public void dismiss() {
-		if (dialog != null) {
-			dialog.dismiss();
-		}
-	}
-}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/overlay/OverlayFactory.java

@@ -1,35 +0,0 @@
-package com.reactnativenavigation.viewcontrollers.overlay;
-
-
-import com.reactnativenavigation.parse.OverlayOptions;
-import com.reactnativenavigation.viewcontrollers.ViewController;
-
-public class OverlayFactory {
-
-	public enum Overlay {
-		AlertDialog("alert", new AlertOverlay()),
-		Snackbar("snackbar", new SnackbarOverlay());
-
-		private String name;
-		private OverlayInterface overlayInstance;
-
-		Overlay(String name, OverlayInterface overlayInstance) {
-			this.name = name;
-			this.overlayInstance = overlayInstance;
-		}
-
-		public static Overlay create(String type) {
-			for (Overlay overlay : values()) {
-				if (overlay.name.equals(type)) {
-					return overlay;
-				}
-			}
-			return AlertDialog;
-		}
-	}
-
-	public static OverlayInterface create(String type, ViewController viewController, OverlayOptions options) {
-		return Overlay.create(type).overlayInstance.create(viewController, options);
-	}
-
-}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/overlay/SnackbarOverlay.java

@@ -1,88 +0,0 @@
-package com.reactnativenavigation.viewcontrollers.overlay;
-
-
-import android.app.Activity;
-import android.content.Context;
-import android.support.design.widget.Snackbar;
-import android.text.SpannableStringBuilder;
-import android.text.Spanned;
-import android.text.style.ForegroundColorSpan;
-import android.view.View;
-
-import com.reactnativenavigation.parse.OverlayOptions;
-import com.reactnativenavigation.viewcontrollers.ViewController;
-
-import static com.reactnativenavigation.parse.OverlayOptions.NO_COLOR;
-
-public class SnackbarOverlay implements OverlayInterface {
-
-	private Snackbar snackbar;
-	private OverlayOptions options;
-
-	@Override
-	public SnackbarOverlay create(ViewController viewController, OverlayOptions options) {
-		this.options = options;
-
-		init(viewController);
-		setAction();
-		setStyle();
-
-		return this;
-	}
-
-	private void init(ViewController viewController) {
-		snackbar = Snackbar.make(viewController.getView(),
-				options.getTextColor() == NO_COLOR ? options.getText() : getStyledText(),
-				getDuration(options.getDuration()));
-	}
-
-	private Spanned getStyledText() {
-		SpannableStringBuilder spannableStringBuilder = new SpannableStringBuilder(options.getText());
-		spannableStringBuilder.setSpan(new ForegroundColorSpan(options.getTextColor()), 0,
-				spannableStringBuilder.length(), Spanned.SPAN_INCLUSIVE_INCLUSIVE);
-		return spannableStringBuilder;
-	}
-
-	@Override
-	public void show() {
-		snackbar.show();
-	}
-
-	@Override
-	public void dismiss() {
-		snackbar.dismiss();
-	}
-
-	private int getDuration(String duration) {
-		switch (duration) {
-			case "short":
-				return Snackbar.LENGTH_SHORT;
-			case "long":
-				return Snackbar.LENGTH_LONG;
-			case "indefinite":
-				return Snackbar.LENGTH_INDEFINITE;
-			default:
-				return Snackbar.LENGTH_SHORT;
-		}
-	}
-
-	private void setAction() {
-		if (options.getButton() != null) {
-			snackbar.setAction(options.getButton().getText(), new View.OnClickListener() {
-				@Override
-				public void onClick(View v) {
-					//TODO: perform action
-				}
-			});
-		}
-	}
-
-	private void setStyle() {
-		if (options.getButton() != null && options.getButton().getTextColor() != NO_COLOR) {
-			snackbar.setActionTextColor(options.getButton().getTextColor());
-		}
-		if (options.getBackgroundColor() != NO_COLOR) {
-			snackbar.getView().setBackgroundColor(options.getBackgroundColor());
-		}
-	}
-}

lib/android/app/src/main/java/com/reactnativenavigation/views/ComponentLayout.java

@@ -2,6 +2,7 @@ package com.reactnativenavigation.views;
 
 import android.annotation.SuppressLint;
 import android.content.Context;
+import android.view.MotionEvent;
 import android.view.View;
 import android.widget.FrameLayout;
 import android.widget.RelativeLayout;
@@ -9,6 +10,7 @@ import android.widget.RelativeLayout;
 import com.reactnativenavigation.interfaces.ScrollEventListener;
 import com.reactnativenavigation.parse.Options;
 import com.reactnativenavigation.viewcontrollers.ComponentViewController.IReactView;
+import com.reactnativenavigation.views.touch.OverlayTouchDelegate;
 
 import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
 import static android.widget.RelativeLayout.BELOW;
@@ -17,11 +19,13 @@ import static android.widget.RelativeLayout.BELOW;
 public class ComponentLayout extends FrameLayout implements ReactComponent, TitleBarButton.OnClickListener {
 
     private IReactView reactView;
+    private final OverlayTouchDelegate touchDelegate;
 
-	public ComponentLayout(Context context, IReactView reactView) {
+    public ComponentLayout(Context context, IReactView reactView) {
 		super(context);
 		this.reactView = reactView;
         addView(reactView.asView(), MATCH_PARENT, MATCH_PARENT);
+        touchDelegate = new OverlayTouchDelegate(reactView);
     }
 
     @Override
@@ -51,7 +55,7 @@ public class ComponentLayout extends FrameLayout implements ReactComponent, Titl
 
     @Override
     public void applyOptions(Options options) {
-
+        touchDelegate.setInterceptTouchOutside(options.overlayOptions.interceptTouchOutside == Options.BooleanOptions.True);
     }
 
     @Override
@@ -64,6 +68,11 @@ public class ComponentLayout extends FrameLayout implements ReactComponent, Titl
         return reactView.getScrollEventListener();
     }
 
+    @Override
+    public void dispatchTouchEventToJs(MotionEvent event) {
+        reactView.dispatchTouchEventToJs(event);
+    }
+
     @Override
     public void drawBehindTopBar() {
         RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) reactView.asView().getLayoutParams();
@@ -82,4 +91,9 @@ public class ComponentLayout extends FrameLayout implements ReactComponent, Titl
     public void onPress(String buttonId) {
         reactView.sendOnNavigationButtonPressed(buttonId);
     }
+
+    @Override
+    public boolean onInterceptTouchEvent(MotionEvent ev) {
+        return touchDelegate.onInterceptTouchEvent(ev) || super.onInterceptTouchEvent(ev);
+    }
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/TopTab.java

@@ -2,6 +2,7 @@ package com.reactnativenavigation.views;
 
 import android.annotation.SuppressLint;
 import android.content.Context;
+import android.view.MotionEvent;
 import android.view.View;
 import android.widget.FrameLayout;
 
@@ -53,4 +54,9 @@ public class TopTab extends FrameLayout implements IReactView {
     public ScrollEventListener getScrollEventListener() {
         return reactView.getScrollEventListener();
     }
+
+    @Override
+    public void dispatchTouchEventToJs(MotionEvent event) {
+        reactView.dispatchTouchEventToJs(event);
+    }
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/touch/OverlayTouchDelegate.java

@@ -0,0 +1,41 @@
+package com.reactnativenavigation.views.touch;
+
+import android.graphics.Rect;
+import android.support.annotation.VisibleForTesting;
+import android.view.MotionEvent;
+import android.view.ViewGroup;
+
+import com.reactnativenavigation.viewcontrollers.ComponentViewController.IReactView;
+
+public class OverlayTouchDelegate {
+    private final Rect hitRect = new Rect();
+    private IReactView reactView;
+    private boolean interceptTouchOutside;
+
+    public OverlayTouchDelegate(IReactView reactView) {
+        this.reactView = reactView;
+    }
+
+    public boolean onInterceptTouchEvent(MotionEvent event) {
+        return interceptTouchOutside && isDown(event) && handleDown(event);
+    }
+
+    private boolean isDown(MotionEvent event) {
+        return event.getActionMasked() == MotionEvent.ACTION_DOWN;
+    }
+
+    @VisibleForTesting
+    public boolean handleDown(MotionEvent event) {
+        ((ViewGroup) reactView.asView()).getChildAt(0).getHitRect(hitRect);
+        reactView.dispatchTouchEventToJs(event);
+        return isTouchOutside(event);
+    }
+
+    private boolean isTouchOutside(MotionEvent ev) {
+        return !hitRect.contains((int) ev.getRawX(), (int) ev.getRawY());
+    }
+
+    public void setInterceptTouchOutside(boolean interceptTouchOutside) {
+        this.interceptTouchOutside = interceptTouchOutside;
+    }
+}

lib/android/app/src/test/java/com/reactnativenavigation/mocks/SimpleOverlay.java

@@ -0,0 +1,59 @@
+package com.reactnativenavigation.mocks;
+
+import android.content.Context;
+import android.view.MotionEvent;
+import android.view.View;
+import android.widget.FrameLayout;
+import android.widget.RelativeLayout;
+
+import com.reactnativenavigation.interfaces.ScrollEventListener;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
+
+public class SimpleOverlay extends RelativeLayout implements ComponentViewController.IReactView {
+    public SimpleOverlay(Context context) {
+        super(context);
+    }
+
+    @Override
+    public boolean isReady() {
+        return true;
+    }
+
+    @Override
+    public View asView() {
+        FrameLayout root = new FrameLayout(getContext());
+        FrameLayout overlay = new FrameLayout(getContext());
+        root.addView(overlay);
+        return root;
+    }
+
+    @Override
+    public void destroy() {
+
+    }
+
+    @Override
+    public void sendComponentStart() {
+
+    }
+
+    @Override
+    public void sendComponentStop() {
+
+    }
+
+    @Override
+    public void sendOnNavigationButtonPressed(String buttonId) {
+
+    }
+
+    @Override
+    public ScrollEventListener getScrollEventListener() {
+        return null;
+    }
+
+    @Override
+    public void dispatchTouchEventToJs(MotionEvent event) {
+
+    }
+}

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestComponentLayout.java

@@ -1,6 +1,7 @@
 package com.reactnativenavigation.mocks;
 
 import android.content.Context;
+import android.view.MotionEvent;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.RelativeLayout;
@@ -72,6 +73,11 @@ public class TestComponentLayout extends RelativeLayout implements ReactComponen
         return null;
     }
 
+    @Override
+    public void dispatchTouchEventToJs(MotionEvent event) {
+
+    }
+
     @Override
     public void onPress(String buttonId) {
 

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TopTabLayoutMock.java

@@ -46,4 +46,9 @@ public class TopTabLayoutMock extends View implements ComponentViewController.IR
     public ScrollEventListener getScrollEventListener() {
         return null;
     }
+
+    @Override
+    public void dispatchTouchEventToJs(MotionEvent event) {
+
+    }
 }

lib/android/app/src/test/java/com/reactnativenavigation/parse/OverlayOptionsTest.java

@@ -1,47 +0,0 @@
-package com.reactnativenavigation.parse;
-
-import android.graphics.Color;
-
-import com.reactnativenavigation.*;
-
-import org.json.*;
-import org.junit.*;
-
-import static org.assertj.core.api.Java6Assertions.*;
-
-public class OverlayOptionsTest extends BaseTest {
-
-    @Test
-    public void parsesNullAsDefaultEmptyOptions() throws Exception {
-        assertThat(OverlayOptions.parse(null)).isNotNull();
-    }
-
-    @Test
-    public void parsesJson() throws Exception {
-        JSONObject json = new JSONObject();
-        json.put("title", "the title");
-        json.put("text", "the text");
-        JSONObject nestedButton = new JSONObject();
-        nestedButton.put("text", "OK");
-        nestedButton.put("action", "action");
-        json.put("positiveButton", nestedButton);
-        json.put("textColor", Color.RED);
-        json.put("duration", "short");
-        json.put("backgroundColor", Color.RED);
-
-        OverlayOptions result = OverlayOptions.parse(json);
-        assertThat(result.getTitle()).isEqualTo("the title");
-        assertThat(result.getText()).isEqualTo("the text");
-        assertThat(result.getPositiveButton().getText()).isEqualTo("OK");
-        assertThat(result.getPositiveButton().getAction()).isEqualTo("action");
-        assertThat(result.getTextColor()).isEqualTo(Color.RED);
-        assertThat(result.getDuration()).isEqualTo("short");
-        assertThat(result.getBackgroundColor()).isEqualTo(Color.RED);
-    }
-
-    @Test
-    public void defaultEmptyOptions() throws Exception {
-        OverlayOptions uut = new OverlayOptions();
-        assertThat(uut.getTitle()).isEmpty();
-    }
-}

lib/android/app/src/test/java/com/reactnativenavigation/views/TouchDelegateTest.java

@@ -0,0 +1,47 @@
+package com.reactnativenavigation.views;
+
+import android.view.MotionEvent;
+
+import com.reactnativenavigation.BaseTest;
+import com.reactnativenavigation.mocks.SimpleOverlay;
+import com.reactnativenavigation.views.touch.OverlayTouchDelegate;
+
+import org.junit.Test;
+
+import static org.mockito.Mockito.spy;
+import static org.mockito.Mockito.times;
+import static org.mockito.Mockito.verify;
+
+public class TouchDelegateTest extends BaseTest {
+    private OverlayTouchDelegate uut;
+    private final int x = 10;
+    private final int y = 10;
+    private final MotionEvent downEvent = MotionEvent.obtain(0, 0, MotionEvent.ACTION_DOWN, x, y, 0);
+    private final MotionEvent upEvent = MotionEvent.obtain(0, 0, MotionEvent.ACTION_UP, x, y, 0);
+
+    @Override
+    public void beforeEach() {
+        super.beforeEach();
+        uut = spy(new OverlayTouchDelegate(new SimpleOverlay(newActivity())));
+    }
+
+    @Test
+    public void downEventIsHandled() throws Exception {
+        uut.setInterceptTouchOutside(true);
+        uut.onInterceptTouchEvent(downEvent);
+        verify(uut, times(1)).handleDown(downEvent);
+    }
+
+    @Test
+    public void onlyDownEventIsHandled() throws Exception {
+        uut.setInterceptTouchOutside(true);
+        uut.onInterceptTouchEvent(upEvent);
+        verify(uut, times(0)).handleDown(upEvent);
+    }
+
+    @Test
+    public void downIsHandledOnlyIfInterceptTouchOutsideIsTrue() throws Exception {
+        uut.onInterceptTouchEvent(downEvent);
+        verify(uut, times(0)).handleDown(downEvent);
+    }
+}

lib/ios/RNNOverlayOptions.h

@@ -2,6 +2,6 @@
 
 @interface RNNOverlayOptions : RNNOptions
 
-@property (nonatomic, strong) NSNumber* interceptTouches;
+@property (nonatomic, strong) NSNumber* interceptTouchOutside;
 
 @end

lib/ios/RNNOverlayOptions.m

@@ -4,9 +4,9 @@
 @implementation RNNOverlayOptions
 
 - (void)applyOn:(UIViewController *)viewController {
-	if (self.interceptTouches) {
+	if (self.interceptTouchOutside) {
 		RCTRootView* rootView = (RCTRootView*)viewController.view;
-		rootView.passThroughTouches = ![self.interceptTouches boolValue];
+		rootView.passThroughTouches = ![self.interceptTouchOutside boolValue];
 	}
 }
 

playground/src/screens/CustomDialog.js

@@ -1,7 +1,7 @@
 const React = require('react');
 const { PureComponent } = require('react');
 
-const { View, Text, Button } = require('react-native');
+const { Text, Button, View, Alert, Platform } = require('react-native');
 const Navigation = require('react-native-navigation');
 
 const testIDs = require('../testIDs');
@@ -17,6 +17,11 @@ class CustomDialog extends PureComponent {
     );
   }
 
+  didDisappear() {
+    if (Platform.OS === 'android') {
+      Alert.alert('Overlay disappeared');
+    }
+  }
   onCLickOk() {
     Navigation.dismissOverlay(this.props.componentId);
   }

playground/src/screens/OptionsScreen.js

@@ -194,13 +194,13 @@ class OptionsScreen extends Component {
     });
   }
 
-  onClickShowOverlay(interceptTouches) {
+  onClickShowOverlay(interceptTouchOutside) {
     Navigation.showOverlay({
       component: {
         name: 'navigation.playground.CustomDialog',
         options: {
           overlay: {
-            interceptTouches
+            interceptTouchOutside
           }
         }
       }