Collapse details in listbox by clicking a button - c#

I'm trying do make something like this: when you click the button, the listboxitem collapses and shows some additional information:
I have already made something similar: details are showed when the whole item item is clicked.
Any ideas how to modify this style so collapsing will take place only if the button (or near it) is clicked?
Code:
<Style x:Key="collapsingGridStyle" TargetType="{x:Type Grid}">
<Style.Triggers>
<DataTrigger
Binding="{Binding
Path=IsSelected,
RelativeSource=
{
RelativeSource
Mode=FindAncestor,
AncestorType={x:Type ListBoxItem}
}
}"
Value="False">
<Setter Property="Grid.Visibility"
Value="Collapsed"/>
</DataTrigger>
</Style.Triggers>
</Style>

There are many ways how can you achieve this behavior. For example, you can use expander in listboxitem template.

Related

WPF: Conditionally put focus on checkbox and button

I want to set focus on conditionally in a WPFform. Here I have two types of control. One is 'checkbox' and other one is button. The checkboxes are getting enabled on some condition, however the button control(s) are visible by default. I am able to put focus on button(s) whether checkboxes are getting enabled or not. Though checkboxes should get focus over button when checkboxes are getting enabled. Kindly, suggest an approach to achieve this please. I have used following code to achieve focus on button(s)
<Style x:Key="FocusElement" TargetType="Grid">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=chkCA, Path=IsVisible}" Value="True">
<Setter Property="FocusManager.FocusedElement" Value="{Binding ElementName=chkCA}"/>
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=btnSaveAll, Path=IsVisible}" Value="True">
<Setter Property="FocusManager.FocusedElement" Value="{Binding ElementName=btnSaveAll}"/>
</DataTrigger>
</Style.Triggers>
</Style>
Thanks!

Bind visibility of a control to combobox selection

I have a combobox which is bound to an Enum datatype. Right now the combobox binding works fine but when I tried to bind the visibility of a checkbox to the combobox selection, this binding is not working as expected. What I wanted to do was whenever the combobox selection is "Restore", I want a checkbox to be visible. Below is the code that I am using.
<CheckBox.Style>
<Style TargetType="CheckBox">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=cmbOperation, Path=SelectedValue}" Value="Restore">
<Setter Property="Visibility" Value="Visible"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</CheckBox.Style>
I tried changing the Path between SelectedValue, SelectedItem , SelectedValue.TosString() (hopelessly) but I am not getting the checkbox to change its visibility whenever the combobox has "Restore" as its selection. Should I be making any changes in the Enum that I am binding to the Combobox ? If not, what else am I doing wrong?
I'm willing to bet that you've set Visibility on the CheckBox in the XAML:
<CheckBox
Visibility="Collapsed"
>
However, due to the rules of Dependency Property Value Precedence in WPF, that will override anything that happens in the Style. This is by design and it's not a bad idea when you think through all the implications, but it bites everybody who's new to WPF.
It's an easy fix: Just set the starting value in a Setter in the Style. What the Style does, the Style can undo.
<CheckBox
>
<CheckBox.Style>
<Style TargetType="CheckBox">
<Setter Property="Visibility" Value="Collapsed" />
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=cmbOperation, Path=SelectedValue}" Value="Restore">
<Setter Property="Visibility" Value="Visible" />
</DataTrigger>
</Style.Triggers>
</Style>
</CheckBox.Style>
</CheckBox>

Deriving (Expanding) a Control Template in WPF

