Use a Thumb to resize a Canvas control by responding to the DragDelta event. : Canvas « Windows Presentation Foundation « VB.Net Tutorial






  1. VB.Net Tutorial
  2. Windows Presentation Foundation
  3. Canvas
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="Thumb_wcp.Pane1">
  <Canvas Width="100" Height="100" Name="myCanvasStretch">
    <TextBox Name="changes" 
         Width="{Binding ElementName=myCanvasStretch,Path=Width}"  
         Height="{Binding ElementName=myCanvasStretch,Path=Height}" 
         Text="Size: 100, 100"/>
    <Thumb Name="myThumb" Canvas.Left="80" Canvas.Top="80" Background="Blue" 
          Width="20" Height="20" DragDelta="onDragDelta"/>
  </Canvas>
</Canvas>
//File:Window.xaml.vb


Imports System
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Controls.Primitives
Imports System.Windows.Documents
Imports System.Windows.Navigation
Imports System.Windows.Shapes
Imports System.Windows.Data
Imports System.Windows.Media

Namespace Thumb_wcp
  Public Partial Class Pane1
    Inherits Canvas
    Private Sub onDragDelta(sender As Object, e As DragDeltaEventArgs)
      Dim yadjust As Double = myCanvasStretch.Height + e.VerticalChange
      Dim xadjust As Double = myCanvasStretch.Width + e.HorizontalChange
      If (xadjust >= 0) AndAlso (yadjust >= 0) Then
        myCanvasStretch.Width = xadjust
        myCanvasStretch.Height = yadjust
        Canvas.SetLeft(myThumb, Canvas.GetLeft(myThumb) + e.HorizontalChange)
        Canvas.SetTop(myThumb, Canvas.GetTop(myThumb) + e.VerticalChange)
        Console.WriteLine(myCanvasStretch.Width)
        Console.WriteLine(myCanvasStretch.Height)
      End If
    End Sub

  End Class
End Namespace
WPF Use A Thumb To Resize A Canvas Control By Responding To The Drag Delta Event




16.63.Canvas
16.63.1.Align Button along with Canvas positionAlign Button along with Canvas position
16.63.2.Using a Canvas to absolutely position elementsUsing a Canvas to absolutely position elements
16.63.3.Simple CanvasSimple Canvas
16.63.4.StackPanel Demo and CanvasStackPanel Demo and Canvas
16.63.5.Canvas with MinHeight and MinWidthCanvas with MinHeight and MinWidth
16.63.6.Draws a Path element within a CanvasDraws a Path element within a Canvas
16.63.7.Draws several Line elements within a CanvasDraws several Line elements within a Canvas
16.63.8.Draws several Polyline elements within a CanvasDraws several Polyline elements within a Canvas
16.63.9.Rectangle with Fill and Canvas positionRectangle with Fill and Canvas position
16.63.10.Custom Coordinates by transforming the CanvasCustom Coordinates by transforming the Canvas
16.63.11.Draw path on a CanvasDraw path on a Canvas
16.63.12.Use Canvas coordinationUse Canvas coordination
16.63.13.Use Canvas to layout Buttons and LabelsUse Canvas to layout Buttons and Labels
16.63.14.Position UI Elements Using Exact CoordinatesPosition UI Elements Using Exact Coordinates
16.63.15.Pixel SnappedPixel Snapped
16.63.16.Positioning Rectangle on a CanvasPositioning Rectangle on a Canvas
16.63.17.Canvas inside canvas, showing relative absolute positioningCanvas inside canvas, showing relative absolute positioning
16.63.18.Aligning elements using multiple attached properties of CanvasAligning elements using multiple attached properties of Canvas
16.63.19.Layer elements in a Canvas elementLayer elements in a Canvas element
16.63.20.Use the four attached properties of the Canvas element: Bottom, Left, Right, and TopUse the four attached properties of the Canvas element: Bottom, Left, Right, and Top
16.63.21.Canvas PreviewMouseDown action and MouseDown actionCanvas PreviewMouseDown action and MouseDown action
16.63.22.Handles the MouseDown event on the CanvasHandles the MouseDown event on the Canvas
16.63.23.StatusBar inside a CanvasStatusBar inside a Canvas
16.63.24.Drag Items from a List and Drop Them on a CanvasDrag Items from a List and Drop Them on a Canvas
16.63.25.Print Visual(Canvas)Print Visual(Canvas)
16.63.26.Get position on a Canvas with Canvas.GetLeftGet position on a Canvas with Canvas.GetLeft
16.63.27.Use a Thumb to resize a Canvas control by responding to the DragDelta event.Use a Thumb to resize a Canvas control by responding to the DragDelta event.
16.63.28.Canvas Positioning Properties SampleCanvas Positioning Properties Sample
16.63.29.Canvas.SetTopCanvas.SetTop
16.63.30.Canvas.SetBottomCanvas.SetBottom
16.63.31.Canvas.SetRightCanvas.SetRight
16.63.32.Add buttons to a Canvas with codeAdd buttons to a Canvas with code
16.63.33.Set control position for CanvasSet control position for Canvas