How to scale a shape by selecting its stroke in wpf - wpf

Question

I am new to WPF I want to scale ellipse by selecting its stroke. I have set IsManipulationEnabled=true but an event not triggering. Below is my code
<Path Stretch="Fill" Stroke="Black" ManipulationDelta="Path_ManipulationDelta"
IsManipulationEnabled="True" StrokeThickness="4">
<Path.Data>
<EllipseGeometry Center="0,0" RadiusX="200" RadiusY="200"/>
</Path.Data>
</Path>
Please Help.enter image description here

Answer 1

Here is some code that may give you some ideas:
In this sample, I'm using some basic mouse events MouseDown, MouseMove, and MouseUp so that I can detect when a user clicks on the Path, and when they start to drag the mouse.
XAML
<Window x:Class="WpfApp4.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApp4"
Title="MainWindow"
Width="800"
Height="450"
UseLayoutRounding="True">
<Grid>
<Canvas x:Name="Canvas">
<Path x:Name="CirclePath"
MouseDown="OnMouseDown"
MouseMove="OnMouseMove"
MouseUp="OnMouseUp"
Stretch="Fill"
Stroke="Black"
StrokeThickness="4">
<Path.Data>
<EllipseGeometry x:Name="EllipseGeometry"
Center="0,0"
RadiusX="100"
RadiusY="100" />
</Path.Data>
</Path>
</Canvas>
</Grid>
</Window>
In the OnMouseDown handler, I check to see if the left mouse button is down and then I capture the mouse and get the position of the mouse relative to the Canvas.
Next, in the OnMouseMove handler, if the left button is still down - the user is dragging - I get the new mouse position and calculate the offset based on the old mouse position. Then I update the EllipseGeometry to reflect the mouse offset.
Finally, in the OnMouseUp handler, I release the mouse capture.
Code-Behind
using System.Windows;
using System.Windows.Input;
namespace WpfApp4
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
private Point oldMousePosition;
public MainWindow()
{
InitializeComponent();
}
private void OnMouseDown(object sender, MouseButtonEventArgs e)
{
if(e.ChangedButton != MouseButton.Left) return;
Mouse.Capture(CirclePath);
oldMousePosition = e.GetPosition(Canvas);
}
private void OnMouseMove(object sender, MouseEventArgs e)
{
if (e.LeftButton != MouseButtonState.Pressed) return;
var newMousePosition = e.GetPosition(Canvas);
var offset = newMousePosition - oldMousePosition;
EllipseGeometry.RadiusX += offset.X / 2;
EllipseGeometry.RadiusY += offset.Y / 2;
oldMousePosition = newMousePosition;
}
private void OnMouseUp(object sender, MouseButtonEventArgs e)
{
Mouse.Capture(null);
}
}
}
I hope this helps.

Answer 2

XAML
XAML
<Window x:Class="WidgetWpf.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WidgetWpf"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Viewbox>
<Grid Name="MainGrid">
<Ellipse x:Name="DottedCircle" Width="200" Height="200" Stroke="White" StrokeThickness="2" Opacity="0.90" StrokeDashArray="4 4"
MouseDown="DottedCircle_MouseDown"
MouseMove="DottedCircle_MouseMove"
MouseUp="DottedCircle_MouseUp"
MouseEnter="DottedCircle_MouseEnter"
MouseLeave="DottedCircle_MouseLeave"
/>
</Grid>
</Viewbox>
</Window>
//Here is my code behind
public partial class MainWindow : Window
{
#region Variables
MatrixTransform transform;
Point OldMousePosition;
Point NewMousePosition;
double[] Dimensions = new double[2];
Rect rect = new Rect();
bool IsResizeMode;
bool IsDragAndDropMode;
#endregion
public MainWindow()
{
InitializeComponent();
}
private void DottedCircle_MouseDown(object sender, MouseButtonEventArgs e)
{
if (e.ChangedButton != MouseButton.Left) return;
Mouse.Capture(DottedCircle);
OldMousePosition = e.GetPosition(MainGrid);
}
private void DottedCircle_MouseMove(object sender, MouseEventArgs e)
{
DottedCircle.ToolTip = e.GetPosition(MainGrid);
if (e.LeftButton != MouseButtonState.Pressed) return;
var NewMousePosition = e.GetPosition(MainGrid);
var offset = NewMousePosition-OldMousePosition;
#region working by co-ordinate
//get center of grid
double dicisionPoint=0.0 ;
double CP_X = MainGrid.ActualWidth / 2;
double CP_Y = MainGrid.ActualHeight / 2;
//1 st co-ordinate
if(NewMousePosition.X>CP_X && NewMousePosition.Y<CP_Y)
{
dicisionPoint = offset.X;
}
//2nd cordinate
else if (NewMousePosition.X < CP_X && NewMousePosition.Y < CP_Y)
{
dicisionPoint = -offset.X;
}
else if (NewMousePosition.X < CP_X && NewMousePosition.Y > CP_Y)
{
dicisionPoint = offset.Y;
}
else if (NewMousePosition.X > CP_X && NewMousePosition.Y > CP_Y)
{
dicisionPoint = offset.Y;
}
if (DottedCircle.Width+ dicisionPoint < InnerCircle.Width)
{
DottedCircle.Fill = new SolidColorBrush(Colors.Transparent);
DottedCircle.Width += dicisionPoint;
DottedCircle.Height += dicisionPoint;
}
else if (DottedCircle.Width+ dicisionPoint>= InnerCircle.Width) { DottedCircle.Fill = new SolidColorBrush(Colors.Red); }
#endregion
OldMousePosition = NewMousePosition;
DottedCircle.ToolTip = offset.X+ "__" + offset.Y;
}
private void DottedCircle_MouseUp(object sender, MouseButtonEventArgs e)
{
Mouse.Capture(null);
DottedCircle.Style = null;
}
private void DottedCircle_MouseEnter(object sender, MouseEventArgs e)
{
DottedCircle.Stroke = new SolidColorBrush( Colors.Blue);
DottedCircle.Style = (Style)Application.Current.Resources["DiffPathStyle"];
}
private void DottedCircle_MouseLeave(object sender, MouseEventArgs e)
{
DottedCircle.Stroke = new SolidColorBrush(Colors.White);
DottedCircle.Style = null;
}
}