WPF XAML

XAML (Extensible Application Markup Language) 可擴(kuò)展應(yīng)用程序標(biāo)記語言是一種基于 XML 的標(biāo)記語言易茬，以聲明形式實現(xiàn)應(yīng)用程序的外觀。 通常用它創(chuàng)建窗口、對話框萎羔、頁和用戶控件，并填充控件、形狀和圖形试疙，且自身即可實現(xiàn)動畫效果(通過blend生成XAML)。
XAML中每個標(biāo)簽在運行時都會創(chuàng)建一個實例抠蚣。 例如祝旷， Window 元素被轉(zhuǎn)換為 Window 類的實例，該類的 Title 屬性是 Title 特性的值嘶窄。

命名空間 xmlns (XML Namespace)

xmlns[:自定義映射名] = "對應(yīng)的命名空間"

例如想引入類庫文件MyClass.dll中的命名空間ABC怀跛，則

xmlns:abc="clr-namespace:ABC;assembly=MyClass"
//效果類似于 using ABC = abc;

用于聲明命名空間，如下<Window>和<Grid>均屬于xmlns聲明的默認(rèn)命名空間柄冲，x:Class中的內(nèi)容則屬于xmlns:x聲明的命名空間吻谋。其中配置的內(nèi)容并非網(wǎng)址，而是一個XAML內(nèi)置的一個對應(yīng)關(guān)系现横，該內(nèi)容對應(yīng)了多個命名空間漓拾。
通過在AssemblyInfo.cs中添加[assembly:xmlnsDefinition("www.xxx.com","wpfLibrary")]也可以將自己的網(wǎng)址設(shè)置成一個命名空間的對應(yīng)。

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

經(jīng)過聲明的命名空間下的類可以直接作為標(biāo)簽被使用

<abc:Tab>...</abc:Tab>

為XAML的對象屬性賦值

  1. 使用字符串進(jìn)行簡單賦值
<Rectangle Grid.ColumnSpan="2" Fill="#F00" HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="100"/>
  1. 使用屬性元素進(jìn)行復(fù)雜賦值
    當(dāng)屬性是復(fù)雜對象時有優(yōu)勢
<Rectangle Grid.ColumnSpan="2" HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="100">
  <Rectangle.Fill>
    <SolidColorBrush Color="#F0F"/>
  </Rectangle.Fill>
</Rectangle>
  1. 標(biāo)記擴(kuò)展
    通過"{Binding XXX=XXX}"的方式將TextBox的屬性依賴在Slider的Value上
<Slider Name="slider1"  Height="30" Width="100"/>
<TextBox Text="{Binding ElementName=slider1,Path=Value,Mode=OneWay}"  Height="30" TextWrapping="Wrap" Width="100"/>

或改用屬性元素

<TextBox Text="{Binding ElementName=slider1,Path=Value,Mode=OneWay}"  Height="30" TextWrapping="Wrap" Width="100">
  <TextBox.Text>
    <Binding ElementName=slider1,Path=Value,Mode=OneWay>
  </TextBox.Text>
</TextBox>

X名稱空間中的屬性

x:Class

x:Class本身不是對象的成員戒祠，而是從x命名空間中拿出來硬貼上去的骇两，且只能用于根節(jié)點
擁有x:Class的標(biāo)簽會自動解析為一個類名為x:Class的值的partial類(稱為代碼隱藏類)，其嵌套的標(biāo)簽會被解析為其派生類姜盈，編譯時會和.cs文件中的同名partial類合并脯颜。
擁有x:Class 的標(biāo)簽解析后的類自動擁有InitializeComponent方法，用于初始化窗體組件贩据，將標(biāo)記中定義的 UI 與代碼隱藏類合并在一起。

通過Name屬性在.cs中獲取xaml中對應(yīng)元素闸餐。

  • x:ClassModifier
    只能給有x:Class屬性的標(biāo)簽添加饱亮，用于設(shè)置該類的訪問權(quán)限
x:Name

通常可與Name互換舍沙。
當(dāng)一個標(biāo)簽具有x:Name時近上，除了生成對應(yīng)實例外還會為這個實例聲明一個引用變量，變量名即x:Name的值

  • x:FieldModifier
    擁有x:Name的XAML標(biāo)簽實例拂铡，訪問權(quán)限默認(rèn)為internal壹无。通過x:FieldModifier可以設(shè)置為public等葱绒。
