當(dāng)前位置：首頁 > 编程语言 > asp.net >内容正文

asp.net

从0 开始 WPF MVVM 企业级框架实现与说明 ---- 第五讲 WPF中 Style

發(fā)布時間：2025/4/14 asp.net 52 豆豆

生活随笔收集整理的這篇文章主要介紹了从0 开始 WPF MVVM 企业级框架实现与说明 ---- 第五讲 WPF中 Style 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

Style這個東西幾乎是無處不在，這個類似于web開發(fā)中的css樣式，想要做一個很豐富的UI，這個東西是必不可少的，我也不是專業(yè)的UI開發(fā)者，這邊只能介紹Style在WPF中的用法

下面有一個下載地址，這個demo還可以供初學(xué)者學(xué)習(xí)

Style基本用法：

在WPF中我們可以使用Style來設(shè)置控件的某些屬性值，并使該設(shè)置影響到指定范圍內(nèi)的所有該類控件或影響指定的某一控件，比如說我們想將窗口中的所有按鈕都保持某一種風(fēng)格，那么我們可以設(shè)置一個Style，而不必分別設(shè)置每個按鈕的風(fēng)格。

Style是作為一種資源被保存下來的. 看下面的例子：

?<Window.Resources>???
????<Style?TargetType="Button">
??????<Setter?Property="Foreground"??Value="Blue"/>
??????<Setter?Property="FontFamily?"?Value="CourierNew"/>
????</Style>??????
?</Window.Resources>

我們聲明了一個Style，它被聲明在Window.Resources中說明它的有效范圍是當(dāng)前窗體，TargetType="Button"?指示該Style的作用對象是Button類的實例，也就是說在當(dāng)前窗體中的所有Button實例都將受到該Style的影響（除非某Button有明確地指明它所使用的是另外的Style）。
<Setter?Property="Foreground"??Value="Blue"/>?這里的Setter是一個設(shè)置器，用來設(shè)置該Style要對TargetType的那些屬性或?qū)ο筮M(jìn)行設(shè)置，我們這里設(shè)置的是Button的Foreground屬性，將其值設(shè)置為Blue，同理，我們將Button的FontFamily屬性設(shè)置為CourierNew

這樣一來，在默認(rèn)情況下，被加載到窗口中的所有Button對象都將受到這個Style的影響，從而文本變成統(tǒng)一的藍(lán)色CourierNew字體。
你可以粘貼以下代碼到XamlPad中查看效果:

接下來很容易想到的一個問題是，想上述代碼的強(qiáng)制窗口的所有按鈕都受聲明的Style的影響是不是有點強(qiáng)奸民意，如果我只想我定義的Style影響指定的Button對象而不是所有的Button對象應(yīng)該怎么辦呢？
參考以下代碼：我們?yōu)镾tyle添加一個x:Key="ButtonStyle"

??<Window.Resources>
????
????<Style?TargetType="Button"?x:Key="ButtonStyle">
??????<Setter?Property="Foreground"??Value="Blue"/>
??????<Setter?Property="FontFamily?"?Value="CourierNew"/>
????</Style>
????????
??</Window.Resources>

然后我們使用Button的Style屬性來指定該Button所要使用的Style，而其他沒有將我們聲明的Style指定為其樣式的按鈕將不受到該Style的影響。

<Button>normal?button</Button>
<Button?Style="{StaticResource?ButtonStyle}">styled?button</Button>

這樣就很好的解決了Style強(qiáng)制影響每個Button的問題，你可以粘貼以下代碼到XamlPad中查看效果:

<Window?
????xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
????xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
????Title="StyleDemo"?Height="417"?Width="579"
????>
??
??
??<Window.Resources>???
????<Style?TargetType="Button"?x:Key="ButtonStyle">
??????<Setter?Property="Foreground"??Value="Blue"/>
??????<Setter?Property="FontFamily?"?Value="CourierNew"/>
????</Style>????
??</Window.Resources>
??
??
????<Grid?ShowGridLines="True">
??????
??????<Grid.ColumnDefinitions>
????????<ColumnDefinition??Width="50*"/>
????????<ColumnDefinition?Width="50*"?/>
??????</Grid.ColumnDefinitions>
??????<Grid.RowDefinitions>
????????<RowDefinition??Height="25*"/>
????????<RowDefinition??Height="25*"/>
????????<RowDefinition??Height="25*"/>
??????</Grid.RowDefinitions>

