Develop Reference

How to collapse contents of a databound ListBoxItem when a button is clicked in WPF MVVM

I have a ListBox in my WPF MVVM app using the following code:
<GroupBox Grid.Column="0" Margin="0,0,0,-58">
<DockPanel>
<TextBlock DockPanel.Dock="Top"
HorizontalAlignment="Center"
Margin="0,0,0,8"
FontWeight="Bold"
Text="{x:Static p:Resources.AvaliableLEDsLabel}" />
<ListBox Name="AvailableLEDsListbox" SelectionMode="Extended"
dd:DragDrop.IsDragSource="True"
dd:DragDrop.IsDropTarget="True"
dd:DragDrop.DropHandler="{Binding}"
ItemTemplate="{StaticResource DataTemplateListBoxItem}"
ItemsSource="{Binding AvailableLeds}"
ScrollViewer.VerticalScrollBarVisibility="Hidden"
>
<ListBox.GroupStyle>
<StaticResource ResourceKey="StyleListBoxGroup" />
</ListBox.GroupStyle>
</ListBox>
</DockPanel>
</GroupBox>
This displays grouped lists of devices, with LEDs under them. The DataTemplate is the following:
<GroupStyle x:Key="StyleListBoxGroup">
<GroupStyle.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Button Command="{Binding HideGroupCommand}">X</Button>
<TextBlock VerticalAlignment="Center"
HorizontalAlignment="Left"
FontWeight="Bold"
Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
<DataTemplate x:Key="DataTemplateListBoxItem">
<TextBlock x:Name="LedId" Text="{Binding LedId}"/>
</DataTemplate>
I would like to make the X button in the header hooked up to the HideGroupCommand toggle the hiding of all the items under that particular header. How would I go about doing this? Thanks in advance.

You have few options.
First one :
You would need to have a property in your view model something like 'ListBoxVisibility' then u would bind that property to your UI. In command text u just changed visibility property of that property in view model- so u have it reflected on UI. This visibility property can be of type 'bool' , or 'Visibility' or whatever. Only if it's type of Visibility u don't need converter when binding.
NOTE : Some people use it - even though it kinda goes out of general principel of MVVM patter. But sometimes u have to do it.
Second
If wanna stick to MVVM , then u need to fully separate your UI from your viewmodel. Create click event and change visibility.

c# WPF Combobox selected item text cut off

Not sure where in the combobox style I can fix this. If you need me to post code let me know, but the style code is pretty long. Below is the combobox less the style.
<ComboBox x:Name="user_combobox" Margin="115,62,0,0" Height="26" Width="306"
HorizontalAlignment="Left" VerticalAlignment="Top"
IsReadOnly="True"
Foreground="White" Background="SteelBlue" BorderBrush="White" OpacityMask="RoyalBlue"
Style="{StaticResource ComboBoxFlatStyle}"
ItemContainerStyle="{StaticResource ComboBoxItemFlatStyle}"
MaxDropDownHeight="{Binding User_Combobox_Height}"
ItemsSource="{Binding Username_List}">
<ComboBox.Resources>
<SolidColorBrush x:Key="ComboBoxHighlightBrush" Color="RoyalBlue" />
</ComboBox.Resources>
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=username}" Margin="0,-1,0,1" Height="22" FontSize="16" FontWeight="Bold" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>

A wild guess, but is it possible that in your "ComboBoxFlatStyle" Style, you're setting a value for Template property of the ComboBox? If so, check your Margin value for any Control you've set there, you probably have some top or bottom margin that are too restrictive.

I know, this answer is pretty old, but in case anyone faces the same issue again:
I had the same exact problem. I solved it thanks to the answer of Roger Leblanc. Changing widths and heights didn't change anything. But adding a Padding of 0 (or higher) solved it.

XAML List view Inside list view

I have this template (c# windows univeral app w8.1)
<ListView ItemsSource="{Binding SelectedSongStanzas}">
<ListView.ItemTemplate>
<DataTemplate>
<ListView ItemsSource="{Binding Verses}">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Left">
<TextBlock Padding="0" Text="{Binding Harmonization2}" FontFamily="Lucida Console" FontSize="16" Foreground="BlueViolet" VerticalAlignment="Bottom"/>
<TextBlock Padding="0" Text="{Binding OriginalText}" FontFamily="Lucida Console" FontSize="16" VerticalAlignment="Top"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
And This is how it look
If see at image the first list view item shows the first ListItem lines are together with no spaces between them, but the second line shows a big gap between them.
Note:
1) I'm ,was trying with Grid instead stackpanel but looks same way.
2) If Try fixed height texts could be cut.
What can i do to force all ListItems looks the same way?
(Just Like the firs Item)
EDIT ONE: Based on the comments think the problem could be the default styles from windows universal app template. And now could be another question.
How to edit / change / Override those styles on that template ?

Finally as #AnjumSKhan post, the problem wasn't at XAML code, just my structure Has a Literal char \n
Something like this "some text here" was stored as => "\nsome text here", just i remove those new lines literals an now all looks as must be.

Silverlight: ComboBox Behavior

really simple problem, but I guess I have just the wrong definition of combobox:
I'd like to get a simple thing like:
http://www.c-sharpcorner.com/uploadfile/mahesh/combobox-in-silverlight/
But whenever I add a combobox (or a listbox) and set the itemssource, it shows directly all items and I dont have a textbox-like selection.
My approach was quite simple:
In XAML I define:
<StackPanel Orientation="Horizontal">
<TextBlock VerticalAlignment="Center" Style="{StaticResource styleStdWidth}" Text="Spieler 1:" />
<ListBox x:Name="lsbPlayerOne" ItemTemplate="{StaticResource dtName}" Width="300" />
<TextBox x:Name="txtPlayerOnePoints" Style="{StaticResource stylePlayerWidth}" />
</StackPanel>
<DataTemplate x:Name="dtName">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Name}" TextWrapping="Wrap" FontSize="35" FontWeight="Bold" x:Name="txbname"/>
</StackPanel>
</DataTemplate>
And in Code behind I just set the ItemsSource with a List, which has data.
Since the ListBox gets bigger every time I add a item, it gets uglier and uglier.
Am I missing a property, which I didnt find? I did not see anything...
Sorry for the confusing question :)
P.S.: I tried the same as in the example shown in the link. Sadly I cant open the sample project.
Matthias Müller

Your question is unclear. But you are not implementing a combobox in the code you have shown. Why don't you use a combobox and set your itemsource to the list that contains the fields you want to use?
<ComboBox ItemSource={Binding Names}/>

How to have a combobox where the drop down shows two columns but the selection shows only one?

I would google this, but I have no idea how to word it to do a search. My problem is pretty simple: I'm porting an application written in Access, and on one of the forms is a combobox. When you open the dropdown, it displays two columns of info: abbreviations on the left and full names on the right. When you select one though, the selected option in the combobox (the dropdown has closed) shows only the abbreviation. Any idea how to achieve this in WPF?

Here's a different way to do it in XAML. The important part is the TextSearch.TextPath. This will search for the object with the specified name. In this case it is the string called "Foo".
<ComboBox Name="cmbBox" ItemsSource="{Binding Test}" Height="25" IsEditable="True" IsReadOnly="True" TextSearch.TextPath="Foo">
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" TextSearch.Text="{Binding Path=Bar}">
<TextBlock Text="{Binding Path=Foo}"/>
<TextBlock Text="{Binding Path=Bar}" Margin="10 0"/>
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
To set the TextSearch Programmatically all you have to do is:
cmbBox.SetValue(TextSearch.TextPathProperty, "Foo");