x:Key 與 資源

為資源字典貼上用于檢索的索引。

<Window xmlns:sys="clr-namespace:System;assembly=mscorlib">
  <Window.Resources>
    <sys:String x:Key="myString">hello this is String</sys:String> 
  </Window.Resources>
  <TextBox Text="{StaticResource ResourceKey=myString}"/>
</Window>

在方法中也能獲取資源

String myString = this.FindResource("myString") as String;
  • x:Shared
    若為true斗锭，每次通過x:Key獲取的是同一個對象地淀，否則為一個新的副本。默認(rèn)為true岖是。

x名稱空間中的標(biāo)記擴(kuò)展

x:Type帮毁，x:Null 與 Style

當(dāng)需要指定某值為null時使用x:Null
如已經(jīng)指定了所有Button的Style，但有一個不需采用該Style時

<Window.Resources>
  <Style TargetType="{x:Type Button}">
    <Setter Property="Width" Value="50"></Setter>
  </Style>   
</Window.Resources>
<Button Style="{x:Null}"/>
x:Static

在XAML中直接使用類的static成員

<Button Content="{x:Static local:MainWindow.ButtonContent}"/>
...
public static string ButtonContent= "Click Me";
x:Array 與 ListBox

x:Array用于暴露一個指定類型的ArrayList/List實例

<ListBox>
  <ListBoxItem>1</ListBoxItem>
  <ListBoxItem>2</ListBoxItem>
</ListBox>

等價于

<ListBox Name="listbox"></ListBox>
...
listbox.ItemsSource = new List<string>(new []{"1","2"});

等價于

<ListBox>
  <ListBox.ItemsSource>
    <x:Array Type="sys:String">
      <sys:String>1</sys:String>
      <sys:String>2</sys:String>
    </x:Array>
  </ListBox.ItemsSource>
</ListBox>

控件與布局

有些控件的內(nèi)容是一個集合豺撑，如StackPanel的內(nèi)容屬性是Children烈疚，ListBox的內(nèi)容屬性是Items，當(dāng)通過屬性元素賦值時可以省略該內(nèi)容屬性的標(biāo)簽聪轿。

ContentControl基類

包括Window , ScrollViewer爷肝，各種Button，CheckBox等

  • 均具有內(nèi)容屬性Content
  • 內(nèi)部最多只能包含一個元素
Button

表示 Windows 按鈕控件陆错，該按鈕對 Click 事件作出反應(yīng)

  • Click 綁定事件
  • ClickMode 觸發(fā)方式
    • Hover => mouseover
    • Press => mousedown
    • Release => mouseup

ItemsControl 基類

包括Menu , ContextMenu灯抛，ComboBox，ListBox危号，TabControl等

  • 內(nèi)容屬性為Items或ItemsSource
  • 內(nèi)容應(yīng)為一個集合牧愁，且會自動被對應(yīng)的條目容器進(jìn)行包裝
    如ListBox的條目容器為ListBoxItem，因此以下兩種寫法等效
<ListBox>
  <Button Content="Click Me"/>
</ListBox>

<ListBox>
  <ListBoxItem>
    <Button Content="Click Me"/>
  </ListBoxItem>
</ListBox>
  • DisplayMemberPath 屬性
    規(guī)定展示數(shù)組中每個對象的某個屬性

TextBlock 和 TextBox

用于文本展示

  • TextBlock
    具有豐富的格式/排版控制
    內(nèi)容屬性為Inlines
  • TextBox
    支持用戶自己編輯
    內(nèi)容屬性為Text

Panel基類與UI布局

內(nèi)容屬性均為Children

Grid 網(wǎng)格

類似Table外莲，適用于行列對齊等
默認(rèn)ColumnDefinition擁有Width="1*"猪半，RowDefinition擁有Height="1*"

  • 取值若為px，px可省略
  • 若為Auto偷线，則由其內(nèi)容撐開磨确，無內(nèi)容則不占空間(可用Min-Width/Min-Height設(shè)置最小值)
  • 若為*，則由剩余空間按值分配(類似于flex的伸縮占比)
