I have tabItem which contains one CheckBox.Tab inside I am binding one ListBox. based on check box checked status I need to control visibility of ListBox. I binded IsChecked property to Visiblity property of ListBox by using Boolean to Visibility converter.But It is not changing the status of Listbox.
How do I get the control status?
Here I attached my code.
<TabItem Header="Trigger">
<TabItem.HeaderTemplate>
<DataTemplate>
<DockPanel>
<CheckBox x:Name="ui_chbTrigger" IsChecked="{Binding SelectedUiSeries.UiTriggerParameters.HasEcgPulsingConfig, Mode=TwoWay}"/>
<Label Content="Trigger" HorizontalAlignment="Center" FontSize="18" FontWeight="Bold"/>
</DockPanel>
</DataTemplate>
</TabItem.HeaderTemplate>
<Grid >
<ListBox Grid.Row="1" Style="{StaticResource S_ListBoxParameterScan}"
ItemContainerStyle="{StaticResource S_ListBoxItemScanParameter}"
Visibility="{Binding Path=IsChecked, Converter={StaticResource BooleanToVisiblityConverter}, ElementName=ui_chbTrigger}">
<ListBoxItem>
<util:HeaderComboBox Style="{DynamicResource S_HeaderComboBoxParameter}" Header="Trigger Type"
ItemsSource="{helpers:EnumBindingHelper {x:Type commonDefs:TriggerType}}"
SelectedItem="{Binding SelectedUiSeries.UiTriggerParameters.TriggerType,Mode=TwoWay}"/>
</ListBoxItem>
</ListBox>
</Grid >
</TabItem>
How can you reference control from TEMPLATE(your checkbox is in HeaderTemplate)
You can change your code as below
<TabControl>
<TabItem>
<TabItem.Header>
<DockPanel>
<CheckBox x:Name="ui_chbTrigger"/>
</DockPanel>
</TabItem.Header>
<Grid >
<ListBox Visibility="{Binding Path=IsChecked, Converter={StaticResource BooleanToVisiblityConverter}, ElementName=ui_chbTrigger}">
<ListBoxItem>
<TextBlock>1</TextBlock>
</ListBoxItem>
<ListBoxItem>
<TextBlock>2</TextBlock>
</ListBoxItem>
</ListBox>
</Grid >
</TabItem>
</TabControl>
Feel free to do the further changes as you need.
Your CheckBox is already bound to SelectedUiSeries.UiTriggerParameters.HasEcgPulsingConfig.
Instead of trying to do ElementName-based Binding, simply bind the other UI element to the same property in the ViewModel:
<ListBox Visibility="{Binding Path=SelectedUiSeries.UiTriggerParameters.HasEcgPulsingConfig,
Converter={StaticResource BooleanToVisiblityConverter}}"/>
Related
On click of toggle button I want to show a context menu. As I want to change the visual appearance of context menu, I have created controltemplate and data template as below,
<TabItem>
<TabItem.HeaderTemplate>
<DataTemplate>
<ContextMenu ItemSource="{Binding Collection}">
<ContextMenu.Template>
<ControlTemplate>
<Grid Margin="10">
<ListBox Width="150" Height="70"/>
</Grid>
</ControlTemplate>
<ContextMenu.ItemTemplate>
<DataTemplate>
<StackPanel>
<CheckBox Content="{Binding Name}"/>
</StackPanel>
</DataTemplate>
</ContextMenu.ItemTemplate>
</ContextMenu.Template>
</ContextMenu>
</DataTemplate>
</TabItem.HeaderTemplate>
</TabItem>
Post this change I could see only a LisBox being shown clicking upon toggle button. I am not able to visualize the Data template that I had set (Checkbox). Data binding is also not working. Not able to figure out what could be the issue.
You should bind the ItemsSource property of the ListBox to the ItemsSource of the ContextMenu and define an ItemTemplate for the ListBox:
<ContextMenu ItemsSource="{Binding Collection}">
<ContextMenu.Template>
<ControlTemplate TargetType="ContextMenu">
<Grid Margin="10">
<ListBox ItemsSource="{TemplateBinding ItemsSource}" Width="150" Height="70">
<ListBox.ItemTemplate>
<DataTemplate>
<CheckBox Content="{Binding Name}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</ControlTemplate>
</ContextMenu.Template>
</ContextMenu>
I want to make checkbox list which toggles only if directly clicked on checkbox.
Unfortunately if I make this way:
<ListBox Name="LanguagesListBox">
<ListBox.ItemTemplate>
<DataTemplate>
<ListBoxItem>
<StackPanel Orientation="Horizontal">
<CheckBox/>
<Label Content="{Binding InputLanguage.LayoutName}"/>
</StackPanel>
</ListBoxItem>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I get checkbox not vertially aligned with it's label:
But if I write
<ListBox Name="LanguagesListBox">
<ListBox.ItemTemplate>
<DataTemplate>
<ListBoxItem>
<StackPanel Orientation="Horizontal">
<CheckBox Content="{Binding InputLanguage.LayoutName}"/>
</StackPanel>
</ListBoxItem>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I get checkbox toggle if clicked at the label
How to get both?
Get rid of the ListBoxItem, replace the Label with a TextBlock and set its VerticalAlignment property to Center:
<ListBox Name="LanguagesListBox">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<CheckBox/>
<TextBlock Text="{Binding InputLanguage.LayoutName}" VerticalAlignment="Center" Margin="2,-1,0,0"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
You can adjust the Margin property of the TextBlock to further adjust its position.
This is checkbox behaviour so you can't change it.
You will have to create an user control to build it.
I have a Datagrid, with a column that has a combobox in its header. I want to control the visibility of items in the combobox based on the value of a certain flag.
This is how my XAML looks:
<DataGrid x:Name="Table1" Height="{Binding ElementName=ElasticOne1,Path=ActualHeight}" Width="{Binding ElementName=ElasticOne1,Path=ActualWidth}" Padding="5,5,5,5" IsReadOnly="True"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch" SelectionMode="Single" >
<DataGrid.Columns>
<DataGridTextColumn x:Name="Column2" Header="Source" Width="80">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Margin="0">
<StackPanel.Resources>
<BooleanToVisibilityConverter x:Key="BoolToVis"/>
</StackPanel.Resources>
<TextBlock Text="{Binding Content, RelativeSource={RelativeSource Mode=TemplatedParent}}" Margin="5"/>
<ComboBox HorizontalAlignment="Stretch" Margin="0" >
<ComboBoxItem Tag="0" IsSelected="True">All</ComboBoxItem>
<ComboBoxItem Visibility="{Binding ShowCopybookInSourceCombobox, Converter={StaticResource BoolToVis}}">Copybook</ComboBoxItem>
<ComboBoxItem>Prototype</ComboBoxItem>
</ComboBox>
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
</DataGrid.Columns>
And this is the declaration of the flag in code:
Public ReadOnly Property ShowCopybookInSourceCombobox As Boolean
Get
Return myFlag1 Or myFlag2
End Get
End Property
No matter what the value of my flag, the combobox item is always showing. I haven't seen any examples so far of binding the visibility of a comboboxitem this way. Am I on the wrong path?
Thanks for all your input.
Edit: BooleanToVisibilityConverter is a built-in class that I am using - https://msdn.microsoft.com/en-us/library/system.windows.controls.booleantovisibilityconverter(v=vs.110).aspx
What in the world is wrong with this ListBox? It is showing items as plain strings, not using the template I have provided:
<ListBox>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Ellipse Width="20" Height="20" Fill="LightBlue" />
<TextBlock Text="{TemplateBinding Content}" Foreground="Red" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.Items>
<ListBoxItem>html</ListBoxItem>
<ListBoxItem>head</ListBoxItem>
<ListBoxItem>body</ListBoxItem>
<ListBoxItem>table</ListBoxItem>
<ListBoxItem>tr</ListBoxItem>
<ListBoxItem>td</ListBoxItem>
</ListBox.Items>
</ListBox>
From the Remarks section in the ItemTemplate MSDN page:
When you set an ItemTemplate on an ItemsControl, the UI is generated
as follows (using the ListBox as an example):
1.During content generation, the ItemsPanel initiates a request for the ItemContainerGenerator to create a container for each data item.
For ListBox, the container is a ListBoxItem. The generator calls back
into the ItemsControl to prepare the container.
2.Part of the preparation involves the copying of the ItemTemplate of the ListBox to be the ContentTemplate of the ListBoxItem.
3.Similar to all ContentControl types, the ControlTemplate of a ListBoxItem contains a ContentPresenter. When the template is applied,
it creates a ContentPresenter whose ContentTemplate is bound to the
ContentTemplate of the ListBoxItem.
4.Finally, the ContentPresenter applies that ContentTemplate to itself, and that creates the UI.
These steps are apparently not executed when you create ListBoxItem instances directly in XAML. It is however not strictly necessary to bind the ItemSource property. You may also directly set items like this:
<ListBox xmlns:sys="clr-namespace:System;assembly=mscorlib">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Ellipse Width="20" Height="20" Fill="LightBlue" />
<TextBlock Text="{TemplateBinding Content}" Foreground="Red" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.Items>
<sys:String>html</sys:String>
<sys:String>head</sys:String>
<sys:String>body</sys:String>
<sys:String>table</sys:String>
<sys:String>tr</sys:String>
<sys:String>td</sys:String>
</ListBox.Items>
</ListBox>
public class MyViewModel
{
public List<String> Items
{
get { return new List<String> { "html", "head", "body","table","tr","td" }; }
}
}
//This can be done in the Loaded event of the page:
DataContext = new MyViewModel();
Your XAML
<ListBox Margin="20" ItemsSource="{Binding Items}">
<ListBox.ItemTemplate>
<DataTemplate>
<Ellipse Width="20" Height="20" Fill="LightBlue" />
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I'm trying to add MenuItems into a DropDropButton control and control the visibility
of the buttons using the IsSelected property of TabItem, however the visibility
of the MenuItems do not change. I applied the same binding on a standard
button it the visibility works as expected. Does anyone know what is going on here?
Here is a sample of what I'm trying to do:
<StackPanel>
<Button Content="Hi" Visibility="{Binding ElementName=tabItem1, Path=IsSelected, Converter={StaticResource VisibilityConverter}}"/>
<toolkitEx:DropDownButton Content="Button 1">
<toolkitEx:DropDownButton.DropDownContent>
<StackPanel>
<MenuItem Header="Visibile for tabItem1" Visibility="{Binding ElementName=tabItem1, Path=IsSelected, Converter={StaticResource VisibilityConverter}}"/>
<MenuItem Header="Visibile for tabItem2" Visibility="{Binding ElementName=tabItem2, Path=IsSelected, Converter={StaticResource VisibilityConverter}}"/>
</StackPanel>
</toolkitEx:DropDownButton.DropDownContent>
</toolkitEx:DropDownButton>
<TabControl HorizontalAlignment="Stretch" Name="tabControl1" VerticalAlignment="Stretch" >
<TabItem Header="tabItem1" x:Name="tabItem1">
<Grid />
</TabItem>
<TabItem Header="tabItem2" x:Name="tabItem2">
<Grid />
</TabItem>
</TabControl>
</StackPanel>
Thanks!