Silverlight-XAML 개요

Silverlight로 작업 할 때 가장 먼저 접하게되는 것 중 하나는 XAML입니다. XAML은 Extensible Application Markup Language를 의미합니다. XML을 기반으로하는 단순하고 선언적인 언어입니다.

  • XAML에서는 계층 적 관계가있는 개체의 속성을 만들고, 초기화하고, 설정하는 것이 매우 쉽습니다.

  • 주로 GUI 디자인에 사용됩니다.

  • 예를 들어 워크 플로 기반에서 워크 플로를 선언하는 등 다른 용도로도 사용할 수 있습니다.

기본 구문

새 Silverlight 프로젝트를 만들면 기본적으로 일부 XAML 코드가 MainPage.xaml 아래 그림과 같이.

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

위에 제공된 XAML 파일에 여러 종류의 정보가 언급되어 있음을 알 수 있습니다. 그들 모두는 아래 표에 간략하게 설명되어 있습니다.

정보 기술
<UserControl 기존 컨트롤을 캡슐화하고 자체 논리를 제공하는 새 컨트롤을 정의하기위한 기본 클래스를 제공합니다.
x : Class = "FirstExample.MainPage" 마크 업을 그 뒤에 정의 된 부분 클래스 코드에 연결하는 부분 클래스 선언입니다.
xmlns = "http://schemas.microsoft.com / winfx / 2006 / xaml / presentation" Silverlight 클라이언트 / 프레임 워크에 대한 기본 XAML 네임 스페이스를 매핑합니다.
xmlns : x = "http : //schemas.microsoft.c om / winfx / 2006 / xaml" x : 접두사에 매핑되는 XAML 언어 용 XAML 네임 스페이스입니다.
xmlns : d = "http://schemas.microsoft.com / expression / blend / 2008" XAML 네임 스페이스는 디자이너 지원, 특히 Microsoft Visual Studio 및 Microsoft Expression Blend의 XAML 디자인 화면에서 디자이너 지원을위한 것입니다.
xmlns : mc = "http : //schemas.openxmlforma ts.org/markup-compatibility/2006" XAML 읽기를위한 태그 호환성 모드를 나타내며 지원합니다.
> 루트의 개체 요소의 끝입니다.
<격자> </ 격자> 이것은 빈 그리드 객체의 시작 및 종료 태그입니다.
</ UserControl> 개체 요소를 닫습니다.

XAML의 구문 규칙은 XML의 구문 규칙과 거의 유사합니다. XAML 문서를 보면 실제로 유효한 XML 파일임을 알 수 있습니다. XML에서는 특성 값이 문자열이어야하지만 XAML에서는 속성 요소 구문으로 알려진 다른 개체 일 수 있기 때문에 그 반대의 경우도 마찬가지입니다.

  • 개체 요소의 구문은 왼쪽 꺾쇠 괄호 (<)로 시작하고 그 뒤에 개체 이름이옵니다 (예 : Button).

  • 해당 개체 요소의 속성 및 특성이 정의됩니다.

  • Object 요소는 슬래시 (/)와 오른쪽 꺾쇠 괄호 (>)로 닫아야합니다.

하위 요소가없는 단순 객체의 예는 다음과 같습니다.

<Button/>

일부 속성을 가진 객체 요소의 예-

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

속성을 정의하는 대체 구문의 예 (Property 요소 구문) −

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

자식 요소가있는 객체의 예 : StackPanel은 자식 요소로 Textblock을 포함합니다.

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

Silverlight에서 XAML을 사용해야하는 이유

XAML은 원래 Silverlight 용으로 개발되지 않았습니다. Windows Presentation Foundation 인 WPF에서 나왔습니다. Silverlight는 종종 WPF의 하위 집합으로 설명됩니다. Silverlight는 WPF가 할 수없는 몇 가지 작업을 수행 할 수 있기 때문에 이것은 엄격하게 사실이 아닙니다. 기능이 겹치는 경우에도 세부 사항이 약간 다릅니다.

  • WPF와 Silverlight는 여러면에서 매우 유사하다고 말하는 것이 더 정확합니다. 차이점에도 불구하고 Silverlight가 WPF에서 차용 한 XAML 기능을 살펴 보는 것은 여전히 ​​유익합니다. 예를 들어 Silverlight는 비트 맵 및 확장 가능한 모양에 대한 그래픽 프리미티브를 제공합니다.

  • 또한 비디오 및 오디오 렌더링을위한 요소도 제공합니다.

  • 간단한 형식의 텍스트 지원이 있으며 모든 요소에 애니메이션을 적용 할 수 있습니다. WPF를 알고 있다면이 기능 세트가 익숙 할 것입니다.

  • 한 가지 중요한 점은 WPF XAML을 가져와 Silverlight에서 사용할 수 없다는 것입니다.

  • 유사점이 있지만 많은 작은 차이점도 있습니다.

XAML 및 코드 숨김

XAML은 사용자 인터페이스의 모양과 구조를 정의합니다. 그러나 사용자가 상호 작용할 때 응용 프로그램에서 유용한 작업을 수행하려면 코드가 필요합니다.

  • 각 XAML 파일은 일반적으로 소스 코드 파일과 연결되며이를 코드 숨김이라고합니다. 다양한 Microsoft 프레임 워크에서이 용어를 사용합니다.

  • 뒤에있는 코드는 일반적으로 사용자 입력에 대한 정보를 검색하거나 사용자에게 정보를 표시하기 위해 XAML에 정의 된 요소를 사용해야합니다.

  • 아래 주어진 XAML 코드에서 TextBlockButton정의됩니다. 기본적으로 응용 프로그램이 실행되면 "Hello World!”와 버튼이 있습니다.

<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>
  • 뒤에있는 코드는 다음으로 명명 된 모든 요소에 액세스 할 수 있습니다. x:Name 지령.

  • 명명 된 요소는 코드 뒤에있는 필드를 통해 사용할 수 있으므로 코드가 일반적인 방법으로 이러한 개체와 해당 멤버에 액세스 할 수 있습니다.

  • 그만큼 x:Prefix 이름이 일반 속성이 아님을 나타냅니다.

  • x:Name 코드 뒤에서이 개체에 액세스 할 수 있도록하는 XAML 컴파일러에 대한 특수 신호입니다.

다음은 버튼 클릭 이벤트 구현입니다. TextBlock 텍스트가 업데이트됩니다.

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은 UI 요소를 디자인하는 유일한 방법이 아닙니다. XAML에서 개체를 선언하거나 코드에서 선언 / 작성하는 것은 사용자에게 달려 있습니다.

  • XAML은 선택 사항이지만 그럼에도 불구하고 Silverlight 디자인.

  • XAML 코딩의 목표는 시각적 디자이너가 사용자 인터페이스 요소를 직접 만들 수 있도록하는 것입니다. 따라서,Silverlight 마크 업에서 사용자 인터페이스의 모든 시각적 측면을 제어 할 수 있도록하는 것을 목표로합니다.