如何格式化DatePicker以显示日期格式日/月/年？

我使用了Windows Phone 8.1 DatePicker 如何格式化DatePicker以显示日期格式日/月/年？

它的显示日期为月/日/年在默认情况下，我看不到任何方式更改为日的“正确”的方式/月/年。

这是我如何申报的DatePicker

<DatePicker Name="datePicker" HorizontalAlignment="Center" MonthFormat="{}{month.full}"/>

显示它作为

enter image description here

我可以将链接MSDN文章中所看到的，我可以结合使用DateTimeFormatter与组合框选择，但这对我来说不是一种选择。

可能吗？

来源

2014-10-17 DaveDev

一个downvote并没有发表评论的资源部分....是这个地方变成reddit的？这个问题有什么问题？ – DaveDev 2014-10-17 14:10:33

大声笑不要尝试和理解downvote巨魔。只是不要目光接触，他们会消失。 – 2014-10-17 17:27:04

这就是说，你有没有尝试编辑DatePicker模板？ – 2014-10-17 17:28:12

编辑模板

XAML中每个控件的样式，您可以操控，改变它的外观和感觉。控件也相互继承，例如日期选择器由按钮和内容容器组成。而一个按钮由边框和内容容器组成。

更新日期选择器样式右键单击Visual Studio中的日期选取器控件从菜单中单击编辑模板然后单击编辑副本。对于要在日期选择器模板编辑按钮模板的样式这个例子...

您还需要创建一个转换器类模板

这个答案为我工作所用页面日期选取器...

<Page 
x:Class="DatePikerAnswer.MainPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:DatePikerAnswer" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" 
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
<Page.Resources> 
    <!-- Format Converter --> 
    <local:DateConverter x:Key="FormatConverter"/> 

    <!-- My Button Style--> 
    <Thickness x:Key="PhoneBorderThickness">2.5</Thickness> 
    <FontWeight x:Key="PhoneButtonFontWeight">Semibold</FontWeight> 
    <x:Double x:Key="TextStyleLargeFontSize">18.14</x:Double> 
    <x:Double x:Key="PhoneButtonMinHeight">57.5</x:Double> 
    <x:Double x:Key="PhoneButtonMinWidth">109</x:Double> 
    <Thickness x:Key="PhoneTouchTargetOverhang">0,9.5</Thickness> 
    <SolidColorBrush x:Key="ButtonDisabledBackgroundThemeBrush" Color="Transparent"/> 
    <Style x:Key="MyButtonStyle" TargetType="Button"> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="BorderBrush" Value="{ThemeResource PhoneForegroundBrush}"/> 
     <Setter Property="Foreground" Value="{ThemeResource PhoneForegroundBrush}"/> 
     <Setter Property="BorderThickness" Value="{ThemeResource PhoneBorderThickness}"/> 
     <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}"/> 
     <Setter Property="FontWeight" Value="{ThemeResource PhoneButtonFontWeight}"/> 
     <Setter Property="FontSize" Value="{ThemeResource TextStyleLargeFontSize}"/> 
     <Setter Property="Padding" Value="9.5,0"/> 
     <Setter Property="MinHeight" Value="{ThemeResource PhoneButtonMinHeight}"/> 
     <Setter Property="MinWidth" Value="{ThemeResource PhoneButtonMinWidth}"/> 
     <Setter Property="HorizontalAlignment" Value="Left"/> 
     <Setter Property="VerticalAlignment" Value="Center"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button"> 
        <Grid x:Name="Grid" Background="Transparent"> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualStateGroup.Transitions> 
            <VisualTransition From="Pressed" To="PointerOver"> 
             <Storyboard> 
              <PointerUpThemeAnimation Storyboard.TargetName="Grid"/> 
             </Storyboard> 
            </VisualTransition> 
            <VisualTransition From="PointerOver" To="Normal"> 
             <Storyboard> 
              <PointerUpThemeAnimation Storyboard.TargetName="Grid"/> 
             </Storyboard> 
            </VisualTransition> 
            <VisualTransition From="Pressed" To="Normal"> 
             <Storyboard> 
              <PointerUpThemeAnimation Storyboard.TargetName="Grid"/> 
             </Storyboard> 
            </VisualTransition> 
           </VisualStateGroup.Transitions> 
           <VisualState x:Name="Normal"/> 
           <VisualState x:Name="PointerOver"/> 
           <VisualState x:Name="Pressed"> 
            <Storyboard> 
             <PointerDownThemeAnimation Storyboard.TargetName="Grid"/> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonPressedForegroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonPressedBackgroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledForegroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledBorderThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledBackgroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="{ThemeResource PhoneTouchTargetOverhang}"> 
          <ContentPresenter x:Name="ContentPresenter" 
               AutomationProperties.AccessibilityView="Raw" 
               ContentTemplate="{TemplateBinding ContentTemplate}" 
               Content="{Binding Content, RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource FormatConverter},ConverterParameter=\{0:dd/MM/yyyy\}}" 
               Foreground="{TemplateBinding Foreground}" 
               HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
               Margin="{TemplateBinding Padding}" 
               VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         </Border> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

    <!--DatePicker Style--> 
    <FontFamily x:Key="PhoneFontFamilyNormal">Segoe WP</FontFamily> 
    <x:Double x:Key="ContentControlFontSize">20.26</x:Double> 
    <Style x:Key="MyDatePickerStyle1" 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}"/> 
         <Button x:Name="FlyoutButton" 
           BorderBrush="{TemplateBinding Foreground}" 
           BorderThickness="2.5" 
           Background="{TemplateBinding Background}" 
           Foreground="{TemplateBinding Foreground}" 
           HorizontalAlignment="Stretch" 
           HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
           IsEnabled="{TemplateBinding IsEnabled}" 
           Style="{StaticResource MyButtonStyle}" 
           Padding="6.5,0,0,3"/> 
        </StackPanel> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Page.Resources> 

