【问题标题】:ExtendedToolkit DatePicker Calendar FontSize扩展工具包 DatePicker 日历字体大小
【发布时间】:2015-12-10 15:45:34
【问题描述】:

我正在为 WPF C# 使用 ExtendedToolkit。具体来说,我使用的是 DateTimePicker,我尝试更改此元素的字体大小,但它不会更改用于选择日期的附加日历的大小;

有没有办法在 ExtendedToolkit 中更改它的 FontSize 使其看起来更大?

【问题讨论】:

    标签: c# wpf wpf-extended-toolkit


    【解决方案1】:

    我需要日历控件来显示更大的数字,并且由于 DateTimePicker 使用日历,因此这里适用相同的解决方案。

    日历具有用于自定义日期字段的 CalendarDayButtonStyle 属性。唯一要更改的属性是CalendarDayButton.FontSize

    <xctk:DateTimePicker VerticalAlignment="Top">
        <xctk:DateTimePicker.Resources>
            <Style TargetType="Calendar">
                <Setter Property="CalendarDayButtonStyle">
                    <Setter.Value>
                        <Style TargetType="CalendarDayButton" 
                                BasedOn="{StaticResource {x:Type CalendarDayButton}}">
                            <Setter Property="FontSize" Value="16"/>
                        </Style>
                    </Setter.Value>
                </Setter>
            </Style>
        </xctk:DateTimePicker.Resources>
    </xctk:DateTimePicker>
    

    【讨论】:

      【解决方案2】:

      您可以通过 Blend 工具为 CalendarCalendarItem 生成模板和样式的副本,并覆盖默认的 FontSize。我通过 Blend 生成的副本是:

      <Style x:Key="CalendarStyle1" TargetType="{x:Type Calendar}">
                  <Setter Property="Foreground" Value="#FF333333"/>
                  <Setter Property="Background">
                      <Setter.Value>
                          <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                              <GradientStop Color="#FFE4EAF0" Offset="0"/>
                              <GradientStop Color="#FFECF0F4" Offset="0.16"/>
                              <GradientStop Color="#FFFCFCFD" Offset="0.16"/>
                              <GradientStop Color="#FFFFFFFF" Offset="1"/>
                          </LinearGradientBrush>
                      </Setter.Value>
                  </Setter>
                  <Setter Property="BorderBrush">
                      <Setter.Value>
                          <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                              <GradientStop Color="#FFA3AEB9" Offset="0"/>
                              <GradientStop Color="#FF8399A9" Offset="0.375"/>
                              <GradientStop Color="#FF718597" Offset="0.375"/>
                              <GradientStop Color="#FF617584" Offset="1"/>
                          </LinearGradientBrush>
                      </Setter.Value>
                  </Setter>
                  <Setter Property="BorderThickness" Value="1"/>
                  <Setter Property="Template">
                      <Setter.Value>
                          <ControlTemplate TargetType="{x:Type Calendar}">
                              <StackPanel x:Name="PART_Root" HorizontalAlignment="Center">
                                  <CalendarItem x:Name="PART_CalendarItem" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Style="{DynamicResource CalendarItemStyle1}"/>
                              </StackPanel>
                          </ControlTemplate>
                      </Setter.Value>
                  </Setter>
              </Style>
              <Style x:Key="CalendarItemStyle1" TargetType="{x:Type CalendarItem}">
                  <Setter Property="Margin" Value="0,3,0,3"/>
                  <Setter Property="Template">
                      <Setter.Value>
                          <ControlTemplate TargetType="{x:Type CalendarItem}">
                              <ControlTemplate.Resources>
                                  <DataTemplate x:Key="{x:Static CalendarItem.DayTitleTemplateResourceKey}">
                                      <TextBlock Foreground="#FF333333" FontWeight="Bold" FontSize="9.5" FontFamily="Verdana" HorizontalAlignment="Center" Margin="0,6,0,6" Text="{Binding}" VerticalAlignment="Center"/>
                                  </DataTemplate>
                              </ControlTemplate.Resources>
                              <Grid x:Name="PART_Root">
                                  <Grid.Resources>
                                      <SolidColorBrush x:Key="DisabledColor" Color="#A5FFFFFF"/>
                                  </Grid.Resources>
                                  <VisualStateManager.VisualStateGroups>
                                      <VisualStateGroup x:Name="CommonStates">
                                          <VisualState x:Name="Normal"/>
                                          <VisualState x:Name="Disabled">
                                              <Storyboard>
                                                  <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="PART_DisabledVisual"/>
                                              </Storyboard>
                                          </VisualState>
                                      </VisualStateGroup>
                                  </VisualStateManager.VisualStateGroups>
                                  <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="1">
                                      <Border BorderBrush="#FFFFFFFF" BorderThickness="2" CornerRadius="1">
                                          <Grid>
                                              <Grid.Resources>
                                                  <ControlTemplate x:Key="PreviousButtonTemplate" TargetType="{x:Type Button}">
                                                      <Grid Cursor="Hand">
                                                          <VisualStateManager.VisualStateGroups>
                                                              <VisualStateGroup x:Name="CommonStates">
                                                                  <VisualState x:Name="Normal"/>
                                                                  <VisualState x:Name="MouseOver">
                                                                      <Storyboard>
                                                                          <ColorAnimation Duration="0" To="#FF73A9D8" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path"/>
                                                                      </Storyboard>
                                                                  </VisualState>
                                                                  <VisualState x:Name="Disabled">
                                                                      <Storyboard>
                                                                          <DoubleAnimation Duration="0" To=".5" Storyboard.TargetProperty="(Shape.Fill).(Brush.Opacity)" Storyboard.TargetName="path"/>
                                                                      </Storyboard>
                                                                  </VisualState>
                                                              </VisualStateGroup>
                                                          </VisualStateManager.VisualStateGroups>
                                                          <Rectangle Fill="#11E5EBF1" Opacity="1" Stretch="Fill"/>
                                                          <Grid>
                                                              <Path x:Name="path" Data="M288.75,232.25 L288.75,240.625 L283,236.625 z" Fill="#FF333333" HorizontalAlignment="Left" Height="10" Margin="14,-6,0,0" Stretch="Fill" VerticalAlignment="Center" Width="6"/>
                                                          </Grid>
                                                      </Grid>
                                                  </ControlTemplate>
                                                  <ControlTemplate x:Key="NextButtonTemplate" TargetType="{x:Type Button}">
                                                      <Grid Cursor="Hand">
                                                          <VisualStateManager.VisualStateGroups>
                                                              <VisualStateGroup x:Name="CommonStates">
                                                                  <VisualState x:Name="Normal"/>
                                                                  <VisualState x:Name="MouseOver">
                                                                      <Storyboard>
                                                                          <ColorAnimation Duration="0" To="#FF73A9D8" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path"/>
                                                                      </Storyboard>
                                                                  </VisualState>
                                                                  <VisualState x:Name="Disabled">
                                                                      <Storyboard>
                                                                          <DoubleAnimation Duration="0" To=".5" Storyboard.TargetProperty="(Shape.Fill).(Brush.Opacity)" Storyboard.TargetName="path"/>
                                                                      </Storyboard>
                                                                  </VisualState>
                                                              </VisualStateGroup>
                                                          </VisualStateManager.VisualStateGroups>
                                                          <Rectangle Fill="#11E5EBF1" Opacity="1" Stretch="Fill"/>
                                                          <Grid>
                                                              <Path x:Name="path" Data="M282.875,231.875 L282.875,240.375 L288.625,236 z" Fill="#FF333333" HorizontalAlignment="Right" Height="10" Margin="0,-6,14,0" Stretch="Fill" VerticalAlignment="Center" Width="6"/>
                                                          </Grid>
                                                      </Grid>
                                                  </ControlTemplate>
                                                  <ControlTemplate x:Key="HeaderButtonTemplate" TargetType="{x:Type Button}">
                                                      <Grid Cursor="Hand">
                                                          <VisualStateManager.VisualStateGroups>
                                                              <VisualStateGroup x:Name="CommonStates">
                                                                  <VisualState x:Name="Normal"/>
                                                                  <VisualState x:Name="MouseOver">
                                                                      <Storyboard>
                                                                          <ColorAnimation Duration="0" To="#FF73A9D8" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="buttonContent"/>
                                                                      </Storyboard>
                                                                  </VisualState>
                                                                  <VisualState x:Name="Disabled">
                                                                      <Storyboard>
                                                                          <DoubleAnimation Duration="0" To=".5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="buttonContent"/>
                                                                      </Storyboard>
                                                                  </VisualState>
                                                              </VisualStateGroup>
                                                          </VisualStateManager.VisualStateGroups>
                                                          <ContentPresenter x:Name="buttonContent" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" TextElement.Foreground="#FF333333" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="1,4,1,9" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                                      </Grid>
                                                  </ControlTemplate>
                                              </Grid.Resources>
                                              <Grid.ColumnDefinitions>
                                                  <ColumnDefinition Width="Auto"/>
                                                  <ColumnDefinition Width="Auto"/>
                                                  <ColumnDefinition Width="Auto"/>
                                              </Grid.ColumnDefinitions>
                                              <Grid.RowDefinitions>
                                                  <RowDefinition Height="Auto"/>
                                                  <RowDefinition Height="*"/>
                                              </Grid.RowDefinitions>
                                              <Button x:Name="PART_PreviousButton" Grid.Column="0" Focusable="False" HorizontalAlignment="Left" Height="20" Grid.Row="0" Template="{StaticResource PreviousButtonTemplate}" Width="28"/>
                                              <Button x:Name="PART_HeaderButton" Grid.Column="1" FontWeight="Bold" Focusable="False" FontSize="10.5" HorizontalAlignment="Center" Grid.Row="0" Template="{StaticResource HeaderButtonTemplate}" Height="100" VerticalAlignment="Center"/>
                                              <Button x:Name="PART_NextButton" Grid.Column="2" Focusable="False" HorizontalAlignment="Right" Height="20" Grid.Row="0" Template="{StaticResource NextButtonTemplate}" Width="28"/>
                                              <Grid x:Name="PART_MonthView" Grid.ColumnSpan="3" HorizontalAlignment="Center" Margin="6,-1,6,6" Grid.Row="1" Visibility="Visible">
                                                  <Grid.ColumnDefinitions>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                  </Grid.ColumnDefinitions>
                                                  <Grid.RowDefinitions>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                  </Grid.RowDefinitions>
                                              </Grid>
                                              <Grid x:Name="PART_YearView" Grid.ColumnSpan="3" HorizontalAlignment="Center" Margin="6,-3,7,6" Grid.Row="1" Visibility="Hidden">
                                                  <Grid.ColumnDefinitions>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                      <ColumnDefinition Width="Auto"/>
                                                  </Grid.ColumnDefinitions>
                                                  <Grid.RowDefinitions>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                      <RowDefinition Height="Auto"/>
                                                  </Grid.RowDefinitions>
                                              </Grid>
                                          </Grid>
                                      </Border>
                                  </Border>
                                  <Rectangle x:Name="PART_DisabledVisual" Fill="{StaticResource DisabledColor}" Opacity="0" RadiusY="2" RadiusX="2" Stretch="Fill" Stroke="{StaticResource DisabledColor}" StrokeThickness="1" Visibility="Collapsed"/>
                              </Grid>
                              <ControlTemplate.Triggers>
                                  <Trigger Property="IsEnabled" Value="False">
                                      <Setter Property="Visibility" TargetName="PART_DisabledVisual" Value="Visible"/>
                                  </Trigger>
                                  <DataTrigger Binding="{Binding DisplayMode, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Calendar}}}" Value="Year">
                                      <Setter Property="Visibility" TargetName="PART_MonthView" Value="Hidden"/>
                                      <Setter Property="Visibility" TargetName="PART_YearView" Value="Visible"/>
                                  </DataTrigger>
                                  <DataTrigger Binding="{Binding DisplayMode, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Calendar}}}" Value="Decade">
                                      <Setter Property="Visibility" TargetName="PART_MonthView" Value="Hidden"/>
                                      <Setter Property="Visibility" TargetName="PART_YearView" Value="Visible"/>
                                  </DataTrigger>
                              </ControlTemplate.Triggers>
                          </ControlTemplate>
                      </Setter.Value>
                  </Setter>
              </Style>
      

      【讨论】:

        【解决方案3】:

        试试这个。

        第 1 步:

        为日历创建样式

        <Style x:Key="styleCalendar" TargetType="{x:Type Calendar}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Calendar}">
                    <!-- Wrapping in ViewBox will enlarge calendar of that size.-->
                    <Viewbox Height="400"
                             Width="400">
                        <CalendarItem x:Name="CalendarItem"
                                      Background="{TemplateBinding Background}"
                                      BorderBrush="{TemplateBinding BorderBrush}"
                                      BorderThickness="{TemplateBinding BorderThickness}"/>
                    </Viewbox>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        

        第 2 步:

        为您的 DatePicker 应用样式。

        <DatePicker CalendarStyle="{StaticResource styleCalendar}" 
        Height="25" HorizontalAlignment="Left" Name="datePicker1" Width="120" />
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2011-04-24
          • 1970-01-01
          • 1970-01-01
          • 2010-11-09
          相关资源
          最近更新 更多