Silverlight: descripción general de XAML

Una de las primeras cosas que encontrará al trabajar con Silverlight es XAML. XAML son las siglas de Extensible Application Markup Language. Es un lenguaje simple y declarativo basado en XML.

En XAML, es muy fácil crear, inicializar y establecer propiedades de un objeto con relaciones jerárquicas.
Se utiliza principalmente para diseñar GUI.
También se puede utilizar para otros fines, por ejemplo, para declarar flujo de trabajo en una base de flujo de trabajo.

Sintaxis básica

Cuando crea un nuevo proyecto de Silverlight, verá parte del código XAML de forma predeterminada en MainPage.xaml Como se muestra abajo.

<UserControl x:Class = "FirstExample.MainPage" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   mc:Ignorable = "d" 
   d:DesignHeight = "300" d:DesignWidth = "400"> 
	
   <Grid x:Name = "LayoutRoot" Background = "White"> 
         
   </Grid> 
	
</UserControl>

Puede ver que el archivo XAML proporcionado anteriormente menciona diferentes tipos de información; todos ellos se describen brevemente en la tabla que figura a continuación.

Información	Descripción
<UserControl	Proporciona la clase base para definir un nuevo control que encapsula los controles existentes y proporciona su propia lógica.
x: Class = "FirstExample.MainPage"	Es una declaración de clase parcial, que conecta el marcado con ese código de clase parcial detrás, definido en él.
xmlns = "http://schemas.microsoft.com / winfx / 2006 / xaml / presentation"	Asigna el espacio de nombres XAML predeterminado para el cliente / marco de Silverlight.
xmlns: x = "http: //schemas.microsoft.c om / winfx / 2006 / xaml"	Espacio de nombres XAML para el lenguaje XAML, que lo asigna al prefijo x:.
xmlns: d = "http://schemas.microsoft.com / expression / blend / 2008"	El espacio de nombres XAML está destinado a la compatibilidad con diseñadores, específicamente la compatibilidad con diseñadores en las superficies de diseño XAML de Microsoft Visual Studio y Microsoft Expression Blend.
xmlns: mc = "http: //schemas.openxmlforma ts.org/markup-compatibility/2006"	Indica y admite un modo de compatibilidad de marcado para leer XAML.
>	Fin del elemento de objeto de la raíz.
<Grid> </Grid>	Estas son las etiquetas de inicio y cierre de un objeto de cuadrícula vacío.
</UserControl>	Cerrar el elemento de objeto.

Las reglas de sintaxis para XAML son casi similares a las de XML. Si observa un documento XAML, notará que en realidad es un archivo XML válido. Su viceversa no es cierto, porque en XML, el valor de los atributos debe ser una cadena, mientras que en XAML puede ser un objeto diferente que se conoce como sintaxis de elemento de propiedad.

La sintaxis de un elemento de objeto comienza con un corchete de ángulo izquierdo (<) seguido del nombre de un objeto, por ejemplo, Botón.
Se definen las propiedades y atributos de ese elemento de objeto.
El elemento Objeto debe cerrarse con una barra inclinada (/) seguida inmediatamente por un corchete en ángulo recto (>).

A continuación se muestra un ejemplo de un objeto simple sin elemento hijo.

<Button/>

Ejemplo de un elemento de objeto con algunos atributos -

<Button Content = "Click Me" Height = "30" Width = "60"/>

Ejemplo de una sintaxis alternativa para definir las propiedades (sintaxis del elemento de propiedad) -

<Button> 
   <Button.Content>Click Me</Button.Content> 
   <Button.Height>30</Button.Height> 
   <Button.Width>60</Button.Width> 
</Button>

Ejemplo de un objeto con elemento secundario: StackPanel contiene Textblock como elemento secundario.

<StackPanel Orientation = "Horizontal"> 
   <TextBlock Text = "Hello"/> 
</StackPanel/>

Por qué XAML en Silverlight

XAML no se inventó originalmente para Silverlight. Provino de WPF, Windows Presentation Foundation. Silverlight se describe a menudo como un subconjunto de WPF. Esto no es estrictamente cierto, ya que Silverlight puede hacer algunas cosas que WPF no puede. Incluso donde la funcionalidad se superpone, los dos son ligeramente diferentes en los detalles.

Es más exacto decir que WPF y Silverlight son muy similares en muchos aspectos. A pesar de las diferencias, sigue siendo informativo observar la función XAML que Silverlight ha tomado prestada de WPF. Por ejemplo, Silverlight ofrece primitivas gráficas para mapas de bits y formas escalables.
También proporciona elementos para renderizar video y audio.
Tiene soporte de texto con formato simple y puede animar cualquier elemento. Si conoce WPF, este conjunto de funciones le resultará familiar.
Un punto importante, no puede tomar WPF XAML y usarlo en Silverlight.
Aunque existen similitudes, también encontrará numerosas pequeñas diferencias.

XAML y código subyacente

XAML define la apariencia y la estructura de una interfaz de usuario. Sin embargo, si desea que su aplicación haga algo útil cuando el usuario interactúa con ella, necesitará algo de código.

Cada archivo XAML generalmente está asociado con un archivo de código fuente, al que nos referimos como el código subyacente. Varios marcos de Microsoft utilizan este término.
El código subyacente generalmente necesitará usar elementos definidos en el XAML, ya sea para recuperar información sobre la entrada del usuario o para mostrar información al usuario.
En el código XAML que se muestra a continuación, TextBlock y Buttonestán definidos. De forma predeterminada, cuando se ejecuta la aplicación, mostrará un texto "Hello World!”En la página web y un botón.

<UserControl x:Class = "FirstExample.MainPage" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   mc:Ignorable = "d" 
   d:DesignHeight = "300" d:DesignWidth = "400">
   
   <Grid x:Name = "LayoutRoot" Background = "White"> 
      <StackPanel> 
         <TextBlock x:Name = "TextMessage"  
            Text = "Hello World!"  
            Margin = "5"> 
         </TextBlock> 
			
         <Button x:Name = "ClickMe"  
            Click = "ClickMe_Click"  
            Content = "Click Me!"  
            Margin = "5"> 
         </Button> 
			
      </StackPanel> 
   </Grid> 
</UserControl>

El código subyacente puede acceder a cualquier elemento que tenga el nombre x:Name directiva.
Los elementos con nombre están disponibles a través de campos en el código subyacente, lo que permite que el código acceda a estos objetos y sus miembros de la forma habitual.
los x:Prefix significa que el nombre no es una propiedad normal.
x:Name es una señal especial para el compilador XAML de que queremos tener acceso a este objeto en el código subyacente.

A continuación se muestra la implementación del evento de clic de botón en el que el TextBlock el texto se actualiza.

using System.Windows; 
using System.Windows.Controls;
  
namespace FirstExample {
 
   public partial class MainPage : UserControl {
	
      public MainPage() { 
         InitializeComponent(); 
      }
		
      private void ClickMe_Click(object sender, RoutedEventArgs e) { 
         TextMessage.Text = "Congratulations! you have created your first Silverlight Applicatoin"; 
      } 
   } 
}

XAML no es la única forma de diseñar los elementos de la interfaz de usuario. Depende de usted declarar objetos en XAML o declarar / escribir en un código.
XAML es opcional, pero a pesar de esto, es el corazón de Silverlight diseño.
El objetivo de la codificación XAML es permitir que los diseñadores visuales creen los elementos de la interfaz de usuario directamente. Por lo tanto,Silverlight tiene como objetivo hacer posible controlar todos los aspectos visuales de la interfaz de usuario desde el marcado.

↰ Previous page Next page ↱