共用方式為

如何：建立和使用 Canvas

此範例顯示如何建立和使用 Canvas 的執行個體。

範例

下列範例會使用 Canvas 的 SetTop 和 SetLeft 方法，明確定位兩個 TextBlock 元素。 此範例也會將 LightSteelBlue 的 Background 色彩指派給 Canvas。

備註

當您使用 Extensible Application Markup Language （XAML） 來定位 TextBlock 元素時，請使用 Top 和 Left 屬性。

    private void CreateAndShowMainWindow()
    {
        // Create the application's main window
        mainWindow = new Window();

        // Create a canvas sized to fill the window
        Canvas myCanvas = new Canvas();
        myCanvas.Background = Brushes.LightSteelBlue;

        // Add a "Hello World!" text element to the Canvas
        TextBlock txt1 = new TextBlock();
        txt1.FontSize = 14;
        txt1.Text = "Hello World!";
        Canvas.SetTop(txt1, 100);
        Canvas.SetLeft(txt1, 10);
        myCanvas.Children.Add(txt1);

        // Add a second text element to show how absolute positioning works in a Canvas
        TextBlock txt2 = new TextBlock();
        txt2.FontSize = 22;
        txt2.Text = "Isn't absolute positioning handy?";
        Canvas.SetTop(txt2, 200);
        Canvas.SetLeft(txt2, 75);
        myCanvas.Children.Add(txt2);
        mainWindow.Content = myCanvas;
        mainWindow.Title = "Canvas Sample";
        mainWindow.Show();
    }
}

WindowTitle = "Canvas Sample"
'Create a Canvas as the root Panel
Dim myCanvas As New Canvas()
myCanvas.Background = Brushes.LightSteelBlue

Dim txt1 As New TextBlock
txt1.FontSize = 14
txt1.Text = "Hello World!"
Canvas.SetLeft(txt1, 10)
Canvas.SetTop(txt1, 100)
myCanvas.Children.Add(txt1)

'Add a second text element to show how absolute positioning works in a Canvas
Dim txt2 As New TextBlock
txt2.FontSize = 22
txt2.Text = "Isn't absolute positioning handy?"
Canvas.SetLeft(txt2, 75)
Canvas.SetTop(txt2, 200)
myCanvas.Children.Add(txt2)
Me.Content = myCanvas

另請參閱