??????<Button?Grid.Column="0"?Grid.ColumnSpan="1"?Grid.Row="0"?Grid.RowSpan="1">normal?button</Button>
??????<Button?Grid.Column="1"?Grid.ColumnSpan="1"?Grid.Row="1"?Grid.RowSpan="1"?Style="{StaticResource?ButtonStyle}">styled?button1</Button>
??????<Button?Grid.Column="0"?Grid.ColumnSpan="1"?Grid.Row="2"?Grid.RowSpan="1"?Style="{StaticResource?ButtonStyle}">styled?button2</Button>
????
????</Grid>
??
</Window>

為了讓我們的Style對外界的交互做出外觀上的相應(yīng)，比如當(dāng)鼠標(biāo)按下時藍(lán)色的文本變成紅色，當(dāng)鼠標(biāo)松開時文本又恢復(fù)藍(lán)色，我們可以在Style中添加Trigger（觸發(fā)器），除此之外，與類的繼承原理相類似，我們還可以使用BaseOn來使一個Style“繼承”另一個Style。
參考以下代碼：

?<Window.Resources>
????
????<Style?TargetType="Button"?x:Key="ButtonStyle">
??????<Setter?Property="Foreground"??Value="Blue"/>
??????<Setter?Property="FontFamily?"?Value="CourierNew"/>
????</Style>
????
????<Style?TargetType="Button"?x:Key="TriggerButtonStyle"?BasedOn="{StaticResource?ButtonStyle}">
??????<Style.Triggers>
????????<Trigger??Property="IsPressed"?Value="True">
??????????<Setter?Property="Foreground"?Value="Red"/>
????????</Trigger>
??????</Style.Triggers>
????</Style>
????
??</Window.Resources>

我們所聲明的第二個Style，即TriggerButtonStyle，它“繼承”于ButtonStyle，那么TriggerButtonStyle將會從ButtonStyle那里得到藍(lán)色CourierNew文本的性質(zhì)。然后我們使用了Trigger來響應(yīng)鼠標(biāo)按下，??<Trigger??Property="IsPressed"?Value="True">?表示當(dāng)Button的IsPressed屬性值變?yōu)門rue的時候，將做如下設(shè)置<Setter?Property="Foreground"?Value="Red"/>，即將Button的Foreground屬性設(shè)置為Red。這里有一個隱含的意思是：當(dāng)當(dāng)Button的IsPressed屬性值變?yōu)镕alse的時候，Foreground屬性將恢復(fù)原值。
你可以粘貼以下代碼到XamlPad中查看效果:

<Window?
????xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
????xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
????Title="StyleDemo"?Height="417"?Width="579"
????>
??
??
??<Window.Resources>
????
????<Style?TargetType="Button"?x:Key="ButtonStyle">
??????<Setter?Property="Foreground"??Value="Blue"/>
??????<Setter?Property="FontFamily?"?Value="CourierNew"/>
????</Style>
????
????<Style?TargetType="Button"?x:Key="TriggerButtonStyle"?BasedOn="{StaticResource?ButtonStyle}">
??????<Style.Triggers>
????????<Trigger??Property="IsPressed"?Value="True">
??????????<Setter?Property="Foreground"?Value="Red"/>
????????</Trigger>
??????</Style.Triggers>
????</Style>
????
??</Window.Resources>
??
??
????<Grid?ShowGridLines="True">
??????
??????<Grid.ColumnDefinitions>
????????<ColumnDefinition??Width="50*"/>
????????<ColumnDefinition?Width="50*"?/>
??????</Grid.ColumnDefinitions>
??????<Grid.RowDefinitions>
????????<RowDefinition??Height="25*"/>
????????<RowDefinition??Height="25*"/>
????????<RowDefinition??Height="25*"/>
??????</Grid.RowDefinitions>

??????<Button?Grid.Column="0"?Grid.ColumnSpan="1"?Grid.Row="0"?Grid.RowSpan="1">normal?button</Button>
??????<Button?Grid.Column="1"?Grid.ColumnSpan="1"?Grid.Row="1"?Grid.RowSpan="1"?Style="{StaticResource?ButtonStyle}">styled?button</Button>
??????<Button?Grid.Column="0"?Grid.ColumnSpan="1"?Grid.Row="2"?Grid.RowSpan="1"?Style="{StaticResource?TriggerButtonStyle}">trigger?button</Button>
????
????</Grid>
??
</Window> 下載kaxaml 參考：?http://www.cnblogs.com/zhouyinhui/archive/2007/03/27/690431.html

轉(zhuǎn)載于:https://www.cnblogs.com/hwy425/p/4974149.html

總結(jié)

以上是生活随笔為你收集整理的从0 开始 WPF MVVM 企业级框架实现与说明 ---- 第五讲 WPF中 Style的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。

上一篇： win7访问windows server
下一篇： Ext.Net学习笔记19：Ext.Ne