<Grid Name="myGrid">
  <Grid.ColumnDefinitions>
    <ColumnDefinition></ColumnDefinition>
    <ColumnDefinition></ColumnDefinition>
  </Grid.ColumnDefinitions>
  <Grid.RowDefinitions>
    <RowDefinition Height="100px"></RowDefinition>
    <RowDefinition></RowDefinition>
    <RowDefinition Height="Auto"></RowDefinition>
  </Grid.RowDefinitions>
  <TextBlock Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="1">hello</TextBlock>
</Grid>
...
myGrid.ColumnDefinitions.Add(new ColumnDefinition());
StackPanel

類似<div style="display:flex;"></div>

  • Orientation 元素排列方式
    Horizontal/Vertical
  • HorizontalAlignment 元素對齊方式
    Left/Center/Right/Stretch
  • VerticalAlignment 元素對齊方式
    Top/Center/Bottom/Stretch
Canvas

類似<div style="position:absolute;"></div>
其中的每個標(biāo)簽通過設(shè)置Canvas.Left和Canvas.Top屬性來確定位置

DockPanel

內(nèi)部元素通過DockPanel.Dock選擇泊靠方向(類似浮動声邦，但具有四個方向)

  • 最后一個子元素的DockPanel.Dock會被忽略乏奥，將盡量撐滿整個DockPanel(可通過設(shè)置LastChildFill="false"禁用該功能)
<DockPanel>
    <TextBox BorderBrush="Blue" Height="100" DockPanel.Dock="Top">1</TextBox>
    <TextBox BorderBrush="Blue" Width="100" DockPanel.Dock="Left">2</TextBox>
    <TextBox BorderBrush="Blue">3</TextBox>
</DockPanel>
WrapPanel

流式布局，排滿一行自動換行(類似子元素全為inline-block)
通過HorizontalAlignment和VerticalAlignment可以設(shè)置子元素整體在WrapPanel中的位置(不影響子元素間的相對位置關(guān)系)

<WrapPanel HorizontalAlignment="Right" VerticalAlignment="Center">
    <TextBox BorderBrush="Red" Width="100" Height="100">1</TextBox>
    <TextBox BorderBrush="Red" Width="100" Height="100">2</TextBox>
    <TextBox BorderBrush="Red" Width="100" Height="100">3</TextBox>
    <TextBox BorderBrush="Red" Width="100" Height="100">4</TextBox>
    <TextBox BorderBrush="Red" Width="100" Height="100">5</TextBox>
</WrapPanel>

動態(tài)修改XAML

Grid grid = new Grid();
grid.ColumnDefinitions.Add(new ColumnDefinition());
grid.ColumnDefinitions.Add(new ColumnDefinition());
grid.ColumnDefinitions.Add(new ColumnDefinition());
grid.RowDefinitions.Add(new RowDefinition());
grid.RowDefinitions.Add(new RowDefinition());
grid.RowDefinitions.Add(new RowDefinition());

Button button = new Button() { Content="hello"};
Grid.SetColumn(button, 1);
Grid.SetRow(button, 1);

grid.Children.Add(button);
Content = grid;

事件處理器

一個XAML標(biāo)簽對應(yīng)一個對象亥曹，標(biāo)簽的一部分屬性對應(yīng)對象的屬性邓了，另一部分則對應(yīng)對象的事件。如:

<Button Name="button" Click="Button_Click"/>

約等于

private void Button_Click(object sender, RoutedEventArgs e){}
Button button = new Button();
button.click+=new RoutedEventHandler(Button_Click);

在事件中獲取對象可以直接使用x:Name的值媳瞪，也可以使用形參中的sender(即為事件的綁定者)骗炉，配合.Children[0]等選取標(biāo)簽。

