WPF - 1.XAML基礎(chǔ)

要

XAML是派生自XML的可擴(kuò)展應(yīng)用程序標(biāo)記語(yǔ)言（Extensible Application Markup Language），由微軟創(chuàng)造。XML是一種可擴(kuò)展標(biāo)記語(yǔ)言，與HTML類(lèi)似，但是它是傳輸數(shù)據(jù)，而非顯示數(shù)據(jù)，XML標(biāo)簽沒(méi)有預(yù)定義，需要自行定義標(biāo)簽WPF（Windows Presentation Foundation）是微軟新一代圖形系統(tǒng)，繪圖技術(shù)的改進(jìn)基于Windows 的用戶(hù)界面框架，屬于.NET Framework 3.0的一部分。由兩個(gè)主要部分組成：引擎和編程框架。

正文

命名空間

xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml——這表示利用x代替XAML的命名空間。用于包含特定的關(guān)鍵字和System.Windows.Markup中類(lèi)型的子集。xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation——另一個(gè)命名空間。映射諸多wpf.net命名空間（system.windows.xxx，是個(gè)一對(duì)多的映射，主要封裝了三個(gè)程序集中，WindowsBase.dll、Presentation.dll和PresentationFramework.dll）

x: 前綴

x:Class='MyXaml.Window1' ——利用class特性指定c#類(lèi)名（后臺(tái)c#代碼） x:Key：為 ResourceDictionary（或其他框架中的類(lèi)似字典概念）中的每個(gè)資源設(shè)置唯一的鍵。在典型的 WPF 應(yīng)用標(biāo)記中的所有 x: 用法中，x:Key 可能占到 90%。 x:Name：處理對(duì)象元素后，為運(yùn)行時(shí)代碼中存在的實(shí)例指定運(yùn)行時(shí)對(duì)象名稱(chēng)。 x:Static：?jiǎn)⒂靡粋€(gè)返回靜態(tài)值的引用，該靜態(tài)值不是與 XAML 兼容的屬性。 x:Type：根據(jù)類(lèi)型名稱(chēng)構(gòu)造 Type 引用。

屬性元素

一般的，我們想要對(duì)一個(gè)標(biāo)簽的屬性賦值，可以直接在標(biāo)簽內(nèi)部鍵入屬性名給其賦值，如我們給button的Content屬性賦值：

<Grid x:Name="grid1">

<tag>  
    <tag.property>   
         value 
     </tag.property>
</tag>

<Button>
            <Button.Content>this is test</Button.Content>
            <Button.Background>
                <SolidColorBrush Color="Red"></SolidColorBrush>
            </Button.Background>
</Button>

集合語(yǔ)法

XAML 語(yǔ)言包含一些優(yōu)化，可以生成更易于閱讀的標(biāo)記。其中一項(xiàng)優(yōu)化是：如果某個(gè)特定屬性采用集合類(lèi)型，則在標(biāo)記中聲明為該屬性的值內(nèi)的子元素的項(xiàng)將成為集合的一部分。在這種情況下，子對(duì)象元素的集合是設(shè)置為集合屬性的值。

<Grid>
    <Grid.Background>
        <LinearGradientBrush>
            <GradientStop Offset="0" Color="Red"></GradientStop>
            <GradientStop Offset="1" Color="Green"></GradientStop>
        </LinearGradientBrush>
    </Grid.Background>
</Grid>

內(nèi)容屬性和集合語(yǔ)法組合

<StackPanel>
    <Button>First Button</Button>
    <Button>Second Button</Button>
    <StackPanel>
        <StackPanel.Children>
            <Button>First Button</Button>
            <Button>Second Button</Button>
        </StackPanel.Children>
    </StackPanel>
</StackPanel>

特性語(yǔ)法（事件）

<Button Content="Button" Click="Button_Click"></Button>

類(lèi)型轉(zhuǎn)換器

Thickness 結(jié)構(gòu)是一個(gè)類(lèi)型示例，該類(lèi)型擁有可使用 XAML 的類(lèi)型轉(zhuǎn)換。 Thickness 指示嵌套矩形中的度量，可用作屬性（如 Margin）的值。通過(guò)對(duì) Thickness 放置類(lèi)型轉(zhuǎn)換器，所有使用 Thickness 的屬性都可以更容易地在 XAML 中指定，因?yàn)樗鼈兛芍付樘匦浴?/p>

