如何:使用 Thumb 来启用拖动功能

更新:2007 年 11 月

本示例演示如何使用 Thumb 控件来调整 Canvas 控件的大小。

示例

Thumb 控件提供了拖动功能,可以使用该功能,通过监控 ThumbDragStartedDragDeltaDragCompleted 事件来移动控件或调整控件大小。

将鼠标指针停放在 Thumb 控件上后,用户可通过按住鼠标左键开始拖动操作。只要一直按住鼠标左键,拖动操作就连续进行。在拖动操作过程中,DragDelta 可能会发生多次。每次发生时,DragDeltaEventArgs 类都会根据鼠标位置的变化相应地更改位置。用户松开鼠标左键后,拖动操作即完成。拖动操作只提供新坐标;它不会自动重新改变 Thumb 的位置。

下面的示例说明 Thumb 控件是 Canvas 控件的子元素。其 DragDelta 事件的事件处理程序提供了用于移动 Thumb 和调整 Canvas 大小的逻辑。DragStartedDragCompleted 事件的事件处理程序在拖动操作过程中更改 Thumb 的颜色。下面的示例定义 Thumb

<Thumb Name="myThumb" Canvas.Left="80" Canvas.Top="80" Background="Blue" 
      Width="20" Height="20" DragDelta="onDragDelta" 
      DragStarted="onDragStarted" DragCompleted="onDragCompleted"
      />

下面的示例演示 DragDelta 事件处理程序,该事件处理程序将移动 Thumb 和调整 Canvas 大小以响应鼠标移动。

void onDragDelta(object sender, DragDeltaEventArgs e)
{
    //Move the Thumb to the mouse position during the drag operation
    double yadjust = myCanvasStretch.Height + e.VerticalChange;
    double xadjust = myCanvasStretch.Width + e.HorizontalChange;
    if ((xadjust >= 0) && (yadjust >= 0))
    {
        myCanvasStretch.Width = xadjust;
        myCanvasStretch.Height = yadjust;
        Canvas.SetLeft(myThumb, Canvas.GetLeft(myThumb) +
                                e.HorizontalChange);
        Canvas.SetTop(myThumb, Canvas.GetTop(myThumb) +
                                e.VerticalChange);
        changes.Text = "Size: " +
                        myCanvasStretch.Width.ToString() +
                         ", " +
                        myCanvasStretch.Height.ToString();
    }
}

下面的示例演示 DragStarted 事件处理程序。

Private Sub onDragStarted(ByVal sender As Object, ByVal e As DragStartedEventArgs)
    myThumb.Background = Brushes.Orange
End Sub
void onDragStarted(object sender, DragStartedEventArgs e)
{
    myThumb.Background = Brushes.Orange;
}

下面的示例演示 DragCompleted 事件处理程序。

Private Sub onDragCompleted(ByVal sender As Object, _
                  ByVal e As DragCompletedEventArgs)
    myThumb.Background = Brushes.Blue
End Sub
void onDragCompleted(object sender, DragCompletedEventArgs e)
{
    myThumb.Background = Brushes.Blue;
}

有关完整示例,请参见 Thumb 拖动功能示例

请参见

参考

Thumb

DragStarted

DragDelta

DragCompleted