I have a timePicker from WPF using the Xceed Toolkit. The ListBox to select the time is displayed as a popup. The ToggleButton shown below opens and closes the Popup. Clicking outside the Popup also closes it, thanks to StaysOpen. What I want is to close the popup when I make a selection. I am trying with codebehind, but if there is an easy way to do it with XAML, I'd try that too.
The file where the Popup is defined is App.xaml. I reference TimePickerStyle from a view, called ExampleView.xaml.
ExampleView.xaml
<toolkit:TimePicker x:Name="tp"
Grid.Column="2" Kind="Local"
Background="White"
Value="{Binding ReminderTime, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
Style="{StaticResource TimePickerStyle}"
TextBoxBase.TextChanged = "DateTimePicker_ValueChanged"
/>
I try to access the Popup from the Codebehind, but for the life of me cannot figure it out.
ExampleView.xaml.cs
private void DateTimePicker_ValueChanged(object sender, TextChangedEventArgs e)
{
// This is where I tried to close the popup, but I can't figure out how to access
// it. I don't get a visual tree here
// tp.Style.Popup.IsOpen = false;
}
App.xaml
<Style x:Key="TimePickerStyle"
<Setter Property="Template">
...
<ToggleButton x:Name="_timePickerToggleButton"
Grid.Column="1"
Style="{StaticResource TimeToggleButtonStyle}"
IsTabStop="{TemplateBinding IsTabStop}"
BorderThickness="0">
<ToggleButton.IsHitTestVisible>
<Binding Path="IsOpen"
RelativeSource="{RelativeSource TemplatedParent}">
<Binding.Converter>
<toolkit:InverseBoolConverter />
</Binding.Converter>
</Binding>
</ToggleButton.IsHitTestVisible>
<ToggleButton.IsEnabled>
<Binding Path="IsReadOnly"
RelativeSource="{RelativeSource TemplatedParent}">
<Binding.Converter>
<toolkit:InverseBoolConverter />
</Binding.Converter>
</Binding>
</ToggleButton.IsEnabled>
<ToggleButton.ContentTemplate>
<DataTemplate>
<Path SnapsToDevicePixels="True"
Focusable="False" />
</DataTemplate>
</ToggleButton.ContentTemplate>
</ToggleButton>
<Popup x:Name="PART_Popupx"
AllowsTransparency="True"
IsOpen="{Binding IsChecked, ElementName=_timePickerToggleButton}"
StaysOpen="False"
ToolTip="">
<Border BorderThickness="0"
MaxHeight="{TemplateBinding MaxDropDownHeight}"
MinWidth="{Binding ActualWidth, ElementName=root}">
<Grid>
<ScrollViewer Style="{DynamicResource TransparentScroller}"
<ListBox x:Name="PART_TimeListItems"
BorderThickness="0"
DisplayMemberPath="Display"
<i:Interaction.Behaviors>
<extensionProperties:ScrollParentWhenAtMax />
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="Padding"
Value="4,3" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver"
Value="True" />
<Condition Property="IsSelected"
Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Background"
Value="{DynamicResource WorkflowColor2}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver"
Value="False" />
<Condition Property="IsSelected"
Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
Value="{DynamicResource SelectedColor}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver"
Value="True" />
<Condition Property="IsSelected"
Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
Value="{DynamicResource WorkflowColor2}" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>
</ScrollViewer>
</Grid>
</Border>
</Popup>
More Readable version of App.xaml
<Style x:Key="TimePickerStyle"
<Setter Property="Template">
...
<ToggleButton x:Name="_timePickerToggleButton"> ... </ToggleButton>
<Popup x:Name="PART_Popupx"
AllowsTransparency="True"
IsOpen="{Binding IsChecked, ElementName=_timePickerToggleButton}"
StaysOpen="False"
ToolTip="">
<Border>
<Grid>
<ScrollViewer>
<ListBox x:Name="PART_TimeListItems">
<ListBox.ItemContainerStyle>
<Setter Property="Template"
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
...
<ControlTemplate.Triggers>
...
</ListBox.ItemContainerStyle>
</ListBox>
</ScrollViewer>
</Grid>
</Border>
</Popup>
I tried accessing the Popup via codebehind, but can't find it. I can get the style, but then the popup element is nowhere to be found. I also tried setting a trigger on Popup, but I'm not well-versed in XAML, and that gave me a dead end. I was also thinking about adding more complex logic into the IsOpen binding, but don't know how to have it look at the ToggleButton at the same time as it's listening for a ListBox OnSelectionChanged.
Any help would be greatly appreciated.
Here is what it looks like from the codebehind when I try to find it via the debugger. It is listed in ChildNames, but I can't figure out how to modify it from there.