<Button Margin="10,20,10,30" Content="Click me"/>
<Button Content="Click me">
    <Button.Margin>
        <Thickness Left="10" Top="20" Right="10" Bottom="30"/>
    </Button.Margin>
</Button>

注意：

XAML是大小寫(xiě)敏感的，所以不能使用<button>代替<Button>，但類(lèi)型轉(zhuǎn)換器通過(guò)不是大小寫(xiě)敏感的，這意味著 Foreground="White" 和 "Foreground="white"具有相同的效果。

WPF中的XAML具有如下自身的特性：
每個(gè)XAML文檔都映射到一個(gè).NET類(lèi)的實(shí)例。元素名將與.NET 類(lèi)名嚴(yán)格的匹配。
在XMl文檔中，可以在一個(gè)元素中嵌套另一個(gè)元素，這種嵌套關(guān)系將會(huì)形成一個(gè)元素的樹(shù)狀結(jié)構(gòu)
可以通過(guò)設(shè)置元素屬性來(lái)為每個(gè)類(lèi)的屬性賦值。XAML提供提供了屬性元素語(yǔ)法來(lái)為復(fù)雜的屬性進(jìn)行賦值。
與XML相似，每個(gè)XAMl文件都只能有一個(gè)根元素，并且必須具有兩個(gè)命名空間

注釋

語(yǔ)法：

只能出現(xiàn)在開(kāi)始標(biāo)簽和結(jié)束標(biāo)簽之間
不能注釋標(biāo)簽的Attribute
注釋不能嵌套

eb與WPF（Windows Presentation Foundation）的融合是一種將兩種技術(shù)結(jié)合起來(lái)的方法，可以實(shí)現(xiàn)雙邊互補(bǔ)，為應(yīng)用程序開(kāi)發(fā)帶來(lái)更豐富的用戶(hù)體驗(yàn)和功能。

Web技術(shù)在跨平臺(tái)、可訪問(wèn)性和用戶(hù)界面的靈活性方面具有明顯的優(yōu)勢(shì)。通過(guò)使用HTML、CSS和JavaScript等技術(shù)，可以輕松地創(chuàng)建具有響應(yīng)式設(shè)計(jì)和適應(yīng)不同設(shè)備的網(wǎng)頁(yè)應(yīng)用。Web應(yīng)用還可以通過(guò)云平臺(tái)進(jìn)行部署和訪問(wèn)，實(shí)現(xiàn)跨平臺(tái)和遠(yuǎn)程協(xié)作的優(yōu)勢(shì)。

而WPF是一種基于Windows操作系統(tǒng)的桌面應(yīng)用程序開(kāi)發(fā)技術(shù)，它提供了豐富的用戶(hù)界面和多媒體功能。WPF應(yīng)用程序可以充分利用Windows操作系統(tǒng)的特性，如窗口管理、本地文件系統(tǒng)訪問(wèn)和硬件加速等。WPF還提供了強(qiáng)大的數(shù)據(jù)綁定和可視化效果，使開(kāi)發(fā)人員能夠創(chuàng)建出具有高度交互性和視覺(jué)吸引力的應(yīng)用程序。

將Web和WPF融合起來(lái)可以實(shí)現(xiàn)雙邊互補(bǔ)的優(yōu)勢(shì)。具體而言，可以通過(guò)以下方式實(shí)現(xiàn)：

嵌入Web內(nèi)容：在WPF應(yīng)用程序中嵌入Web瀏覽器控件，以展示W(wǎng)eb頁(yè)面或運(yùn)行Web應(yīng)用。這樣可以在WPF應(yīng)用程序中輕松集成Web內(nèi)容，例如顯示實(shí)時(shí)數(shù)據(jù)、集成第三方服務(wù)或展示在線媒體。

使用Web技術(shù)擴(kuò)展WPF應(yīng)用：在WPF應(yīng)用程序中使用Web技術(shù)，如HTML、CSS和JavaScript，來(lái)增強(qiáng)用戶(hù)界面和交互性。通過(guò)使用Web技術(shù)，可以實(shí)現(xiàn)更靈活的布局、動(dòng)態(tài)內(nèi)容更新和響應(yīng)式設(shè)計(jì)，以提供更好的用戶(hù)體驗(yàn)。