I have this DataGrid I want to change the Disabled behaviour (xaml);
I want to change this small part in the template.
If it is not possible i dont mind to use:
<Setter Property="OverridesDefaultStyle" Value="True"/>
And To replace the entire xaml (template) of my control, But I need the complete template to copy paste and help where to change the Disabled look-like part.
Can anyone help me?
EDIT: It's been pointed out that all the default control templates are available at MSDN which makes the below relevant, but I'll leave it here for interest.
Given an instance of a control you get serialize the markup for the control template using the System.Windows.Markup.XamlWriter class.
To get a control template:
string markup = System.Windows.Markup.XamlWriter.Save(control.Template);
To get a complete dump (including triggers etc) of the control template use.
StringBuilder markupBuilder = new StringBuilder();
XmlWriter writer = XmlWriter.Create(markupBuilder);
System.Windows.Markup.XamlDesignerSerializationManager manager =
new System.Windows.Markup.XamlDesignerSerializationManager(writer);
manager.XamlWriterMode = System.Windows.Markup.XamlWriterMode.Value;
// data grid named dataGrid1
var template = dataGrid1.Template;
System.Windows.Markup.XamlWriter.Save(dataGrid1.Template, manager);
string markup = markupBuilder.ToString();
If you just looking to change the foreground color of the DataGrid when it's disabled, you should be able to use styles together with triggers rather than replacing the entire template.
<DataGrid>
<DataGrid.Resources>
<Style
TargetType="{x:Type DataGridColumnHeader}">
<Style.Triggers>
<DataTrigger
Binding="{Binding IsEnabled, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}"
Value="False">
<Setter
Property="Foreground"
Value="Green" />
</DataTrigger>
</Style.Triggers>
</Style>
<Style
TargetType="{x:Type DataGridCell}">
<Style.Triggers>
<DataTrigger
Binding="{Binding IsEnabled, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}"
Value="False">
<Setter
Property="Foreground"
Value="Green" />
</DataTrigger>
</Style.Triggers>
</Style>
</DataGrid.Resources>
<!-- Column Definitions -->
</DataGrid>
Adding the above 2 styles to the DataGrid's resources collection will, set the foreground of each column header and data row cell to green when the DataGrid is disabled.
To define the disabled behavior of any control, you should change the Disabled visual state accordingly in the control template.

Trigger on ContextMenu.IsOpen in XAML

Here's what I'm trying to do:
<Style x:Key="TreeViewItemStyle">
<Setter Property="TreeViewItem.ContextMenu" Value="{StaticResource ContextMenu}" />
<Style.Triggers>
<Trigger Property="TreeViewItem.ContextMenu.IsOpen" Value="True">
<Setter Property="TreeViewItem.BitmapEffect">
<Setter.Value>
<OuterGlowBitmapEffect GlowColor="Yellow" GlowSize="2"/>
</Setter.Value>
</Setter>
</Trigger>
</Style>
...
But it is obviously not working because Property="TreeViewItem.ContextMenu.IsOpen" is not recognized. Any suggestions to what I need to change?
You can bind to the IsOpened property of the context menu using a DataTrigger:
<DataTrigger Binding="{Binding ContextMenu.IsOpen, RelativeSource={RelativeSource Self}}" Value="True">
<Setter Property="Background" Value="Green"/>
</DataTrigger>
Unfortunately, since all of the items in TreeView share the same ContextMenu, that will highlight all of them at once. There doesn't seem to be a property that lets you find out which FrameworkElement opened the ContextMenu.
You could handle the ContextMenuOpening and ContextMenuClosing events on the TreeViewItem, since those will bubble up from the control that handled the click and pass through the right TreeViewItem. If you want to do it in XAML, you could use an EventTrigger to start a one-frame animation that changes your property. The cleanest option may be to write an attached behavior that handles the ContextMenuOpening and ContextMenuClosing events and sets an attached property to true when the context menu is open.

Applying a DataTrigger to a Button Whose Binding Comes From Another Control?

I'm trying to apply a DataTrigger to a Button and it depends on a property from the currently selected item of a TreeView. The idea is that I want to change the text of a Button depending on a property of the selected item.
What I have looks like this:
<Button x:Name="m_AddObject" Margin="192.708,0.909,6,6.363" Click="AddObject_Click" >
<DataTrigger Binding="{Binding ElementName=ObjectTreeView, Path=SelectedItem.Removable}" Value="true">
<Setter TargetName="m_AddObject" Property="Content" Value="Remove" />
</DataTrigger>
</Button>
But I can't get it to compile. The Setter complains about "Content" not being valid because it doesn't have a qualifying type name, but if I change it to "Button.Content" it then complains of "Object reference not set to an instance of an object".
I also tried:
<Setter TargetName="m_AddObject.Content" Value="Remove" />
While that compiles, it didn't work either.
I'm stumped.
Any ideas?
Thanks!
DataTriggers should be defined in a Style for the button. What you're trying to do above is essentially use a DataTriggers as the "label" (the "Content", as WPF puts it) for the button (instead of, say, "OK").
This is ad-hoc, so it might not be totally correct, but it's closer to what you want:
<Button x:Name="m_AddObject"
Margin="192.708,0.909,6,6.363"
Click="AddObject_Click">
<Button.Style>
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=ObjectTreeView, Path=SelectedItem.Removable}" Value="True">
<Setter Property="Content" Value="Remove" />
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>

Categories