-
Notifications
You must be signed in to change notification settings - Fork 1.7k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
14 changed files
with
480 additions
and
179 deletions.
There are no files selected for viewing
124 changes: 124 additions & 0 deletions
124
src/Controls/samples/Controls.Sample/Pages/Gestures/ClickGestureGalleryPage.cs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,124 @@ | ||
using System; | ||
using Maui.Controls.Sample.Pages.Base; | ||
using Microsoft.Maui.Controls; | ||
using Microsoft.Maui.Graphics; | ||
|
||
namespace Maui.Controls.Sample.Pages.Gestures | ||
{ | ||
public class ClickGestureGalleryPage : BasePage | ||
{ | ||
Command clickCommand; | ||
BoxView changeColorBoxView; | ||
|
||
public ClickGestureGalleryPage() | ||
{ | ||
clickCommand = new Command<Color>(HandleClickCommand); | ||
var vertical = new StackLayout | ||
{ | ||
VerticalOptions = LayoutOptions.Center, | ||
HorizontalOptions = LayoutOptions.Center, | ||
Spacing = 40 | ||
}; | ||
|
||
var horizontal = new StackLayout | ||
{ | ||
Orientation = StackOrientation.Horizontal, | ||
Spacing = 20, | ||
HorizontalOptions = LayoutOptions.Center, | ||
VerticalOptions = LayoutOptions.Center | ||
}; | ||
vertical.Children.Add(horizontal); | ||
|
||
var singleClickLabel = new Label | ||
{ | ||
Text = "Click me!", | ||
BackgroundColor = Colors.PaleGreen | ||
}; | ||
var singleClickGesture = new ClickGestureRecognizer | ||
{ | ||
Command = clickCommand, | ||
CommandParameter = Colors.PaleGreen, | ||
NumberOfClicksRequired = 1, | ||
Buttons = ButtonsMask.Primary | ||
}; | ||
singleClickLabel.GestureRecognizers.Add(singleClickGesture); | ||
horizontal.Children.Add(singleClickLabel); | ||
|
||
var doubleClickLabel = new Label | ||
{ | ||
Text = "Double click me!!", | ||
BackgroundColor = Colors.Aqua | ||
}; | ||
var doubleClickGesture = new ClickGestureRecognizer | ||
{ | ||
Command = clickCommand, | ||
CommandParameter = Colors.Aqua, | ||
NumberOfClicksRequired = 2, | ||
Buttons = ButtonsMask.Primary | ||
}; | ||
doubleClickLabel.GestureRecognizers.Add(doubleClickGesture); | ||
horizontal.Children.Add(doubleClickLabel); | ||
|
||
var tripleClicklabel = new Label | ||
{ | ||
Text = "Triple click me!!!", | ||
BackgroundColor = Colors.Olive | ||
}; | ||
var tripleClickGesture = new ClickGestureRecognizer | ||
{ | ||
Command = clickCommand, | ||
CommandParameter = Colors.Olive, | ||
NumberOfClicksRequired = 3, | ||
Buttons = ButtonsMask.Primary | ||
}; | ||
tripleClicklabel.GestureRecognizers.Add(tripleClickGesture); | ||
horizontal.Children.Add(tripleClicklabel); | ||
|
||
var rightClickLabel = new Label | ||
{ | ||
Text = "Right click me¡", | ||
BackgroundColor = Colors.Coral | ||
}; | ||
var rigthClickGesture = new ClickGestureRecognizer | ||
{ | ||
Command = clickCommand, | ||
CommandParameter = Colors.Coral, | ||
NumberOfClicksRequired = 1, | ||
Buttons = ButtonsMask.Secondary | ||
}; | ||
rightClickLabel.GestureRecognizers.Add(rigthClickGesture); | ||
horizontal.Children.Add(rightClickLabel); | ||
|
||
var doubleRightClickLabel = new Label | ||
{ | ||
Text = "Double right click me¡¡", | ||
BackgroundColor = Colors.Gold | ||
}; | ||
var doubleRigthClickGesture = new ClickGestureRecognizer | ||
{ | ||
Command = clickCommand, | ||
CommandParameter = Colors.Gold, | ||
NumberOfClicksRequired = 2, | ||
Buttons = ButtonsMask.Secondary | ||
}; | ||
doubleRightClickLabel.GestureRecognizers.Add(doubleRigthClickGesture); | ||
horizontal.Children.Add(doubleRightClickLabel); | ||
|
||
|
||
changeColorBoxView = new BoxView | ||
{ | ||
VerticalOptions = LayoutOptions.CenterAndExpand, | ||
HorizontalOptions = LayoutOptions.CenterAndExpand, | ||
WidthRequest = 200, | ||
HeightRequest = 50 | ||
}; | ||
vertical.Children.Add(changeColorBoxView); | ||
Content = vertical; | ||
} | ||
|
||
void HandleClickCommand(Color backgroundColor) | ||
{ | ||
changeColorBoxView.BackgroundColor = backgroundColor; | ||
} | ||
} | ||
} |
144 changes: 144 additions & 0 deletions
144
src/Controls/samples/Controls.Sample/Pages/Gestures/PanGestureGalleryPage.cs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,144 @@ | ||
using System; | ||
using System.Collections.Generic; | ||
using System.Linq; | ||
using System.Text; | ||
using System.Threading.Tasks; | ||
using Maui.Controls.Sample.Pages.Base; | ||
using Microsoft.Maui; | ||
using Microsoft.Maui.Controls; | ||
using Microsoft.Maui.Controls.Internals; | ||
using Microsoft.Maui.Graphics; | ||
|
||
namespace Maui.Controls.Sample.Pages.Gestures | ||
{ | ||
public class PanGestureGalleryPage : BasePage | ||
{ | ||
public class PanCompleteArgs : EventArgs | ||
{ | ||
public PanCompleteArgs(string message) { Message = message; } | ||
public string Message | ||
{ | ||
get; private set; | ||
} | ||
} | ||
|
||
public class PanContainer : VerticalStackLayout | ||
{ | ||
double _x, _y; | ||
double _currentScale = 1; | ||
|
||
public EventHandler<PanCompleteArgs> PanCompleted; | ||
|
||
public PanContainer() | ||
{ | ||
GestureRecognizers.Add(GetPinch()); | ||
GestureRecognizers.Add(GetPan()); | ||
} | ||
|
||
public View Content | ||
{ | ||
get => (View)Children.Last(); | ||
set | ||
{ | ||
if (Children.Count > 0) | ||
Remove(Children[0]); | ||
} | ||
} | ||
|
||
PanGestureRecognizer GetPan() | ||
{ | ||
var pan = new PanGestureRecognizer(); | ||
pan.PanUpdated += (s, e) => | ||
{ | ||
switch (e.StatusType) | ||
{ | ||
case GestureStatus.Running: | ||
Content.TranslationX = e.TotalX; | ||
Content.TranslationY = e.TotalY; | ||
break; | ||
case GestureStatus.Completed: | ||
_x = Content.TranslationX; | ||
_y = Content.TranslationY; | ||
PanCompleted?.Invoke(s, new PanCompleteArgs($"x: {_x}, y: {_y}")); | ||
break; | ||
} | ||
}; | ||
return pan; | ||
} | ||
|
||
PinchGestureRecognizer GetPinch() | ||
{ | ||
var pinch = new PinchGestureRecognizer(); | ||
|
||
double xOffset = 0; | ||
double yOffset = 0; | ||
double startScale = 1; | ||
|
||
pinch.PinchUpdated += (sender, e) => | ||
{ | ||
if (e.Status == GestureStatus.Started) | ||
{ | ||
startScale = Content.Scale; | ||
Content.AnchorX = Content.AnchorY = 0; | ||
} | ||
if (e.Status == GestureStatus.Running) | ||
{ | ||
_currentScale += (e.Scale - 1) * startScale; | ||
_currentScale = Math.Max(1, _currentScale); | ||
var renderedX = Content.X + xOffset; | ||
var deltaX = renderedX / Width; | ||
var deltaWidth = Width / (Content.Width * startScale); | ||
var originX = (e.ScaleOrigin.X - deltaX) * deltaWidth; | ||
var renderedY = Content.Y + yOffset; | ||
var deltaY = renderedY / Height; | ||
var deltaHeight = Height / (Content.Height * startScale); | ||
var originY = (e.ScaleOrigin.Y - deltaY) * deltaHeight; | ||
double targetX = xOffset - (originX * Content.Width) * (_currentScale - startScale); | ||
double targetY = yOffset - (originY * Content.Height) * (_currentScale - startScale); | ||
Content.TranslationX = targetX.Clamp(-Content.Width * (_currentScale - 1), 0); | ||
Content.TranslationY = targetY.Clamp(-Content.Height * (_currentScale - 1), 0); | ||
Content.Scale = _currentScale; | ||
} | ||
if (e.Status == GestureStatus.Completed) | ||
{ | ||
xOffset = Content.TranslationX; | ||
yOffset = Content.TranslationY; | ||
} | ||
}; | ||
return pinch; | ||
} | ||
} | ||
|
||
public PanGestureGalleryPage() | ||
{ | ||
var box = new Image | ||
{ | ||
BackgroundColor = Colors.Gray, | ||
WidthRequest = 2000, | ||
HeightRequest = 2000, | ||
VerticalOptions = LayoutOptions.Center, | ||
HorizontalOptions = LayoutOptions.Center | ||
}; | ||
|
||
var label = new Label { Text = "Use two fingers to pinch. Use one finger to pan." }; | ||
|
||
var panme = new PanContainer { Content = box }; | ||
panme.PanCompleted += (s, e) => | ||
{ | ||
label.Text = e.Message; | ||
}; | ||
|
||
Content = new StackLayout { Children = { label, panme }, Padding = new Thickness(20) }; | ||
} | ||
} | ||
} |
111 changes: 111 additions & 0 deletions
111
src/Controls/samples/Controls.Sample/Pages/Gestures/PinchGestureTestPage.cs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,111 @@ | ||
using System; | ||
using System.Diagnostics; | ||
using System.Linq; | ||
using Maui.Controls.Sample.Pages.Base; | ||
using Microsoft.Maui; | ||
using Microsoft.Maui.Controls; | ||
using Microsoft.Maui.Controls.Internals; | ||
using Microsoft.Maui.Graphics; | ||
|
||
namespace Maui.Controls.Sample.Pages.Gestures | ||
{ | ||
public class PinchToZoomContainer : VerticalStackLayout | ||
{ | ||
public PinchToZoomContainer() | ||
{ | ||
|
||
} | ||
|
||
|
||
public View Content | ||
{ | ||
get => Children.OfType<View>().LastOrDefault(); | ||
set | ||
{ | ||
if (Children.Count > 0) | ||
Remove(Children[0]); | ||
} | ||
} | ||
|
||
public void AddPinch() | ||
{ | ||
|
||
var pinch = new PinchGestureRecognizer(); | ||
|
||
double xOffset = 0; | ||
double yOffset = 0; | ||
double startScale = 1; | ||
|
||
pinch.PinchUpdated += (sender, e) => | ||
{ | ||
if (e.Status == GestureStatus.Started) | ||
{ | ||
startScale = Content.Scale; | ||
Content.AnchorX = Content.AnchorY = 0; | ||
} | ||
if (e.Status == GestureStatus.Running) | ||
{ | ||
_currentScale += (e.Scale - 1) * startScale; | ||
_currentScale = Math.Max(1, _currentScale); | ||
var renderedX = Content.X + xOffset; | ||
var deltaX = renderedX / Width; | ||
var deltaWidth = Width / (Content.Width * startScale); | ||
var originX = (e.ScaleOrigin.X - deltaX) * deltaWidth; | ||
var renderedY = Content.Y + yOffset; | ||
var deltaY = renderedY / Height; | ||
var deltaHeight = Height / (Content.Height * startScale); | ||
var originY = (e.ScaleOrigin.Y - deltaY) * deltaHeight; | ||
double targetX = xOffset - (originX * Content.Width) * (_currentScale - startScale); | ||
double targetY = yOffset - (originY * Content.Height) * (_currentScale - startScale); | ||
Content.TranslationX = targetX.Clamp(-Content.Width * (_currentScale - 1), 0); | ||
Content.TranslationY = targetY.Clamp(-Content.Height * (_currentScale - 1), 0); | ||
Content.Scale = _currentScale; | ||
} | ||
if (e.Status == GestureStatus.Completed) | ||
{ | ||
xOffset = Content.TranslationX; | ||
yOffset = Content.TranslationY; | ||
} | ||
}; | ||
|
||
GestureRecognizers.Add(pinch); | ||
} | ||
|
||
public bool AlwaysZoomCenter { get; set; } | ||
|
||
double _currentScale = 1; | ||
} | ||
|
||
public class PinchGestureTestPage : BasePage | ||
{ | ||
public PinchGestureTestPage() | ||
{ | ||
var stack = new StackLayout { VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.Center }; | ||
var textBoxScale = new Label { VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.Center }; | ||
var textBox = new Label { VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.Center }; | ||
var textBoxPoint = new Label { VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.Center }; | ||
stack.Children.Add(textBox); | ||
stack.Children.Add(textBoxScale); | ||
stack.Children.Add(textBoxPoint); | ||
|
||
var box = new Image { Source = "crimson.jpg", BackgroundColor = Colors.Red, WidthRequest = 200, HeightRequest = 200, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }; | ||
|
||
var zoomContainer = new PinchToZoomContainer(); | ||
zoomContainer.Content = box; | ||
|
||
var btn = new Button { Text = "add pinch gesture", Command = new Command(() => zoomContainer.AddPinch()) }; | ||
var btnRemove = new Button { Text = "remove pinch gesture", Command = new Command(() => zoomContainer.GestureRecognizers.Clear()) }; | ||
|
||
Content = new StackLayout { Children = { btn, btnRemove, new Grid { Children = { zoomContainer }, Padding = new Thickness(20) } } }; | ||
} | ||
|
||
} | ||
} | ||
|
Oops, something went wrong.