如何格式化DatePicker以显示日/月/年的日期格式? [英] How can I format a DatePicker to display the date format day / month / year?
问题描述
我正在使用Windows Phone 8.1 与ComboBox选择器结合使用,但这对我来说不是一个选择.
有可能吗?
编辑模板
在Xaml中,每个控件都有一种您可以操纵的样式,以更改其外观.控件也相互继承,例如,日期选择器由按钮和内容容器组成.按钮由边框和内容容器组成.
要更新日期选择器样式.从菜单中右键单击Visual Studio中的日期选择器控件,单击编辑模板",然后单击编辑副本".对于此示例,您要在日期选择器模板...中编辑按钮模板的样式.
您还需要创建一个要在模板中使用的Converter类
这个答案对我有用带有日期选择器的页面...
<页面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><!-格式转换器->< local:DateConverter x:Key ="FormatConverter"/><!-我的按钮样式->< 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属性="MinWidth"值="{ThemeResource PhoneButtonMinWidth}"/>< Setter Property ="HorizontalAlignment" Value =左"/>< 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"><故事板>< PointerUpThemeAnimation Storyboard.TargetName ="Grid"/></Storyboard></VisualTransition>< VisualTransition从="PointerOver"到=普通"><故事板>< PointerUpThemeAnimation Storyboard.TargetName ="Grid"/></Storyboard></VisualTransition>< VisualTransition From ="Pressed" To ="Normal"><故事板>< PointerUpThemeAnimation Storyboard.TargetName ="Grid"/></Storyboard></VisualTransition></VisualStateGroup.Transitions>< VisualState x:Name ="Normal"/>< VisualState x:Name ="PointerOver"/>< VisualState x:Name ="Pressed"><故事板>< 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"><故事板>< 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 =原始"ContentTemplate ="{TemplateBinding ContentTemplate}"Content ="{绑定内容,RelativeSource = {RelativeSource TemplatedParent},转换器= {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></样式><!-DatePicker样式->< 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 =拉伸"/>< Setter Property ="HorizontalContentAlignment" Value =左"/>< 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前景}"BorderThickness ="2.5"Background ="{TemplateBinding Background}"Foreground ="{TemplateBinding Foreground}"HorizontalAlignment =拉伸"HorizontalContentAlignment ="{TemplateBinding HorizontalContentAlignment}"IsEnabled ="{TemplateBinding IsEnabled}"Style ="{StaticResource MyButtonStyle}"填充="6.5,0,0,3"/></StackPanel></ControlTemplate></Setter.Value></Setter></样式></Page.Resources><网格>
</Grid></Page>
转换器类...
使用系统;使用System.Collections.Generic;使用System.Globalization;使用System.Linq;使用System.Text;使用System.Threading.Tasks;使用Windows.UI.Xaml.Data;命名空间DatePikerAnswer{类DateConverter:IValueConverter{公共对象Convert(对象值,类型targetType,对象参数,字符串语言){如果(值!=空){///Convert Class引发异常,因此无法转换为日期时间字符串TheCurrentDate = value.ToString();string []值= TheCurrentDate.Split('/');字符串Day,Month,Year;天=值[1];月=值[0];年=值[2];字符串retvalue = string.Format("{0}/{1}/{2}",Day,Month,Year);返回retvalue;}返回值;}公共对象ConvertBack(对象值,类型targetType,对象参数,字符串语言){抛出新的NotImplementedException();}}}
最终结果是...
I'm using the Windows Phone 8.1 DatePicker
It's displaying the date as month/day/year by default and I can't see any way to change this to the 'correct' way of day/month/year.
This is how I declare the DatePicker
<DatePicker Name="datePicker" HorizontalAlignment="Center" MonthFormat="{}{month.full}"/>
displaying it as
I can see in the linked msdn article that I can use a DateTimeFormatter in conjunction with ComboBox selectors but that's not an option for me.
Is it possible?
To Edit the Template
In Xaml every control has a style which you can manipulate, to change it's look and feel. Controls also inherit from one another, for example a date picker is made up of a button and a content container. And a button is made up of a border and a content container.
To Update the date pickers style.. Right click on the date picker control in visual studio from the Menu click edit template then click edit a copy. For this example you want to edit the style of the button template with in the date picker Template...
You will also need to create a Converter class to used in the template
This answer worked for me Page with date picker...
<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>
Converter Class ...
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();
}
}
}
The End Result is ...
这篇关于如何格式化DatePicker以显示日/月/年的日期格式?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!