Question

我正在开发Windows Phone 8.1的应用程序。我正在尝试编辑Windows默认DatePicker样式。我已成功使用此样式添加图像代替DatePicker

<Style x:Key="DatePickerStyle" TargetType="DatePicker">
        <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}"/>
        <Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}"/>
        <Setter Property="Foreground" Value="{ThemeResource DatePickerForegroundThemeBrush}"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="HorizontalContentAlignment" Value="Left"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="DatePicker">
                    <StackPanel x:Name="LayoutRoot" Margin="{TemplateBinding Padding}">
                        <ContentPresenter x:Name="HeaderContentPresenter" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Margin="0,0,0,-3" Style="{StaticResource HeaderContentPresenterStyle}" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Bottom"/>
                        <Button x:Name="FlyoutButton" BorderThickness="2.5" HorizontalAlignment="Stretch" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsEnabled="{TemplateBinding IsEnabled}" Padding="6.5,0,0,3" BorderBrush="{x:Null}" Foreground="{x:Null}" Height="100" Width="100" Content=" ">
                            <Button.Background>
                                <ImageBrush Stretch="Uniform" ImageSource="/Assets/calendaricon.png"/>
                            </Button.Background>
                        </Button>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

但是当按下DatePicker时，它仍会显示旧的DatePicker样式，而不是我设置的新样式。我试图弄清楚如何设置日期选择器的按下状态样式，但我无法弄明白。我希望将相同的正常状态样式用于所有状态的datepicker。我怎样才能做到这一点？

Answer 1

而不是设置按钮的背景（FlyoutButton）设置按钮的内容模板（FlyoutButton）。

以下是代码：

<Style x:Key="DatePickerStyle" TargetType="DatePicker">
    <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}"/>
    <Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}"/>
    <Setter Property="Foreground" Value="{ThemeResource DatePickerForegroundThemeBrush}"/>
    <Setter Property="HorizontalAlignment" Value="Stretch"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="DatePicker">
                <StackPanel x:Name="LayoutRoot" Margin="{TemplateBinding Padding}">
                    <ContentPresenter x:Name="HeaderContentPresenter" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Margin="0,0,0,-3" Style="{StaticResource HeaderContentPresenterStyle}" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Bottom"/>
                    <Button x:Name="FlyoutButton" 
                            BorderThickness="2.5"
                            HorizontalAlignment="Stretch"
                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                            IsEnabled="{TemplateBinding IsEnabled}"
                            Padding="6.5,0,0,3"
                            BorderBrush="{x:Null}"
                            Foreground="{x:Null}"
                            Height="100"
                            Width="100"
                            >
                        <Button.ContentTemplate>
                            <DataTemplate>
                               <Grid >
                                   <Image Stretch="Uniform"
                                          Source="/Assets/calendaricon.png"/>
                               </Grid>
                            </DataTemplate>
                        </Button.ContentTemplate>
                    </Button>
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

更改窗口DatePicker的按下状态样式

1 个答案: