WPF/XAML:根据自定义属性切换样式
我有一个带有以下 xaml 的 WPF 用户控件
<UserControl x:Class="Scheduler.ItemBox"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="40" d:DesignWidth="150" MinHeight="40" MinWidth="75" VerticalAlignment="Top">
<Border BorderBrush="CornflowerBlue" BorderThickness="1" CornerRadius="5" Name="border">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0"/>
<GradientStop Color="#FFC0D3EA" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<Grid Margin="2,0" Name="grid">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" MaxHeight="20" MinHeight="20" />
<RowDefinition MinHeight="20" />
</Grid.RowDefinitions>
<Label Content="00:00" FontWeight="Bold" Name="FromTime" Padding="5,0,0,0" VerticalContentAlignment="Center" />
<Label Content="01:30" Grid.Column="1" HorizontalContentAlignment="Right" Name="ToTime" Padding="0,0,5,0" VerticalContentAlignment="Center" />
<TextBlock Grid.ColumnSpan="2" Grid.Row="1" Name="MovieTitle" Padding="5,0" Text="item1" TextWrapping="Wrap" />
</Grid>
</Border>
,用户控件类看起来像这样
Namespace Scheduler
Public Class ItemBox
Public Property Selected As Boolean
End Class
End Namespace
现在我想做的是,当我将属性 Selected 更改为 True 时,如下所示: - 将边框borderbrush设置为黑色 - 将边框borderthickness设置为2 - 将网格边距设置为 1
我想通过在用户控件中定义“选定”样式来实现此目的,当选定属性设置为 True 时,该样式将覆盖默认样式。
我知道它与样式触发器和定义自定义附加属性有关。 但我似乎无法让它按照我想要的方式工作。
I have a WPF user control with following xaml
<UserControl x:Class="Scheduler.ItemBox"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="40" d:DesignWidth="150" MinHeight="40" MinWidth="75" VerticalAlignment="Top">
<Border BorderBrush="CornflowerBlue" BorderThickness="1" CornerRadius="5" Name="border">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0"/>
<GradientStop Color="#FFC0D3EA" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<Grid Margin="2,0" Name="grid">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" MaxHeight="20" MinHeight="20" />
<RowDefinition MinHeight="20" />
</Grid.RowDefinitions>
<Label Content="00:00" FontWeight="Bold" Name="FromTime" Padding="5,0,0,0" VerticalContentAlignment="Center" />
<Label Content="01:30" Grid.Column="1" HorizontalContentAlignment="Right" Name="ToTime" Padding="0,0,5,0" VerticalContentAlignment="Center" />
<TextBlock Grid.ColumnSpan="2" Grid.Row="1" Name="MovieTitle" Padding="5,0" Text="item1" TextWrapping="Wrap" />
</Grid>
</Border>
And the user control class looks like this
Namespace Scheduler
Public Class ItemBox
Public Property Selected As Boolean
End Class
End Namespace
Now what i would like to do is, when i change the property Selected to True is the following:
- set border borderbrush to black
- set border borderthickness to 2
- set grid margin to 1
I would like to accomplish this by defining a "selected" style in the usercontrol that overrides the default styles when the selected property is set to True.
I know it has something to do with a style trigger and defining a custom attached property.
But i can't seem to make it work the way i want to.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
第一个问题是您选择的属性不是“可观察的”。这意味着监视属性更改的任何内容(例如样式触发器或绑定)永远不会收到其更改的通知。
您需要实施 INotifyPropertyChanged 或将您的属性设为 依赖属性。它不需要是附加属性,因为如果需要,您可以使用RelativeSource 绑定到该属性。
第二个问题是您的 UserControl 没有样式,至少默认情况下没有。即使设置了 UserControl.Style 属性,也无法轻松更改内容。使用自定义控件可以更轻松地完成此操作,并且完成你想要的事情的最佳选择。
The first issue is your Selected property is not "observable". This means that anything that is watching the property for changes (such as a Style Trigger or a Binding), will never be notified that it changed.
You would either need to implement INotifyPropertyChanged or make your property a Dependency Property. It doesn't need to be an attached property, as you can bind to the property using RelativeSource, if needed.
The second issue is that your UserControl doesn't have a Style, at least not by default. Even if you set the UserControl.Style property, you cannot easily change the content. This is something that is more easily done using a custom Control, and is your best bet to accomplish what you want.