WPF自定義Expander控件樣式實(shí)現(xiàn)酷炫Style
更新時(shí)間：2022年01月28日 10:53:43 作者：痕跡g
這篇文章介紹了WPF自定義Expander控件樣式實(shí)現(xiàn)酷炫Style的方法，文中通過示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
首先, 看一下效果圖。
實(shí)現(xiàn)思路
1.PS處理兩張選中得特效背景, 一張為主選擇得效果圖, 另外一張為次選擇項(xiàng)得效果圖。
圖片資源定義
<!--靜態(tài)資源-->
<ImageBrush x:Key="leftImage" ImageSource="/IndustrialMaterials;component/images/leftImage.png"/>
<ImageBrush x:Key="leftImageSub" ImageSource="/IndustrialMaterials;component/images/leftImageSub.png"/>
<ImageBrush x:Key="topImage" ImageSource="/IndustrialMaterials;component/images/topImage.png"/>ToggleButton樣式實(shí)現(xiàn):
- 1.自定義Expander樣式, Expander樣式模板中, 主要分為兩個(gè)部分, 1.ToggleButton 2.ContentPresenter
- 2.ToogleButton主要通過IsChecked進(jìn)行觸發(fā)器控制設(shè)置Background, 以下代碼:
<!--下拉列表樣式-->
<Style x:Key="ToggleButtonStyle" TargetType="{x:Type ToggleButton}">
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="Height" Value="80" />
<Setter Property="HorizontalContentAlignment" Value="Right"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="10 10"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Grid>
<Border x:Name="border2" Background="{TemplateBinding Background}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" Value="#FFd2e7f4" />
</Trigger>
<Trigger Property="IsChecked" Value="true">
<Setter Property="Background" TargetName="border2" Value="{StaticResource ResourceKey=leftImage}"/>
</Trigger>
<Trigger Property="IsChecked" Value="false">
<Setter Property="Background" TargetName="border2" Value="#191E36"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="White"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>Expander樣式實(shí)現(xiàn)
<Style x:Key="ExpanderStyle" TargetType="{x:Type Expander}">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Expander}">
<DockPanel>
<ToggleButton x:Name="HeaderSite" ContentTemplate="{TemplateBinding HeaderTemplate}"
ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}"
Content="{TemplateBinding Header}" DockPanel.Dock="Top"
Foreground="{TemplateBinding Foreground}"
FontWeight="{TemplateBinding FontWeight}"
FontStyle="{TemplateBinding FontStyle}" FontStretch="{TemplateBinding FontStretch}"
FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource
TemplatedParent}}" Margin="1" MinWidth="0" MinHeight="0" Padding="{TemplateBinding Padding}"
Style="{StaticResource ToggleButtonStyle}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
<ContentPresenter x:Name="ExpandSite" DockPanel.Dock="Left" Focusable="false"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}" Visibility="Collapsed"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</DockPanel>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="true">
<Setter Property="Visibility" TargetName="ExpandSite" Value="Visible"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>Expander引用樣式部分代碼:
到此這篇關(guān)于WPF自定義Expander控件樣式實(shí)現(xiàn)酷炫Style的文章就介紹到這了。希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
在asp.net中實(shí)現(xiàn)datagrid checkbox 全選的方法
在asp.net中實(shí)現(xiàn)datagrid checkbox 全選的方法...2006-12-12
asp.net DropDownList實(shí)現(xiàn)二級(jí)聯(lián)動(dòng)效果
這篇文章主要介紹了asp.net DroDownList實(shí)現(xiàn)二級(jí)聯(lián)動(dòng)效果的相關(guān)資料,需要的朋友可以參考下2016-02-02
ASP.Net中利用CSS實(shí)現(xiàn)多界面的兩種方法
這篇文章主要介紹了ASP.Net中利用CSS實(shí)現(xiàn)多界面的兩種方法,包括動(dòng)態(tài)加載css樣式與動(dòng)態(tài)設(shè)置頁(yè)面同類控件的方法來(lái)實(shí)現(xiàn)該功能,是非常具有實(shí)用價(jià)值的技巧,需要的朋友可以參考下2014-12-12
這篇文章介紹了AutoMapper實(shí)體映射的基本用法，文中通過示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-03-03
ASP.NET Core設(shè)置URLs的方法匯總(完美解決.NET 6項(xiàng)目局域網(wǎng)IP地址遠(yuǎn)程無(wú)法訪問的
近期在dotnet項(xiàng)目中遇到這樣的問題.net6 運(yùn)行以后無(wú)法通過局域網(wǎng)IP地址遠(yuǎn)程訪問,整理出解決問題的五種方式方法,感興趣的朋友一起看看吧2023-11-11
這篇文章主要為大家詳細(xì)介紹了ASP.NET MVC文件上傳第二篇教程，再次深入了解ASP.NET MVC文件上傳的實(shí)現(xiàn)原理，感興趣的小伙伴們可以參考一下2016-05-05
這篇文章主要給大家介紹了關(guān)于.net core整合log4net的解決方案，文中通過圖文介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用.net core具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2018-07-07
基于localStorge開發(fā)登錄模塊的記住密碼與自動(dòng)登錄實(shí)例
下面小編就為大家?guī)?lái)一篇基于localStorge開發(fā)登錄模塊的記住密碼與自動(dòng)登錄實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2017-08-08
最近在做項(xiàng)目時(shí)遇到了URL重寫后當(dāng)頁(yè)面回傳時(shí)，url又刷回原值；這個(gè)問題困擾了很久，終于找到解決辦法了。2009-11-11
.net framework中引進(jìn)的var對(duì)象類型聲明
安裝了vs 2008之后，在后臺(tái)代碼中，resharper插件對(duì)后臺(tái)所有局部變量進(jìn)行提示建議，顯示需要采用use implicitly typed local variable declaration，通過代碼修改建議2010-12-12