Silverlight - Visão geral do XAML

Uma das primeiras coisas que você encontrará ao trabalhar com o Silverlight é o XAML. XAML significa Extensible Application Markup Language. É uma linguagem simples e declarativa baseada em XML.

  • Em XAML, é muito fácil criar, inicializar e definir propriedades de um objeto com relações hierárquicas.

  • É usado principalmente para projetar GUI.

  • Ele também pode ser usado para outros fins, por exemplo, para declarar o fluxo de trabalho em uma base de fluxo de trabalho.

Sintaxe Básica

Ao criar um novo projeto Silverlight, você verá parte do código XAML por padrão em MainPage.xaml como mostrado abaixo.

<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>

Você pode ver que o arquivo XAML fornecido acima menciona diferentes tipos de informações; todos eles são descritos resumidamente na tabela abaixo.

Em formação Descrição
<UserControl Fornece a classe base para definir um novo controle que encapsula os controles existentes e fornece sua própria lógica.
x: Class = "FirstExample.MainPage" É uma declaração de classe parcial, que conecta a marcação a esse código de classe parcial definido nela.
xmlns = "http://schemas.microsoft.com / winfx / 2006 / xaml / presentation" Mapeia o namespace XAML padrão para cliente / estrutura Silverlight.
xmlns: x = "http: //schemas.microsoft.c om / winfx / 2006 / xaml" Namespace XAML para linguagem XAML, que mapeia para x: prefix.
xmlns: d = "http://schemas.microsoft.com / expression / blend / 2008" O namespace XAML se destina ao suporte do designer, especificamente ao suporte do designer nas superfícies de design XAML do Microsoft Visual Studio e do Microsoft Expression Blend.
xmlns: mc = "http: //schemas.openxmlforma ts.org/markup-compatibility/2006" Indica e oferece suporte a um modo de compatibilidade de marcação para leitura de XAML.
> Fim do elemento de objeto da raiz.
<Grid> </Grid> Estas são as marcas de início e de fechamento de um objeto de grade vazio.
</UserControl> Fechando o elemento do objeto.

As regras de sintaxe para XAML são quase semelhantes às do XML. Se você observar um documento XAML, perceberá que, na verdade, é um arquivo XML válido. O contrário não é verdade, porque em XML, o valor dos atributos deve ser uma string, enquanto em XAML pode ser um objeto diferente, conhecido como sintaxe de elemento de propriedade.

  • A sintaxe de um elemento Object começa com um colchete angular esquerdo (<) seguido pelo nome de um objeto, por exemplo, Botão.

  • As propriedades e atributos desse elemento de objeto são definidos.

  • O elemento Object deve ser fechado por uma barra (/) seguida imediatamente por um colchete angular direito (>).

Exemplo de um objeto simples sem nenhum elemento filho é mostrado abaixo.

<Button/>

Exemplo de um elemento de objeto com alguns atributos -

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

Exemplo de uma sintaxe alternativa para definir as propriedades (sintaxe do elemento Property) -

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

Exemplo de um objeto com elemento filho: StackPanel contém Textblock como elemento filho.

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

Por que XAML no Silverlight

O XAML não foi originalmente inventado para o Silverlight. Ele veio do WPF, o Windows Presentation Foundation. O Silverlight é frequentemente descrito como um subconjunto do WPF. Isso não é estritamente verdadeiro, pois o Silverlight pode fazer algumas coisas que o WPF não pode. Mesmo quando a funcionalidade se sobrepõe, os dois são ligeiramente diferentes nos detalhes.

  • É mais correto dizer que WPF e Silverlight são muito semelhantes em muitos aspectos. Apesar das diferenças, ainda é informativo observar o recurso XAML que o Silverlight emprestou do WPF. Por exemplo, o Silverlight oferece primitivos gráficos para bitmaps e formas escaláveis.

  • Ele também fornece elementos para renderizar vídeo e áudio.

  • Ele tem suporte de texto formatado simples e você pode animar qualquer elemento. Se você conhece o WPF, este conjunto de recursos será familiar para você.

  • Um ponto importante, você não pode pegar o WPF XAML e usá-lo no Silverlight.

  • Embora existam semelhanças, você também encontrará várias pequenas diferenças.

XAML e código atrás

XAML define a aparência e a estrutura de uma interface do usuário. No entanto, se desejar que seu aplicativo faça algo útil quando o usuário interagir com ele, você precisará de algum código.

  • Cada arquivo XAML geralmente está associado a um arquivo de código-fonte, ao qual nos referimos como o código por trás. Vários Microsoft Frameworks usam esse termo.

  • O code behind normalmente precisará usar elementos definidos no XAML, seja para recuperar informações sobre a entrada do usuário ou para mostrar informações ao usuário.

  • No código XAML fornecido abaixo, TextBlock e Buttonsão definidos. Por padrão, quando o aplicativo é executado, ele mostra um texto “Hello World!”Na página da web e um botão.

<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>

  • O code behind pode acessar qualquer elemento que seja nomeado com o x:Name diretiva.

  • Elementos nomeados tornam-se disponíveis por meio de campos no code behind, permitindo que o código acesse esses objetos e seus membros da maneira usual.

  • o x:Prefix significa que o nome não é uma propriedade normal.

  • x:Name é um sinal especial para o compilador XAML de que desejamos ter acesso a esse objeto no código por trás.

A seguir está a implementação do evento de clique de botão em que o TextBlock o texto é atualizado.

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 não é a única maneira de projetar os elementos da interface do usuário. Depende de você declarar objetos em XAML ou declarar / gravar em um código.

  • XAML é opcional, mas apesar disso, é o coração do Silverlight Projeto.

  • O objetivo da codificação XAML é permitir que os designers visuais criem os elementos da interface do usuário diretamente. Portanto,Silverlight visa possibilitar o controle de todos os aspectos visuais da interface do usuário a partir da marcação.