定位

  • Margin
    按照左上右下依次定義蛇受，默認(rèn)為"0,0,0,0"
  • HorizontalAlignment
    水平定位句葵，決定了Margin優(yōu)先用左右哪個值，默認(rèn)為"Left"
  • VerticalAlignment
    垂直定位，決定了Margin優(yōu)先用上下哪個值乍丈，默認(rèn)為"Top"
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 人面猴
    序言：七十年代末剂碴，一起剝皮案震驚了整個濱河市，隨后出現(xiàn)的幾起案子轻专，更是在濱河造成了極大的恐慌忆矛，老刑警劉巖，帶你破解...
    沈念sama閱讀 211,639評論 6贊 492
  • 死咒
    序言：濱河連續(xù)發(fā)生了三起死亡事件铭若，死亡現(xiàn)場離奇詭異洪碳，居然都是意外死亡，警方通過查閱死者的電腦和手機(jī)叼屠，發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,277評論 3贊 385
  • 救了他兩次的神仙讓他今天三更去死
    文/潘曉璐 我一進(jìn)店門瞳腌，熙熙樓的掌柜王于貴愁眉苦臉地迎上來，“玉大人镜雨，你說我怎么就攤上這事嫂侍。” “怎么了荚坞？”我有些...
    開封第一講書人閱讀 157,221評論 0贊 348
  • 道士緝兇錄：失蹤的賣姜人
    文/不壞的土叔 我叫張陵挑宠，是天一觀的道長。 經(jīng)常有香客問我颓影，道長各淀，這世上最難降的妖魔是什么？ 我笑而不...
    開封第一講書人閱讀 56,474評論 1贊 283
  • ?港島之戀（遺憾婚禮）
    正文 為了忘掉前任诡挂，我火速辦了婚禮碎浇，結(jié)果婚禮上，老公的妹妹穿的比我還像新娘璃俗。我一直安慰自己奴璃，他們只是感情好，可當(dāng)我...
    茶點故事閱讀 65,570評論 6贊 386
  • 惡毒庶女頂嫁案：這布局不是一般人想出來的
    文/花漫 我一把揭開白布城豁。 她就那樣靜靜地躺著苟穆，像睡著了一般。 火紅的嫁衣襯著肌膚如雪唱星。 梳的紋絲不亂的頭發(fā)上雳旅，一...
    開封第一講書人閱讀 49,816評論 1贊 290
  • 城市分裂傳說
    那天，我揣著相機(jī)與錄音间聊，去河邊找鬼岭辣。 笑死，一個胖子當(dāng)著我的面吹牛甸饱，可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播，決...
    沈念sama閱讀 38,957評論 3贊 408
  • 雙鴛鴦連環(huán)套：你想象不到人心有多黑
    文/蒼蘭香墨 我猛地睜開眼叹话，長吁一口氣：“原來是場噩夢啊……” “哼偷遗！你這毒婦竟也來了？” 一聲冷哼從身側(cè)響起驼壶，我...
    開封第一講書人閱讀 37,718評論 0贊 266
  • 萬榮殺人案實錄
    序言：老撾萬榮一對情侶失蹤氏豌，失蹤者是張志新（化名）和其女友劉穎，沒想到半個月后热凹，有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體泵喘，經(jīng)...
    沈念sama閱讀 44,176評論 1贊 303
  • ?護(hù)林員之死
    正文 獨居荒郊野嶺守林人離奇死亡，尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,511評論 2贊 327
  • ?白月光啟示錄
    正文 我和宋清朗相戀三年般妙，在試婚紗的時候發(fā)現(xiàn)自己被綠了纪铺。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,646評論 1贊 340
  • 活死人
    序言：一個原本活蹦亂跳的男人離奇死亡碟渺，死狀恐怖鲜锚，靈堂內(nèi)的尸體忽然破棺而出，到底是詐尸還是另有隱情苫拍，我是刑警寧澤芜繁，帶...
    沈念sama閱讀 34,322評論 4贊 330
  • ?日本核電站爆炸內(nèi)幕
    正文 年R本政府宣布，位于F島的核電站绒极，受9級特大地震影響骏令，放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜垄提，卻給世界環(huán)境...
    茶點故事閱讀 39,934評論 3贊 313
  • 男人毒藥：我在死后第九天來索命
    文/蒙蒙 一榔袋、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧塔淤，春花似錦摘昌、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,755評論 0贊 21
  • 一樁弒父案聪黎，背后竟有這般陰謀
    文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至备恤，卻和暖如春稿饰，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背露泊。 一陣腳步聲響...
    開封第一講書人閱讀 31,987評論 1贊 266
  • 情欲美人皮
    我被黑心中介騙來泰國打工喉镰， 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留，地道東北人惭笑。 一個月前我還...
    沈念sama閱讀 46,358評論 2贊 360
  • 代替公主和親
    正文 我出身青樓侣姆，卻偏偏與公主長得像生真，于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子捺宗，可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,514評論 2贊 348

推薦閱讀更多精彩內(nèi)容