|
|
|
| Title | Draw a rubberband circle centered at a starting point with XAML in Visual Basic 2008 |
|---|
| Description | This example shows how to draw a rubberband circle centered at a starting point with XAML in Visual Basic 2008. |
|---|
| Keywords | XAML, WPF, Visual Basic 2008, rubberband, rubberband circle |
|---|
| Categories | Graphics |
|---|
|
|
|
When the user presses the left mouse button, the following code creates a new Ellipse object. The Stroke property determines how the ellipse's border is drawn.
The call to e.GetPosition returns the mouse position relative to the control you pass it, in this case the Canvas canCircle.
Notice the bizarre calls to Canvas.SetTop and Canvas.SetLeft. In XAML, the ellipse's Canvas.Top and Canvas.Left properties determine the control's position on the Canvas that contains it. Those are not really properties of the Ellipse object (they are provided by the Canvas) so you need to use this weird method to set their values. (Yes, this seems very strange. I suspect the WPF developers were overly influenced by XAML's structure rather than following the pattern used by previous controls where you would simply set the ellipse's Top and Left properties. Whatever.)
After creating the Ellipse, the code adds it to the Canvas control canCircle.
|
|
Private start_point As Point
Private new_circle As Ellipse
' Start a circle centered at the starting point.
Private Sub canCircle_MouseLeftButtonDown(ByVal sender As _
Object, ByVal e As _
System.Windows.Input.MouseButtonEventArgs) Handles _
canCircle.MouseLeftButtonDown
new_circle = New Ellipse()
new_circle.Width = 0
new_circle.Height = 0
new_circle.Stroke = Brushes.Brown
start_point = e.GetPosition(canCircle)
Canvas.SetLeft(new_circle, start_point.Y)
Canvas.SetTop(new_circle, start_point.Y)
canCircle.Children.Add(new_circle)
End Sub
|
|
|
When the mouse moves, the following code adjusts the circle's size and position. The code calculates the distance between the mouse's current and original positions to get the circle's radius. It then sets the circle's upper left corner, width, and height.
|
|
' Change the circle's size.
Private Sub canCircle_MouseMove(ByVal sender As Object, _
ByVal e As System.Windows.Input.MouseEventArgs) Handles _
canCircle.MouseMove
If new_circle IsNot Nothing Then
' Get the distance from the start point to this
' point.
' That gives the circle's radius.
Dim pt As Point = e.GetPosition(canCircle)
Dim dx As Single = start_point.X - pt.X
Dim dy As Single = start_point.Y - pt.Y
Dim r As Single = Math.Sqrt(dx * dx + dy * dy)
' Move the new circle.
new_circle.Width = 2 * r
new_circle.Height = 2 * r
Canvas.SetTop(new_circle, start_point.Y - r)
Canvas.SetLeft(new_circle, start_point.X - r)
End If
End Sub
|
|
|
When the user releases the left mouse button, the following code sets new_circle to Nothing so future MouseMove events don't affect it.
|
|
' Stop drawing the new circle.
Private Sub canCircle_MouseLeftButtonUp(ByVal sender As _
Object, ByVal e As _
System.Windows.Input.MouseButtonEventArgs) Handles _
canCircle.MouseLeftButtonUp
new_circle = Nothing
End Sub
|
| |
|
| |
|
|
