基本樣式設置
Style 設置指定對象的屬性
屬性:
TargetType 引用在哪個類型上面,例如Button、Textblock。。
如果在控件對象里面設置Style,則TargetType必須指定當前控件名
只在作用域里面有效果,其他的相同控件沒有影響,作用域類似于C#中的大括號
Setters 集合 設置屬性的集合 可以省略
原理就是反射,根劇控件的屬性進行設置值,反射到控件屬性
設置的屬性 優先使用控件上的指定屬性,控件屬性>Style屬性
Property 屬性
Value 屬性的值
Triggers 集合 觸發器 監聽 不可以省略
Property 監聽的屬性
Value 當監聽的屬性 == 這個Value的時候 執行以下方法 在下方寫滿足之后的方法 Trigger.Setters(此時的Setters也可以省略)
<Button><Button.Style><Style TargetType="Button"><!--<Style.Setters> 可以省略--><Style.Setters><Setter Property="Content" Value="Btn"/><Setter Property="FontSize" Value="50"/><Setter Property="Height" Value="100"/><Setter Property="Width" Value="200"/><Setter Property="Background" Value="Orange"/></Style.Setters></Style></Button.Style>
</Button>
<Style.Triggers><Trigger Property="Background" Value="Orange"><!--滿足條件執行--><!--<Trigger.Setters> 可以省略--><Trigger.Setters><Setter Property="Content" Value="被Trigger改變了"/></Trigger.Setters></Trigger>
</Style.Triggers>
由此可以看到我們按鈕的Content被觸發器給修改了
樣式觸發器設置
樣式觸發器:根據用戶行為,改變控件外觀
MultiTrigger 多重條件
需求:當需要多個條件一起才能觸發的時候,使用
<MultiTrigger><MultiTrigger.Conditions><Condition Property="Background" Value="Orange"/><Condition Property="Content" Value="Btn"/></MultiTrigger.Conditions><!--兩個都滿足才會觸發--><!--<MultiTrigger.Setters> 可以省略--><MultiTrigger.Setters><Setter Property="Foreground" Value="Green"/></MultiTrigger.Setters>
</MultiTrigger>
還是上面的圖為案例代碼:
EventTrigger 事件觸發
需求:當需要點擊獲取鼠標等事件觸發的時候,使用此方法
此方法僅可以使用動畫去變化,不可以直接Setter
<!--必須設置路由事件 RoutedEvent-->
<EventTrigger RoutedEvent="MouseMove"><BeginStoryboard><Storyboard><DoubleAnimation Duration="0:0:0.5" To="200"Storyboard.TargetProperty="Width" /><DoubleAnimation Duration="0:0:0.5" To="400"Storyboard.TargetProperty="Height" /></Storyboard></BeginStoryboard>
</EventTrigger>
當我鼠標進入的時候,變成這個樣子:觸發生效
補充
需求:我需要鼠標進入的時候變大,鼠標出去的時候正常大小
利用觸發器觸發和離開的方法
<Trigger Property="IsMouseOver" Value="True"><!--EnterActions 開始觸發--><Trigger.EnterActions><BeginStoryboard><Storyboard><DoubleAnimation Duration="0:0:0.5" To="400"Storyboard.TargetProperty="Width"/><DoubleAnimation Duration="0:0:0.5" To="400"Storyboard.TargetProperty="Height"/></Storyboard></BeginStoryboard></Trigger.EnterActions><!--ExitActions 退出觸發--><Trigger.ExitActions><BeginStoryboard><Storyboard><DoubleAnimation Duration="0:0:0.5" To="200"Storyboard.TargetProperty="Width"/><DoubleAnimation Duration="0:0:0.5" To="100"Storyboard.TargetProperty="Height"/></Storyboard></BeginStoryboard></Trigger.ExitActions>
</Trigger>
鼠標進入:
鼠標離開:
注意:觸發器的渲染是從上至下,同樣的觸發下面的動作會覆蓋上面的動作。
訪問級別
越接近對象,級別越高
樣式繼承
BasedOn: 繼承父樣式
樣式繼承必須單獨寫在資源里面
SunBtn樣式中只寫了前景色,因為繼承了PreBtn的樣式,所以長寬背景色都繼承了。
<Window.Resources><Style TargetType="Button" x:Key="preStyle"><Setter Property="Height" Value="80"/><Setter Property="Width" Value="200"/><Setter Property="Background" Value="Orange"/></Style><Style TargetType="Button" x:Key="sunStyle" BasedOn="{StaticResource preStyle}"><Setter Property="Foreground" Value="Red"/></Style>
</Window.Resources>
<StackPanel><Button Content="PreBtn" Style="{StaticResource preStyle}" /><Button Content="SunBtrn" Style="{StaticResource sunStyle}"/>
</StackPanel>
注意:可以多層次繼承和C#中的類一樣,但是不可以繼承多個。
優先級,自己的大于繼承的,自己沒有找繼承。總結:越接近對象,級別越高