【问题标题】:Make DatePicker easier to read when disabled禁用时使 DatePicker 更易于阅读
【发布时间】:2011-06-28 04:49:51
【问题描述】:

当 DatePicker 被禁用时文本变灰,我希望内容更易于阅读。

我对一些文本框所做的是:

<Style TargetType="TextBox">
        <Style.Triggers>
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="Foreground" Value="Black" />
            </Trigger>
        </Style.Triggers>
</Style>

它确实使文本更易于阅读。

我确实设法更改了 DataPicker 上的前景色,但它没有起到作用。文本仍然是灰色的。

似乎我需要设置另一个属性以使禁用的 DatePicker 的内容更易于阅读。

那么,如何让我禁用的 DatePicker 的内容更易于阅读?

【问题讨论】:

  • 恐怕你得去模板了

标签: wpf xaml


【解决方案1】:

您能否通过添加名为 Editable 的 bool DependencyProperty 来扩展 DatePicker。
我在以下link 找到了一个工作示例,请注意我在 .NET 4 中运行此代码。

这是 DatePicker 控件:

using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Data;

namespace DatePickerStyle
{
 public class ExtendedDatePicker : DatePicker
 {
    public static readonly DependencyProperty EditableProperty = DependencyProperty.Register("Editable", typeof(bool),
        typeof(ExtendedDatePicker), new PropertyMetadata(true));
    public bool Editable
    {
       get { return (bool)GetValue(EditableProperty); }
       set { SetValue(EditableProperty, value); }
    }

    public override void OnApplyTemplate()
    {
       base.OnApplyTemplate();
       var textBox = GetTemplateChild("PART_TextBox") as DatePickerTextBox;
       var binding = new Binding { Source = this, Path = new PropertyPath(ExtendedDatePicker.EditableProperty) };
       textBox.SetBinding(UIElement.FocusableProperty, binding);
    }
  }
}

这是 XAML:

<Window x:Class="DatePickerStyle.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:DatePickerStyle="clr-namespace:DatePickerStyle" 
    Title="MainWindow" Height="350" Width="525">
  <Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <DatePicker IsEnabled="True" Grid.Row="0" SelectedDate="2002/12/31"/>
    <DatePicker IsEnabled="False" Grid.Row="1" SelectedDate="2002/12/31"/>
    <DatePickerStyle:ExtendedDatePicker Editable="True" Grid.Row="2" SelectedDate="2002/12/31"/>
    <DatePickerStyle:ExtendedDatePicker Editable="False" Grid.Row="3" SelectedDate="2002/12/31"/>
  </Grid>
</Window>

【讨论】:

    【解决方案2】:

    我建议这种更简单、通用的方法?

    <ControlTemplate x:Key="MyDisabledDatePicker">
        <Border BorderBrush="Black" BorderThickness="1">
            <TextBlock 
                Text="{Binding Path=SelectedDate, StringFormat={}{0:d}, RelativeSource={RelativeSource TemplatedParent}}" 
                VerticalAlignment="Center" HorizontalAlignment="Left" Padding="10,0,0,0"/>
        </Border>
    </ControlTemplate>
    <Style TargetType="{x:Type DatePicker}">
        <Style.Triggers>
            <DataTrigger Binding="{Binding Path=IsEnabled, RelativeSource={RelativeSource Self}}"  Value="false">
                <Setter Property="Template" Value="{StaticResource MyDisabledDatePicker}" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
    

    快!

    【讨论】:

    • 这会导致同样的错误。如果您将您的 isenabled 绑定到视图模型,例如。在保存命令中,您将 isenabled 更改为 false,然后返回 true。点击日期选择器弹出窗口时出现错误。
    【解决方案3】:

    上面的代码 w ExtendedDatePicker 有效,首先我认为它没有,但那是因为下拉菜单仍然可以更改文本并且 Editable="False" 在下拉菜单上不起作用

    所以不要忘记将以下内容添加到 ExtendedDatePicker

    Editable="False" AllowDrop="False" IsDropDownOpen="False" IsHitTestVisible="False" IsManipulationEnabled="False"
    

    【讨论】: