XAML 기초

1. Button 선언방법

<!-- Button은 Windows.UI.Xaml.Controls 네임스페이스에서 포함되어있기 때문에 xmlns을 안써줘도 된다. Page 에 미리 선언된 값을 따른다. -->

<Button xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Content="Stop"/>

<!-- 기본적으로 지원하지 않는 네임스페이스의 경우, 접두사를 편한대로 정의해주고 관련 네임스페이스를 지정해주면된다. -->

<UiNamespace:Button 

xmlns:UiNamespace="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

Content="Stop"/>

2. Content 개념

c#

Windows.UI.Xaml.Controls.Button b = new Windows.UI.Xaml.Controls.Button(); b.Width = 96; b.Height = 38; Windows.UI.Xaml.Shapes.Rectangle r = new Windows.UI.Xaml.Shapes.Rectangle(); r.Width = 10; r.Height = 10; r.Fill = new Windows.UI.Xaml.Media.SolidColorBrush(Windows.UI.Colors.White); b.Content = r; // Make the square the content of the Button // Content 는 Object 형을 지니기 때문에 대다수의 자료형에 대응할 수 있다.

XAML

<Button xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Width="96" Height="38">   <Button.Content>     <Rectangle Width="10" Height="10" Fill="White"/>   </Button.Content> </Button> <Button xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Width="96" Height="38" Content="Red" /> <!-- 기본적으로 생략이 가능하다. --> <Button xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Width="96" Height="38">     <Rectangle Width="10" Height="10" Fill="White"/> </Button>

3. 컨트롤의 속성값을 지정하는 방법

1. CodeBehind 에서 직접 속성을 지정해준다.

2. XAML 에서 지정해준다.

1) 직접 String 값을 이용하여 지정

<Button xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Width="96" Height="38" Content="Red" />

2) Makeup Extensions를 이용하여 지정

<Button xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    Height="50"    Background="{x:Null}"    Content="{Binding Height, RelativeSource={RelativeSource Self}}"/>

3) 자식엘리먼트로 지정

<Button xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">   <Button.Content>     Stop   </Button.Content>   <Button.Background>     Red   </Button.Background> </Button>

4. Type Converters

5. 기타 유용한 것들

Mixing XAML with C#

string xamlString = …;

// Get the root element, which we know is a Page

Page p = (Page)XamlReader.Load(xamlString);

string xamlString = …;

// Get the root element, which we know is a Page

Page p = (Page)XamlReader.Load(xamlString);

// Grab the Stop button by walking the children (with hard-coded knowledge!)

StackPanel panel = (StackPanel)p.Content;

Button stopButton = (Button)panel.Children[4];

Naming XAML Elements

<Button x:Name="stopButton">Stop</Button>

string xamlString = …;

// Get the root element, which we know is a Page

Page p = (Page)XamlReader.Load(xamlString);

// Grab the Stop button, knowing only its name

Button stopButton = (Button)p.FindName("stopButton");

6. 레이아웃 예제

<Page

x:Class="HelloRealWorld.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:local="using:HelloRealWorld"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

mc:Ignorable="d">

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

<StackPanel x:Uid="Panel" Name="stackPanel" Margin="100">

<TextBlock x:Uid="Greeting" FontSize="80" TextWrapping="WrapWholeWords"

                                                Margin="12,48"/>

<TextBlock x:Uid="EnterName" FontSize="28" Margin="12"/>

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition/>

<ColumnDefinition Width="Auto"/>

</Grid.ColumnDefinitions>

<TextBox Name="nameBox" Margin="12"/>

<Button x:Uid="GoButton" Grid.Column="1" Click="Button_Click"/>

</Grid>

<TextBlock Name="result" FontSize="28" Margin="12"/>

</StackPanel>

</Grid>

</Page>