Skip to content

Add closing process when tapping the outer area of ​​Popup#2081

Merged
bijington merged 9 commits into
CommunityToolkit:mainfrom
cat0363:Issue-2073
Aug 28, 2024
Merged

Add closing process when tapping the outer area of ​​Popup#2081
bijington merged 9 commits into
CommunityToolkit:mainfrom
cat0363:Issue-2073

Conversation

@cat0363
Copy link
Copy Markdown
Contributor

@cat0363 cat0363 commented Aug 1, 2024

This PR resolves the issue where the Popup cannot be closed when the CanBeDismissedByTappingOutsideOfPopup property is true and you tap an area within 10px around the Popup.

Description of Change

Dialog, which is the base of Popup, has areas around it that do not respond to taps on Android.
Handle the touch event and intentionally call the Popup's close process when the outside of the Popup is tapped.
Below are the changes.

[src\CommunityToolkit.Maui.Core\Views\Popup\MauiPopup.android.cs]

	public override bool OnTouchEvent(MotionEvent e)
	{
		if (VirtualView is not null)
		{
			if (VirtualView.CanBeDismissedByTappingOutsideOfPopup &&
				e.Action == MotionEventActions.Up)
			{
				if (Window?.DecorView is AView decorView)
				{
					float x = e.GetX();
					float y = e.GetY();

					if (!(x >= 0 && x <= decorView.Width && y >= 0 && y <= decorView.Height))
					{
						if (IsShowing)
						{
							OnDismissedByTappingOutsideOfPopup(this);
						}
					}
				}
			}
		}

		if (this.IsDisposed())
		{
			return false;
		}
		else
		{
			return base.OnTouchEvent(e);
		}
	}

The above code calls the OnDismissedByTappingOutsideOfPopup method when the tapped coordinates are outside the Popup.
The return value of OnTouchEvent is separated by an If statement, because if you call OnDismissedByTappingOutsideOfPopup, MauiPopup will be disposed of, and an ObjectDisposedException will occur when base.OnTouchEvent(e) is called.

I didn't know how to write it smartly.
If there is a smarter way to write it, could you please refactor it.

Linked Issues

PR Checklist

Additional information

Below are the verification results.
To make it easier to see where the taps are, I turned on "Show taps" in the Android developer options.

[CanBeDismissedByTappingOutsideOfPopup : true]

Android.Emulator.-.pixel_5_-_api_33_5554.2024-08-01.14-02-27.mp4

[CanBeDismissedByTappingOutsideOfPopup : false]

Android.Emulator.-.pixel_5_-_api_33_5554.2024-08-01.13-58-59.mp4

If the CanBeDismissedByTappingOutsideOfPopup property is true, you can see that tapping within 10px around the Popup will close the Popup.

Copy link
Copy Markdown
Contributor

@bijington bijington left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me! Thanks @cat0363

@bijington bijington enabled auto-merge (squash) August 28, 2024 19:56
@bijington bijington merged commit 765d3df into CommunityToolkit:main Aug 28, 2024
@github-actions github-actions Bot locked and limited conversation to collaborators Nov 18, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] Popup CanBeDismissedByTappingOutsideOfPopup has inactive margin on Android

2 participants