added samples
[windows-sources.git] / sdk / samples / WPFSamples / SamplesGallery / csharp / samps / documentviewer_samp.xaml
blobb2fab9bfea1791de7c7818784b0965c9d80ff2af
1 <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
2       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
3       Title="Document Viewer"
4       x:Class="myDocumentViewer.Page1"
5       Loaded="checkLang">
6 <TabControl MinHeight="500" MaxHeight="700" MinWidth="400">
7         <TabItem Style="{StaticResource TabStyle}" Header="FlowDocumentPageViewer Sample" IsSelected="true">
8           <StackPanel>
9             <TextBlock Style="{StaticResource HeaderStyle}">FlowDocumentPageViewer Sample</TextBlock>
11             <TextBlock Style="{StaticResource mainContentStyle}">This example demonstrates how to implement a Flow Document hosted within a FlowDocumentPageViewer control.</TextBlock>
13           </StackPanel>
14         </TabItem>
16         <TabItem Name="xaml" Style="{StaticResource TabStyle}" Header="XAML">
17                 <ScrollViewer HorizontalScrollBarVisibility="Visible">
19           <TextBlock Name="xamlCheck">
20           <TextBox Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
21 &lt;FlowDocumentPageViewer>  
22 &lt;FlowDocument xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
24     &lt;Paragraph Style="{StaticResource HeaderStyle}">Canvas Overview&lt;/Paragraph>
25     &lt;Paragraph>&lt;Rectangle Fill="Black" Height="1" Width="500" HorizontalAlignment="Left" />&lt;LineBreak/>&lt;/Paragraph>
26     
27     &lt;Paragraph Style="{StaticResource DisStyle}">[This topic is pre-release documentation and is subject to change in future releases. Blank topics are included as placeholders.]&lt;LineBreak/>&lt;/Paragraph>
28 &lt;Paragraph Style="{StaticResource mainContentStyle}">The Canvas element is used to position content according to absolute x- and y-coordinates. Canvas provides ultimate flexibility for positioning and arranging elements on the screen. Elements can be drawn in a unique location, or in the event that elements occupy the same coordinates, the order in which they appear in markup determines the order in which elements are drawn.&lt;/Paragraph>
30 &lt;Paragraph Style="{StaticResource mainContentStyle}">This topic contains the following sections.&lt;/Paragraph>
32 &lt;List>
34 &lt;ListItem>&lt;Paragraph Style="{StaticResource mainContentStyle}">What Can I Do with the Canvas?&lt;/Paragraph>&lt;/ListItem>
35 &lt;ListItem>&lt;Paragraph Style="{StaticResource mainContentStyle}">Adding a Border to a Canvas Element&lt;/Paragraph>&lt;/ListItem>
36 &lt;ListItem>&lt;Paragraph Style="{StaticResource mainContentStyle}">Order of Elements in a Canvas&lt;/Paragraph>&lt;/ListItem>
37 &lt;ListItem>&lt;Paragraph Style="{StaticResource mainContentStyle}">Creating a Canvas in "XAML"&lt;/Paragraph>&lt;/ListItem>
38 &lt;ListItem>&lt;Paragraph Style="{StaticResource mainContentStyle}">Creating a Canvas in Code&lt;/Paragraph>&lt;/ListItem>
40 &lt;/List>
41     
42     &lt;Paragraph Style="{StaticResource SubHeaderStyle}">What Can I Do with the Canvas?&lt;/Paragraph>
43     &lt;Paragraph Style="{StaticResource mainContentStyle}">Canvas provides the most flexible layout support of any Panel element. Height and Width properties are used to define the area of the canvas, and elements inside are assigned absolute coordinates relative to the upper left corner of the parent Canvas. This allows you to position and arrange elements precisely where you want them on the screen.&lt;/Paragraph>
45 &lt;Paragraph Style="{StaticResource SubHeaderStyle}">Adding a Border to a Canvas Element&lt;/Paragraph>
46 &lt;Paragraph Style="{StaticResource mainContentStyle}">In order for a Canvas element to have a border, it must be encapsulated within a Border element.&lt;/Paragraph>
48 &lt;Paragraph Style="{StaticResource mainContentStyle}">The following code example shows how to display Hello World within a Canvas with a border and background.&lt;/Paragraph>
49 &lt;Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
50 &lt;Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
51     &lt;Border 
52        BorderThickness="2"
53        BorderBrush="Black"
54        Background="LightGray"
55        HorizontalAlignment="Left" 
56        VerticalAlignment="Top"
57        Width="100"
58        Height="100">
59         &lt;Canvas>
60             &lt;TextBlock Canvas.Top="10" Canvas.Left="20">Hello World!&lt;/TextBlock>
61         &lt;/Canvas>
62     &lt;/Border>
63 &lt;/Page>
64 &lt;/Paragraph>
65 &lt;Paragraph Style="{StaticResource SubHeaderStyle}">Order of Elements in a Canvas&lt;/Paragraph>
66 &lt;Paragraph Style="{StaticResource mainContentStyle}">The order of child elements (z-index) in a Canvas is determined by their order in "Extensible Application Markup Language" ("XAML") or code. As a consequence, layered order can be achieved when elements share the same coordinates. Canvas and Grid are the only layout controls that supports sharing of space in this manner.&lt;/Paragraph>
68 &lt;Paragraph Style="{StaticResource mainContentStyle}">The following example demonstrates how to achieve layered order of elements within a Canvas. Notice that each Rectangle element is drawn in the order it appears in "XAML".&lt;/Paragraph>
70 &lt;Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
71 &lt;Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
72     &lt;Canvas Width="500" Height="500">
73         &lt;Rectangle Width="100" Height="100" Canvas.Top="100" Canvas.Left="100" Fill="blue"/>
74         &lt;Rectangle Width="100" Height="100" Canvas.Top="150" Canvas.Left="150" Fill="yellow"/>
75         &lt;Rectangle Width="100" Height="100" Canvas.Top="200" Canvas.Left="200" Fill="green"/>
77         &lt;!-- Reverse the order to illustrate z-index layering -->
79         &lt;Rectangle Width="100" Height="100" Canvas.Top="300" Canvas.Left="200" Fill="green"/>
80         &lt;Rectangle Width="100" Height="100" Canvas.Top="350" Canvas.Left="150" Fill="yellow"/>
81         &lt;Rectangle Width="100" Height="100" Canvas.Top="400" Canvas.Left="100" Fill="blue"/>
82     &lt;/Canvas>
83 &lt;/Page>
84 &lt;/Paragraph>
85 &lt;Paragraph Style="{StaticResource SubHeaderStyle}">Creating a Canvas in "XAML"&lt;/Paragraph>
86 &lt;Paragraph Style="{StaticResource mainContentStyle}">A Canvas can be instantiated simply by using "XAML".&lt;/Paragraph>
88 &lt;Paragraph Style="{StaticResource mainContentStyle}">The following markup example demonstrates how to use Canvas to absolutely position content. This markup produces three 100-pixel squares. The first square is red, and its top-left (x, y) position is specified as (0, 0). The second square is green, and its top-left position is (100, 100), just below and to the right of the first square. The third square is blue, and its top-left position is (50, 50), thus encompassing the lower-right quadrant of the first square and the upper-left quadrant of the second. Because the third square is laid out last, it appears to be on top of the other two squares—that is, the overlapping portions assume the color of the third box.&lt;/Paragraph>
90 &lt;Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
91 &lt;Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
92     &lt;Canvas Height="600" Width="800">
93         &lt;Canvas Height="100" Width="100"  Top="0" Left="0">
94             &lt;Rectangle Width="100" Height="100" Fill="red"/>   
95         &lt;/Canvas>
96         &lt;Canvas Height="100" Width="100" Top="100" Left="100">
97             &lt;Rectangle Width="100" Height="100" Fill="green"/>  
98         &lt;/Canvas>
99         &lt;Canvas Height="100" Width="100" Top="50" Left="50">
100             &lt;Rectangle Width="100" Height="100" Fill="blue"/>  
101         &lt;/Canvas>    
102     &lt;/Canvas>
103 &lt;/Page>
104 &lt;/Paragraph>
105 &lt;Paragraph Style="{StaticResource noteParagraph}">&lt;Bold>Note:&lt;/Bold> The Canvas element does not automatically produce scrollbars, even if its assigned width and height are greater than the available screen space. To render scrollbars, wrap the project in its entirety within a ScrollViewer element.&lt;/Paragraph>
106 &lt;Paragraph Style="{StaticResource SubHeaderStyle}">Creating a Canvas in Code&lt;/Paragraph>
107 &lt;Paragraph Style="{StaticResource mainContentStyle}">The following code example shows how to instantiate and use a Canvas using C#. Two TextBlock elements are absolutely positioned using the SetTop and SetLeft methods of the Canvas. The Canvas is assigned a Background color of LightSteelBlue.&lt;/Paragraph>
109 &lt;Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
110 [C#]using System;
111 using System.Windows;
112 using System.Windows.Controls;
113 using System.Windows.Media;
114 using System.Threading;
116 namespace Canvas_Demo
118     public class app : System.Windows.Application
119     {
120         System.Windows.Controls.TextBlock txt1;
121         System.Windows.Controls.Canvas canvas;
122         System.Windows.Controls.TextBlock txt2;
123         System.Windows.Window mainWindow;
125         protected override void OnStartingUp (StartingUpCancelEventArgs e)
126         {
127             base.OnStartingUp(e);
128             CreateAndShowMainWindow();
129         }
131         private void CreateAndShowMainWindow()
132         {
133             // Create the application's main window
134             mainWindow = new System.Windows.Window();
136             // Create a canvas sized to fill the window
137             canvas = new Canvas();
138             canvas.Background = System.Windows.Media.Brushes.LightSteelBlue;
140             // Add a "Hello World!" text element to the Canvas
141             txt1 = new System.Windows.Controls.TextBlock();
142             txt1.FontSize = 14;
143             txt1.Text = "Hello World!";
144             System.Windows.Controls.Canvas.SetTop(txt1, 100);
145             System.Windows.Controls.Canvas.SetLeft(txt1, 10);
146             canvas.Children.Add(txt1);
148             // Add a second text element to show how absolute positioning works in a Canvas
149             txt2 = new System.Windows.Controls.TextBlock();
150             txt2.FontSize = 22;
151             txt2.Text = "Isn't absolute positioning handy?";
152             System.Windows.Controls.Canvas.SetTop(txt2, 200);
153             System.Windows.Controls.Canvas.SetLeft(txt2, 75);
154             canvas.Children.Add(txt2);
155             
156             mainWindow.Content= canvas;
157             mainWindow.Show();
158         }
159     }
161     internal sealed class EntryClass
162     {
163         [System.STAThread()]
164         private static void Main ()
165         {
166             app app = new app ();
167             app.Run ();
168         }
169     }
171 &lt;/Paragraph>
173 &lt;Paragraph Style="{StaticResource mainContentStyle}">Send comments about this topic to Microsoft. © Microsoft Corporation. All rights reserved.&lt;/Paragraph>
174     
176 &lt;/FlowDocument>
177 &lt;/FlowDocumentPageViewer>            
178             </TextBox>
179           </TextBlock>
180         </ScrollViewer>
181         </TabItem>
182         <TabItem Name="xamlcsharp" Style="{StaticResource TabStyle}" Header="XAML + C#">
183           <TabControl TabStripPlacement="Right">
184             <TabItem Name="xcsharpCheck" Style="{StaticResource TabStyle2}" Header="XAML"></TabItem>
185             <TabItem Style="{StaticResource TabStyle2}" Header="C#"></TabItem>
186           </TabControl>
187         </TabItem>
189         <TabItem Name="xamlvb" Style="{StaticResource TabStyle}" Header="XAML + Visual Basic.NET">
190           <TabControl TabStripPlacement="Right">
191             <TabItem Name="xvbCheck" Style="{StaticResource TabStyle2}" Header="XAML"></TabItem>
192             <TabItem Style="{StaticResource TabStyle2}" Header="VB.NET"></TabItem>
193           </TabControl>
194         </TabItem>
195     
196         <TabItem Name="csharp" Style="{StaticResource TabStyle}" Header="C#"></TabItem>
197     
198         <TabItem Name="vb" Style="{StaticResource TabStyle}" Header="Visual Basic.NET"></TabItem>
200         <TabItem Name="managedcpp" Style="{StaticResource TabStyle}" Header="Managed C++"></TabItem>
201     
202         <TabItem Style="{StaticResource TabStyle}" Header="Preview Sample">
204 <FlowDocumentPageViewer>          
205 <FlowDocument>
207     <Paragraph Style="{StaticResource HeaderStyle}">Canvas Overview</Paragraph>
208     <Paragraph><Rectangle Fill="Black" Height="1" Width="500" HorizontalAlignment="Left" /><LineBreak/></Paragraph>
209     
210     <Paragraph Style="{StaticResource DisStyle}">[This topic is pre-release documentation and is subject to change in future releases. Blank topics are included as placeholders.]<LineBreak/></Paragraph>
211 <Paragraph Style="{StaticResource mainContentStyle}">The Canvas element is used to position content according to absolute x- and y-coordinates. Canvas provides ultimate flexibility for positioning and arranging elements on the screen. Elements can be drawn in a unique location, or in the event that elements occupy the same coordinates, the order in which they appear in markup determines the order in which elements are drawn.</Paragraph>
213 <Paragraph Style="{StaticResource mainContentStyle}">This topic contains the following sections.</Paragraph>
215 <List>
217 <ListItem><Paragraph Style="{StaticResource mainContentStyle}">What Can I Do with the Canvas?</Paragraph></ListItem>
218 <ListItem><Paragraph Style="{StaticResource mainContentStyle}">Adding a Border to a Canvas Element</Paragraph></ListItem>
219 <ListItem><Paragraph Style="{StaticResource mainContentStyle}">Order of Elements in a Canvas</Paragraph></ListItem>
220 <ListItem><Paragraph Style="{StaticResource mainContentStyle}">Creating a Canvas in "XAML"</Paragraph></ListItem>
221 <ListItem><Paragraph Style="{StaticResource mainContentStyle}">Creating a Canvas in Code</Paragraph></ListItem>
223 </List>
224     
225     <Paragraph Style="{StaticResource SubHeaderStyle}">What Can I Do with the Canvas?</Paragraph>
226     <Paragraph Style="{StaticResource mainContentStyle}">Canvas provides the most flexible layout support of any Panel element. Height and Width properties are used to define the area of the canvas, and elements inside are assigned absolute coordinates relative to the upper left corner of the parent Canvas. This allows you to position and arrange elements precisely where you want them on the screen.</Paragraph>
228 <Paragraph Style="{StaticResource SubHeaderStyle}">Adding a Border to a Canvas Element</Paragraph>
229 <Paragraph Style="{StaticResource mainContentStyle}">In order for a Canvas element to have a border, it must be encapsulated within a Border element.</Paragraph>
231 <Paragraph Style="{StaticResource mainContentStyle}">The following code example shows how to display Hello World within a Canvas with a border and background.</Paragraph>
232 <Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
233 &lt;Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
234     &lt;Border 
235        BorderThickness="2"
236        BorderBrush="Black"
237        Background="LightGray"
238        HorizontalAlignment="Left" 
239        VerticalAlignment="Top"
240        Width="100"
241        Height="100">
242         &lt;Canvas>
243             &lt;TextBlock Canvas.Top="10" Canvas.Left="20">Hello World!&lt;/TextBlock>
244         &lt;/Canvas>
245     &lt;/Border>
246 &lt;/Page>
247 </Paragraph>
248 <Paragraph Style="{StaticResource SubHeaderStyle}">Order of Elements in a Canvas</Paragraph>
249 <Paragraph Style="{StaticResource mainContentStyle}">The order of child elements (z-index) in a Canvas is determined by their order in "Extensible Application Markup Language" ("XAML") or code. As a consequence, layered order can be achieved when elements share the same coordinates. Canvas and Grid are the only layout controls that supports sharing of space in this manner.</Paragraph>
251 <Paragraph Style="{StaticResource mainContentStyle}">The following example demonstrates how to achieve layered order of elements within a Canvas. Notice that each Rectangle element is drawn in the order it appears in "XAML".</Paragraph>
253 <Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
254 &lt;Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
255     &lt;Canvas Width="500" Height="500">
256         &lt;Rectangle Width="100" Height="100" Canvas.Top="100" Canvas.Left="100" Fill="blue"/>
257         &lt;Rectangle Width="100" Height="100" Canvas.Top="150" Canvas.Left="150" Fill="yellow"/>
258         &lt;Rectangle Width="100" Height="100" Canvas.Top="200" Canvas.Left="200" Fill="green"/>
260         &lt;!-- Reverse the order to illustrate z-index layering -->
262         &lt;Rectangle Width="100" Height="100" Canvas.Top="300" Canvas.Left="200" Fill="green"/>
263         &lt;Rectangle Width="100" Height="100" Canvas.Top="350" Canvas.Left="150" Fill="yellow"/>
264         &lt;Rectangle Width="100" Height="100" Canvas.Top="400" Canvas.Left="100" Fill="blue"/>
265     &lt;/Canvas>
266 &lt;/Page>
267 </Paragraph>
268 <Paragraph Style="{StaticResource SubHeaderStyle}">Creating a Canvas in "XAML"</Paragraph>
269 <Paragraph Style="{StaticResource mainContentStyle}">A Canvas can be instantiated simply by using "XAML".</Paragraph>
271 <Paragraph Style="{StaticResource mainContentStyle}">The following markup example demonstrates how to use Canvas to absolutely position content. This markup produces three 100-pixel squares. The first square is red, and its top-left (x, y) position is specified as (0, 0). The second square is green, and its top-left position is (100, 100), just below and to the right of the first square. The third square is blue, and its top-left position is (50, 50), thus encompassing the lower-right quadrant of the first square and the upper-left quadrant of the second. Because the third square is laid out last, it appears to be on top of the other two squares—that is, the overlapping portions assume the color of the third box.</Paragraph>
273 <Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
274 &lt;Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
275     &lt;Canvas Height="600" Width="800">
276         &lt;Canvas Height="100" Width="100"  Top="0" Left="0">
277             &lt;Rectangle Width="100" Height="100" Fill="red"/>   
278         &lt;/Canvas>
279         &lt;Canvas Height="100" Width="100" Top="100" Left="100">
280             &lt;Rectangle Width="100" Height="100" Fill="green"/>  
281         &lt;/Canvas>
282         &lt;Canvas Height="100" Width="100" Top="50" Left="50">
283             &lt;Rectangle Width="100" Height="100" Fill="blue"/>  
284         &lt;/Canvas>    
285     &lt;/Canvas>
286 &lt;/Page>
287 </Paragraph>
288 <Paragraph Style="{StaticResource noteParagraph}"><Bold>Note:</Bold> The Canvas element does not automatically produce scrollbars, even if its assigned width and height are greater than the available screen space. To render scrollbars, wrap the project in its entirety within a ScrollViewer element.</Paragraph>
289 <Paragraph Style="{StaticResource SubHeaderStyle}">Creating a Canvas in Code</Paragraph>
290 <Paragraph Style="{StaticResource mainContentStyle}">The following code example shows how to instantiate and use a Canvas using C#. Two TextBlock elements are absolutely positioned using the SetTop and SetLeft methods of the Canvas. The Canvas is assigned a Background color of LightSteelBlue.</Paragraph>
292 <Paragraph Style="{StaticResource CodeSnippetParagraph}" xml:space="preserve">
293 [C#]using System;
294 using System.Windows;
295 using System.Windows.Controls;
296 using System.Windows.Media;
297 using System.Threading;
299 namespace Canvas_Demo
301     public class app : System.Windows.Application
302     {
303         System.Windows.Controls.TextBlock txt1;
304         System.Windows.Controls.Canvas canvas;
305         System.Windows.Controls.TextBlock txt2;
306         System.Windows.Window mainWindow;
308         protected override void OnStartingUp (StartingUpCancelEventArgs e)
309         {
310             base.OnStartingUp(e);
311             CreateAndShowMainWindow();
312         }
314         private void CreateAndShowMainWindow()
315         {
316             // Create the application's main window
317             mainWindow = new System.Windows.Window();
319             // Create a canvas sized to fill the window
320             canvas = new Canvas();
321             canvas.Background = System.Windows.Media.Brushes.LightSteelBlue;
323             // Add a "Hello World!" text element to the Canvas
324             txt1 = new System.Windows.Controls.TextBlock();
325             txt1.FontSize = 14;
326             txt1.Text = "Hello World!";
327             System.Windows.Controls.Canvas.SetTop(txt1, 100);
328             System.Windows.Controls.Canvas.SetLeft(txt1, 10);
329             canvas.Children.Add(txt1);
331             // Add a second text element to show how absolute positioning works in a Canvas
332             txt2 = new System.Windows.Controls.TextBlock();
333             txt2.FontSize = 22;
334             txt2.Text = "Isn't absolute positioning handy?";
335             System.Windows.Controls.Canvas.SetTop(txt2, 200);
336             System.Windows.Controls.Canvas.SetLeft(txt2, 75);
337             canvas.Children.Add(txt2);
338             
339             mainWindow.Content= canvas;
340             mainWindow.Show();
341         }
342     }
344     internal sealed class EntryClass
345     {
346         [System.STAThread()]
347         private static void Main ()
348         {
349             app app = new app ();
350             app.Run ();
351         }
352     }
354 </Paragraph>
356 <Paragraph Style="{StaticResource mainContentStyle}">Send comments about this topic to Microsoft. © Microsoft Corporation. All rights reserved.</Paragraph>
357     
359 </FlowDocument>
360 </FlowDocumentPageViewer>            
362         </TabItem>
363       </TabControl>
365 </Page>