方法: つまみを使用してキャンバスのサイズを変更する

この例では、Thumb コントロールを使用して Canvas コントロールのサイズを変更する方法を示します。

使用例

Thumb は、ドラッグ機能を実現するためのコントロールです。このコントロールを使用してコントロールを移動したりサイズを変更したりするには、Thumb の DragStarted イベント、DragDelta イベント、および DragCompleted イベントを監視します。

ユーザーがドラッグ操作を開始するときは、Thumb コントロール上にマウス ポインターを置いてマウスの左ボタンを押します。 ドラッグ操作は、マウスの左ボタンが押されている間続きます。 ドラッグ操作中に、DragDelta が 2 回以上発生する可能性があります。 このイベントが発生するたびに、マウス位置の変化に対応するコントロール位置の変化の情報が DragDeltaEventArgs クラスに格納されます。 ユーザーがマウスの左ボタンを離すと、ドラッグ操作は終了します。 ドラッグ操作は新しい座標を示すだけで、Thumb の位置を自動的に変更することはありません。

Canvas コントロールの子要素である Thumb コントロールの例を次に示します。 このコントロールの DragDelta イベントのイベント ハンドラーの中で、Thumb の移動や Canvas のサイズ変更を行います。 DragStarted および DragCompleted イベントのイベント ハンドラーによって、ドラッグ操作中の Thumb の色を変更します。 次の例では、Thumb を定義しています。

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

マウスの動きに応じて Thumb の移動や Canvas のサイズ変更を行う DragDelta イベント ハンドラーの例を次に示します。

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

DragStarted

DragDelta

DragCompleted