Differences between revisions 1 and 9 (spanning 8 versions)
Revision 1 as of 2015-03-03 02:38:20
Size: 4194
Comment:
Revision 9 as of 2015-03-05 15:11:50
Size: 8456
Comment:
Deletions are marked like this. Additions are marked like this.
Line 7: Line 7:
== WHAT IS XAML ? ==
XAML stands for Extensible Application Markup Language (and pronounced "Zammel"). It's a simple language based on XML to create and initialize .NET objects with hierarchical relations. All you can do in XAML can also be done in code. XAML is just another way to create and initialize objects. You can use WPF without using XAML. It's up to you if you want to declare it in XAML or write it in code. See [[UsingWPF_from_APLX]] for a more complete introduction.
=== WHAT IS XAML ? ===
XAML stands for Extensible Application Markup Language (and pronounced "Zammel"). It's a simple language based on XML to create and initialize .NET objects with hierarchical relations. All you can do in XAML can also be done in code. XAML is just another way to create and initialize objects. You can use WPF without using XAML. It's up to you if you want to declare it in XAML or write it in code. See [[UsingWPF_from_APLX||target="_blank"]] for a more complete introduction.
Line 12: Line 12:
{{{ {{{#!highlight xml
Line 21: Line 21:
   <Grid x:Name="LayoutRoot">    <Grid>
Line 45: Line 45:

If you install the attached workspace and execute the following 2 lines:
=== FixSimpleXaml ===
If you install the attached namespace and execute the following 2 lines in your workspace:
Line 54: Line 54:
`FixSimpleXaml` is a function used to execute the Xaml and return the root element as a .Net object. All the other elements that are named in the Xaml will be attached by their named to the root object. For example the element '''!TextBox''' is named '''textBox1''' and the element '''Button''' is named '''button1''': `FixSimpleXaml` is a function used to execute the Xaml and return the root element as a .Net object. All the other elements that are named in the Xaml will be attached by their names to the root object automatically. For example the element '''!TextBox''' that is named '''textBox1''' (line 15) and the element '''Button''' that is named '''button1''' (line 22) are attached automatically to the root element:
Line 62: Line 62:
If you install the User Command [[sfPropGrid]] you can see all the properties and methods of the named objects by doing:
{{{
      ]noe win
}}}

`FixSimpleXaml` is a quick function to used on simple Xaml that do not have events and are properly formed. For cases where there is events that need to be fixed and error handling is necessary the function `FixXaml` is available. For example, with the Xaml code in '''sample2''' that has an event on the button (Click="__Button_Click"), if you do the following:
That way you don't need to define a separate variable for each named element. If you install the User Command [[sfPropGrid||target="_blank"]] you can see all the properties, methods and events of the named objects by doing:
{{{
      ]noe win ⍝ noe = .Net Object Explorer
}}}
In conclusion `FixSimpleXaml` is a quick function to use on simple Xaml that do not have events and are properly formed.

=== FixXaml ===
For cases where there is events that need to be fixed and error handling is necessary the function `FixXaml` is available. It is useful when using Xaml taken directly from Visual Studio.<<BR>>
For example, with the Xaml code in '''sample2''' that has an event on the button (Click="`__Button_Click`") at line 24, if you do the following:
<<SeeSaw(section="sample2", toshow="<<Show sample2>>", tohide="<<Hide sample2>>", bg="#FEE1A5", speed="Slow")>>
{{{{#!wiki seesaw/sample2/sample2/hide
{{{#!highlight xml
<Window
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   x:Class="WpfApplication3.MainWindow"
   Height="200"
   Width="250"
   Title="MainWindow"
   WindowStartupLocation="CenterScreen">
   <Grid>
      <Grid.RowDefinitions>
         <RowDefinition Height="0.5*"/>
         <RowDefinition Height="0.5*"/>
      </Grid.RowDefinitions>
      <TextBox
         x:Name="textBox1"
         Width="130"
         HorizontalAlignment="Center"
         VerticalAlignment="Center"
         Text="TextBox"
         TextAlignment="Center"/>
      <Button
         x:Name="button1"
         Click="__Button_Click"
         Height="40"
         Width="120"
         Grid.Row="1"
         HorizontalAlignment="Center"
         VerticalAlignment="Center"
         Content="Click Me !"/>
   </Grid>
</Window>
}}}
}}}}
Line 73: Line 113:
and then you click on the button, the value of the '''!TextBox''' will change. The value of the '''!TextBox''' can be retreived by doing: and then if you click on the button, the value of the '''!TextBox''' will change. The value of the '''!TextBox''' can be retrieved by doing:
Line 79: Line 119:
The function '''__Button_Click''' is handling the event. The author has taken the convention of naming the callback functions with a double underscore prefix '__'. The goal is to be able to take the Xaml directly from Visual Studio to APL. The single underscore '_' is a valid first character in Visual Studio and APL but is in conflict with the menu object that will accept an underscore as first character to signify a keyboard shortcut. The function `__Button_Click` is handling the event. The author has taken the convention of naming the callback functions with a double underscore prefix. The goal is to be able to take the Xaml directly from Visual Studio to APL. The single underscore '_' is a valid first character in Visual Studio and APL but is in conflict with the menu object that will accept an underscore as first character to signify a keyboard shortcut. The line 5 of '''sample2''' (x:Class="!WpfApplication3.!MainWindow") that is necessary to Visual Studio is also removed by `FixXaml`. See the comments of the individual functions for more information.<<BR>><<BR>>
In production code you may want to trap any error by using the following code:
{{{
 ⍝ Example when using FixSimpleXaml (with no error trapping)

 :If ⎕NULL≡myObject ← FixSimpleXaml myXaml
    ⍝ Fixing the Xaml did not work. Show an error and exit.
     ⎕ ← 'Error Fixing Xaml'
     →0

 :Else
    ⍝ There is no error. Do nothing.

 :EndIf


⍝ Example when using FixXaml (with error trapping)

 :If ⎕NULL≡↑myObject ← FixXaml myXaml
    ⍝ Fixing the Xaml did not work. Show an error and exit.
     ⎕ ← 2⊃myObject
     →0

 :Else
    ⍝ There is no error. Do nothing.

 :EndIf
}}}

=== ⎕USING ===
When using Xaml, there is no need to define a ⎕USING before fixing it except when there is a 3rd party dll involve. For example the variable `NewWindow` is defined as:
{{{
<Window
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
</Window>
}}}
and if you do:
{{{
      win ← FixSimpleXaml NewWindow
      win.Show
}}}
a Window will appear. In procedural code the following is required for the same result:
{{{
      ⎕USING←'System.Windows,WPF/PresentationFramework.dll'
      win ← ⎕NEW Window
}}}
The first element of Xaml must contain the '''xmlns=''' and the '''xmlns:x=''' declarations. This is instructing the parser (in our case '''System.Windows.Markup.!XamlReader''' in the function `FixSimpleXaml`) to load a series of .NET namespaces required to parse the Xaml. This is just a convention, there is no Web site that exist with those names.

=== 3rd Party Dll ===
When using 3rd party dll, they must be added to the declaration in the first element of Xaml. There are 2 choices on how to do it:<<BR>>

{{{
   xmlns:myname="clr‑namespace:MyNamespace;assembly=MyDllName"
or
   xmlns:myname="http://schemas.somewebsite.com/xaml"
}}}
The first line is the preferred choice but this is not enough, ⎕USING must be setup correctly before fixing the Xaml for 3rd party dll. Here is an example for the Syncfusion !PropertyGrid ('''Syncfusion/4.5/''' is the Dyalog sub-directory where are located the assemblies) :
{{{
     ⎕USING ← 'Syncfusion.Windows.PropertyGrid,Syncfusion/4.5/Syncfusion.PropertyGrid.Wpf.dll'
}}}



=== Routed Events ===

=== Fixing Images ===
Line 95: Line 201:

The User Command [[wpfXamlEditor||target="_blank"]] is designed to edit the Xaml saved in the workspace and on disk.

wpfXamlDemo

UNDER CONSTRUCTION

wpfXamlDemo is a Dyalog APL namespace that demonstrate the use of WPF Xaml with some utility functions.

WHAT IS XAML ?

XAML stands for Extensible Application Markup Language (and pronounced "Zammel"). It's a simple language based on XML to create and initialize .NET objects with hierarchical relations. All you can do in XAML can also be done in code. XAML is just another way to create and initialize objects. You can use WPF without using XAML. It's up to you if you want to declare it in XAML or write it in code. See UsingWPF_from_APLX for a more complete introduction. Here is an example of Xaml found in the attached namespace called sample1: Show sample1

   1 <Window
   2    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   3    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
   4    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   5    Height="200"
   6    Width="250"
   7    Title="MainWindow"
   8    WindowStartupLocation="CenterScreen">
   9    <Grid>
  10       <Grid.RowDefinitions>
  11          <RowDefinition Height="0.5*"/>
  12          <RowDefinition Height="0.5*"/>
  13       </Grid.RowDefinitions>
  14       <TextBox
  15          x:Name="textBox1"
  16          Width="130"
  17          HorizontalAlignment="Center"
  18          VerticalAlignment="Center"
  19          Text="TextBox"
  20          TextAlignment="Center"/>
  21       <Button
  22          x:Name="button1"
  23          Height="40"
  24          Width="120"
  25          Grid.Row="1"
  26          HorizontalAlignment="Center"
  27          VerticalAlignment="Center"
  28          Content="Click Me !"/>
  29    </Grid>
  30 </Window>

FixSimpleXaml

If you install the attached namespace and execute the following 2 lines in your workspace:

      win ← FixSimpleXaml sample1
      win.Show

The following Window is displayed:
Sample1.png

FixSimpleXaml is a function used to execute the Xaml and return the root element as a .Net object. All the other elements that are named in the Xaml will be attached by their names to the root object automatically. For example the element TextBox that is named textBox1 (line 15) and the element Button that is named button1 (line 22) are attached automatically to the root element:

      win.textBox1.Text
Textbox
      win.button1
System.Windows.Controls.Button: Click Me !

That way you don't need to define a separate variable for each named element. If you install the User Command sfPropGrid you can see all the properties, methods and events of the named objects by doing:

      ]noe win       ⍝ noe = .Net Object Explorer

In conclusion FixSimpleXaml is a quick function to use on simple Xaml that do not have events and are properly formed.

FixXaml

For cases where there is events that need to be fixed and error handling is necessary the function FixXaml is available. It is useful when using Xaml taken directly from Visual Studio.
For example, with the Xaml code in sample2 that has an event on the button (Click="__Button_Click") at line 24, if you do the following: Show sample2

   1 <Window
   2    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   3    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
   4    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   5    x:Class="WpfApplication3.MainWindow"
   6    Height="200"
   7    Width="250"
   8    Title="MainWindow"
   9    WindowStartupLocation="CenterScreen">
  10    <Grid>
  11       <Grid.RowDefinitions>
  12          <RowDefinition Height="0.5*"/>
  13          <RowDefinition Height="0.5*"/>
  14       </Grid.RowDefinitions>
  15       <TextBox
  16          x:Name="textBox1"
  17          Width="130"
  18          HorizontalAlignment="Center"
  19          VerticalAlignment="Center"
  20          Text="TextBox"
  21          TextAlignment="Center"/>
  22       <Button
  23          x:Name="button1"
  24          Click="__Button_Click"
  25          Height="40"
  26          Width="120"
  27          Grid.Row="1"
  28          HorizontalAlignment="Center"
  29          VerticalAlignment="Center"
  30          Content="Click Me !"/>
  31    </Grid>
  32 </Window>

      win ← FixXaml sample2
      win.Show

and then if you click on the button, the value of the TextBox will change. The value of the TextBox can be retrieved by doing:

      win.textBox1.Text
I Was Clicked !

The function __Button_Click is handling the event. The author has taken the convention of naming the callback functions with a double underscore prefix. The goal is to be able to take the Xaml directly from Visual Studio to APL. The single underscore '_' is a valid first character in Visual Studio and APL but is in conflict with the menu object that will accept an underscore as first character to signify a keyboard shortcut. The line 5 of sample2 (x:Class="WpfApplication3.MainWindow") that is necessary to Visual Studio is also removed by FixXaml. See the comments of the individual functions for more information.

In production code you may want to trap any error by using the following code:

 ⍝ Example when using FixSimpleXaml (with no error trapping)

 :If ⎕NULL≡myObject ← FixSimpleXaml myXaml
    ⍝ Fixing the Xaml did not work. Show an error and exit.
     ⎕ ← 'Error Fixing Xaml'
     →0

 :Else
    ⍝ There is no error. Do nothing.

 :EndIf


⍝ Example when using FixXaml (with error trapping)

 :If ⎕NULL≡↑myObject ← FixXaml myXaml
    ⍝ Fixing the Xaml did not work. Show an error and exit.
     ⎕ ← 2⊃myObject
     →0

 :Else
    ⍝ There is no error. Do nothing.

 :EndIf

⎕USING

When using Xaml, there is no need to define a ⎕USING before fixing it except when there is a 3rd party dll involve. For example the variable NewWindow is defined as:

<Window
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
</Window>

and if you do:

      win ← FixSimpleXaml NewWindow
      win.Show

a Window will appear. In procedural code the following is required for the same result:

      ⎕USING←'System.Windows,WPF/PresentationFramework.dll'
      win ← ⎕NEW Window

The first element of Xaml must contain the xmlns= and the xmlns:x= declarations. This is instructing the parser (in our case System.Windows.Markup.XamlReader in the function FixSimpleXaml) to load a series of .NET namespaces required to parse the Xaml. This is just a convention, there is no Web site that exist with those names.

3rd Party Dll

When using 3rd party dll, they must be added to the declaration in the first element of Xaml. There are 2 choices on how to do it:

   xmlns:myname="clr‑namespace:MyNamespace;assembly=MyDllName"  
or
   xmlns:myname="http://schemas.somewebsite.com/xaml" 

The first line is the preferred choice but this is not enough, ⎕USING must be setup correctly before fixing the Xaml for 3rd party dll. Here is an example for the Syncfusion PropertyGrid (Syncfusion/4.5/ is the Dyalog sub-directory where are located the assemblies) :

     ⎕USING ← 'Syncfusion.Windows.PropertyGrid,Syncfusion/4.5/Syncfusion.PropertyGrid.Wpf.dll'

Routed Events

Fixing Images

How to install wpfXamlDemo in your workspace

  1. Download wpfXamlDemo.v1.0.txt

  2. Do a Select all (Ctrl+A) and a copy (Ctrl+C).
  3. In your workspace execute )ed ⍟ wpfXamlDemo 

  4. Paste (Ctrl+V) the text into the Dyalog editor
  5. Press Escape and ')save' your workspace

Version Information

Original author:

Pierre Gilbert

Responsible:

PierreGilbert

Email:

<apgil AT SPAMFREE videotron DOT ca>

CategoryDyalogWpfUtilities

The User Command wpfXamlEditor is designed to edit the Xaml saved in the workspace and on disk.

wpfXamlDemo (last edited 2017-10-19 12:19:35 by PierreGilbert)