使用WPF嵌入式瀏覽器控件：在Web應(yīng)用程序中嵌入WPF的嵌入式瀏覽器控件，以利用WPF的功能和特性。這樣可以在Web應(yīng)用程序中使用WPF的強(qiáng)大渲染能力、多媒體支持和數(shù)據(jù)綁定，提供更豐富的用戶(hù)體驗(yàn)。

共享數(shù)據(jù)和狀態(tài)：Web和WPF應(yīng)用程序可以通過(guò)共享數(shù)據(jù)和狀態(tài)來(lái)實(shí)現(xiàn)雙向通信和協(xié)作。通過(guò)使用Web API和WPF應(yīng)用程序之間的數(shù)據(jù)傳輸，可以實(shí)現(xiàn)數(shù)據(jù)的同步和更新，保持應(yīng)用程序之間的一致性。

綜上所述，Web與WPF的融合可以實(shí)現(xiàn)雙邊互補(bǔ)，為應(yīng)用程序開(kāi)發(fā)帶來(lái)更豐富的用戶(hù)體驗(yàn)和功能。通過(guò)合理地結(jié)合Web和WPF技術(shù)，開(kāi)發(fā)人員可以充分發(fā)揮兩者的優(yōu)勢(shì)，創(chuàng)造出更具創(chuàng)新性和吸引力的應(yīng)用程序。

源WPF控件庫(kù)推薦：ModernWpf

ModernWpf倉(cāng)庫(kù)信息

站長(zhǎng)從博客園林德熙處了解到此控件庫(kù)，通過(guò)clone、編譯、運(yùn)行，發(fā)現(xiàn)這庫(kù)確實(shí)不錯(cuò)，正如林德熙所言：“有十分漂亮的界面，整個(gè)都是 Win10 風(fēng)，界面部分和默認(rèn) UWP 相近，這個(gè)庫(kù)支持了 .NET Framework 4.5 和以上的版本，以及 .NET Core 3.0 和以上的版本，可以在 Windows Vista SP2 和以上的系統(tǒng)運(yùn)行。” 本人遂從該倉(cāng)庫(kù)中將readme搬運(yùn)過(guò)來(lái)，希望讓更多人知道有這個(gè)庫(kù)的存在，能給WPF開(kāi)發(fā)者多一個(gè)UI庫(kù)選擇。

白色主題

快速開(kāi)始

創(chuàng)建一個(gè)WPF應(yīng)用
從NuGet中安裝包 ModernWpfUI.
編輯 App.xaml:

代碼語(yǔ)言：javascript

復(fù)制

<Application
    ...
    xmlns:ui="http://schemas.modernwpf.com/2019">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ui:ThemeResources />
                <ui:XamlControlsResources />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

編輯 MainWindow.xaml:

代碼語(yǔ)言：javascript

復(fù)制

<Window
    ...
    xmlns:ui="http://schemas.modernwpf.com/2019"
    ui:WindowHelper.UseModernWindowStyle="True">
    <ui:SimpleStackPanel Margin="12" Spacing="24">
        <TextBlock Text="My first ModernWPF app" Style="{StaticResource HeaderTextBlockStyle}" />
        <Button Content="I am a button" />
        <Button Content="I am an accent button" Style="{StaticResource AccentButtonStyle}" />
    </ui:SimpleStackPanel>
</Window>

部分截圖

黑色主題

ControlPalette1

Nighttime

NumberBox

ContentDialog

DataGrid

ItemsRepeater

CustomTitleBar.Dark

Calendar

Progress

ColorRamp

AccentColorPalette

HighContrast.png

其他控件庫(kù)介紹：

國(guó)內(nèi)開(kāi)源C# WPF控件庫(kù)Panuon.UI.Silver推薦
《Dotnet9》系列-開(kāi)源C# WPF控件庫(kù)3《HandyControl》強(qiáng)力推薦
（四）開(kāi)源C# WPF控件庫(kù)《AduSkin – UI》

在線咨詢(xún)

上一篇：這款CSS按鈕庫(kù)太漂亮了，以后就用她了
下一篇：國(guó)產(chǎn)免費(fèi)、開(kāi)源的基于聊天（IM）的協(xié)同辦公系統(tǒng)搭建

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫(xiě)需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營(yíng)銷(xiāo)服務(wù)商

WPF - 1.XAML基礎(chǔ)

源WPF控件庫(kù)推薦：ModernWpf

快速開(kāi)始

部分截圖

您的項(xiàng)目需求