2017-01-16 47 views
0

附加的DatePicker到另一個UI元素

<StackPanel Orientation="Horizontal"> 
    <Label Content="{Binding WidgetSubTitle}" Style="{StaticResource WidgetSubTitleStyle}" /> 

    <DatePicker SelectedDate="{Binding SelectedDate}"> 
     <DatePicker.Resources> 
      <Style TargetType="DatePickerTextBox"> 
       <Setter Property="Visibility" Value="Collapsed" /> 
       <Setter Property="IsReadOnly" Value="True" /> 
      </Style> 
     </DatePicker.Resources> 
    </DatePicker> 
</StackPanel> 

它看起來像

enter image description here

我想擺脫日曆圖標,而是「附加」日期選取器我的Label。點擊標籤時,我想要打開選取器(在我的視圖模型中有一個雙向綁定到DateTime屬性)。我可以用一個按鈕替換Label,所以我可以從它的命令中受益,這不是問題。

我無法弄清楚如何做到這一點。我已經看到一個解決方案,其中CalendarPopup,但這似乎使事情複雜,對我來說。

我可以想到的一個解決方案是 - 隱藏整個DatePicker控件(可見性=摺疊),並且當按鈕/標籤被點擊時,只打開該選擇器的日曆彈出部分的可見性。不能完全弄清楚風格,但...

回答

1

你可以完全改變它的ControlTemplate來更改WPF控件的外觀。在這種情況下,您可以爲DatePicker控件定義一個自定義模板,使其看起來像一個Button,然後爲Button定義另一個模板,使其看起來像一個Label。事情是這樣的:

<DatePicker> 
    <DatePicker.Template> 
     <ControlTemplate TargetType="DatePicker"> 
      <Grid x:Name="PART_Root" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"> 
       <Button x:Name="PART_Button"> 
        <Button.Template> 
         <ControlTemplate TargetType="Button"> 
          <Label Content="{Binding WidgetSubTitle}" Style="{StaticResource WidgetSubTitleStyle}" /> 
         </ControlTemplate> 
        </Button.Template> 
       </Button> 
       <Popup x:Name="PART_Popup" AllowsTransparency="True" Placement="Bottom" PlacementTarget="{Binding ElementName=PART_TextBox}" StaysOpen="False"/> 
      </Grid> 
     </ControlTemplate> 
    </DatePicker.Template> 
</DatePicker> 

關於這樣做的好處是,即使你改變它的外觀控件的功能保持不變。

1

您將不得不爲yor DatePicker控件編寫自定義樣式。它可能看起來有點像爲你提供複雜的東西,以及你提到的解決方案,但事實並非如此。它是使WPF和它一樣偉大的事情之一。

在WPF ControlTemplates中,通常有部件,因此Controll的實現知道如何處理哪個UI元素。

對於DatePicker,您有PART_ButtonPART_TextBox,您需要自定義您的需求。即刪除實際的按鈕併爲其添加標籤。

你可以閱讀所有你需要的,包括在msdn上的一個很好的例子。

https://msdn.microsoft.com/en-us/library/ff468215(v=vs.110).aspx

相關問題