Namespace: System.Windows.Controls

Library: PresentationFramework

A Canvas is used to define one or more areas inside a Window within which you can explicitly position controls (Buttons, TextBoxes etc.) by coordinates. To do this we will use what is called attached properties

Botton

Left

Right

Top

Remember one of our previous samples:

<Window  
   ...
>
 <Canvas  Width="400"  Height="400" Background="DeepSkyBlue"  >
  <TextBlock    Canvas.Top="50" Canvas.Left="100"   FontSize="14">Type you name and press 'Click'  </TextBlock>
  <TextBox Name = "Entry1" Canvas.Top="100" Canvas.Left="100" FontSize="14"/>
  <Button   Canvas.Top="200" Canvas.Left="100" Click = "UseName">Click</Button>
  <TextBlock Name="Text1"  Canvas.Top="300" Canvas.Left="100"   FontSize="14"  ></TextBlock>
 </Canvas>
</Window>

Sometimes can be useful the creation of more than one Canvas.

We will need to use a StackPanel and a Border :

<Window  
   ...
>
 <StackPanel>

 <Border Height="100"     BorderBrush="Black" BorderThickness="1"  >
    <Canvas  Width="1024"  Height="100" Background="Yellow"     >
     <TextBlock    Canvas.Top="1" Canvas.Left="2"   ...
    ... 
    </Canvas>             
  </Border> 
         
  <Border Height="668"   BorderBrush="Black" BorderThickness="1" DockPanel.Dock="Bottom">   
   <Canvas  Width="1024"  Height="668" Background="DeepSkyBlue" > 
     ... 
   </Canvas> 
  </Border>
  
 </StackPanel>
</Window>

Some properties:

Background

The value will be a color.

Height

Margin

Name

Opacity

Visibility

Width

An important method if we have more than one Canvas:

Focus()

The main events. To be overrided.

GotFoccus

KeyDown

KeyUp

And some mouse events:

  MouseDoubleClick    
  MouseDown    
  MouseEnter    
  MouseLeave    
  MouseLeftButtonDown    
  MouseLeftButtonUp    
  MouseMove    
  MouseRightButtonDown   
  MouseRightButtonUp    
  MouseUp    
   

     PREVIOUS  LESSON               NEXT  LESSON             
T.CONTENTS           HOMEPAGE