<Grid>

</Grid> 
</Page>

转换器类...

using System; 
using System.Collections.Generic; 
using System.Globalization; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using Windows.UI.Xaml.Data; 

namespace DatePikerAnswer 
{ 
    class DateConverter : IValueConverter 
    { 
    public object Convert(object value, Type targetType, object parameter, string language) 
    { 
     if (value != null) 
     { 
      ///Convert Class throws exception so can not convert to date time 
      string TheCurrentDate = value.ToString(); 

      string[] Values = TheCurrentDate.Split('/'); 
      string Day, Month, Year; 

      Day = Values[1]; 
      Month = Values[0]; 
      Year = Values[2]; 

      string retvalue = string.Format("{0}/{1}/{2}", Day, Month, Year); 
      return retvalue; 
     } 
     return value; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, string language) 
    { 
     throw new NotImplementedException(); 
    } 
    } 
}

最终的结果是...

enter image description here

来源

2014-10-18 21:27:26

感谢您的全面回答！星期一上午我会试一试，让你知道我是如何得到它的。 – DaveDev 2014-10-18 22:00:47

我给了这个尝试 - 它看起来不错，但是当你点击日期时，它会抛出一个'ArgumentException'，并显示消息“参数不正确，放置目标需要放在可视树中。我无法弄清楚如何解决它！ – DaveDev 2014-10-21 14:58:02

经过进一步调查，看起来这个错误不是你的代码的错误 - 这是我的应用程序中的错误！ feck ... – DaveDev 2014-10-21 15:02:28

我需要显示日期为“年月日”，我尝试了一些解决方案，我想到了，但他们没有工作，找遍了一点终于找到了这个问题，StuartSmith找到了答案。基于他的回答，我想出了通过Kubaskista

周围评论中提到本地化问题工作@StuartSmith它不会对德国本地化和可能是由于不同的数据格式，其他一些地区的工作类似的解决方案。顺便说一句：任何想法为什么转换器中的“价值”不可能转换成日期时间？

1-定义xaml中的Date Picker，给它命名为“FirstDatePicker”，然后从Designer编辑模板中选择edit a copy。

Date Picker Style

<DatePicker x:Name="FirstDatePicker" VerticalAlignment="Top" Grid.Row="1" Margin="0,12,0,0" CalendarIdentifier="GregorianCalendar" DayVisible="False" Padding="0" Style="{StaticResource DatePickerStyle}" RequestedTheme="Light"/>

2 - 右键点击FlyoutButton - >其他模板 - >编辑生成的内容 - >编辑副本。

enter image description here

3-里面的内容模板，我们将直接绑定到FirstDatePicker日期财产，使用StringFormatConverter你的，你希望可以格式化日期和覆盖文化也。

<DataTemplate x:Key="DateFormatTemplate"> 
     <Grid> 
      <TextBlock x:Name="textBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Date, ConverterParameter=MMMM yyyy, Converter={StaticResource DateFormatConverter}, ElementName=FirstDatePicker, Mode=OneWay}" VerticalAlignment="Top"/> 
     </Grid> 
    </DataTemplate>

4-将StringFormatConverter添加到解决方案，不要忘记将其添加到页面的资源部分。

public class DateFormatConverter : IValueConverter 
{ 
    #region IValueConverter Members 

    public object Convert (object value, Type targetType, object parameter, string language) 
    { 
     if(!(value is DateTime || value is DateTimeOffset) || parameter == null) return value; 
     if(value is DateTime) 
     { 
      var date = (DateTime)value; 
      return date.ToString(parameter.ToString(), CultureInfo.CurrentCulture); 
     } 
     else 
     { 
      var date = (DateTimeOffset)value; 
      return date.ToString(parameter.ToString(), CultureInfo.CurrentCulture); 
     } 
    } 

    public object ConvertBack (object value, Type targetType, object parameter, string language) 
    { 
     throw new NotImplementedException(); 
    } 

    #endregion 
}

注意：您可以更改“CultureInfo.CurrentCulture”新文化（“AR-EG”）作为例子或通过转换器使用的语言。

最后，这里是我在页面

<converters:DateFormatConverter x:Key="DateFormatConverter"/> 
<x:Double x:Key="ContentControlFontSize">20.26</x:Double> 
    <FontWeight x:Key="PhoneButtonFontWeight2">Semibold</FontWeight> 
    <DataTemplate x:Key="DateFormatTemplate"> 
     <Grid> 
      <TextBlock x:Name="textBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Date, ConverterParameter=MMMM yyyy, Converter={StaticResource DateFormatConverter}, ElementName=FirstDatePicker, Mode=OneWay}" VerticalAlignment="Top"/> 
     </Grid> 
    </DataTemplate> 
    <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}"/> 
         <Button x:Name="FlyoutButton" BorderBrush="{TemplateBinding Foreground}" BorderThickness="2.5" Background="{TemplateBinding Background}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Stretch" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsEnabled="{TemplateBinding IsEnabled}" Padding="12,10" Margin="0" ContentTemplate="{StaticResource DateFormatTemplate}"/> 
        </StackPanel> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style>

来源

2015-04-16 16:38:06

如何格式化DatePicker以显示日期格式日/月/年？

回答

相关问题