One SelectedItem For Multiple Wpf Controls - c#

I have a list box Bound to XML data correctly , but i have multiple Tree Views inside this listbox which you can select item for every one of them!
i want single item selecting from all of these tree views. which every one of those are inside an unique expander.
if you look at my xml data ,consider i have 2 groups inside xml , i can select item for both of those groups in listbox which now they are different treeviews in my ui , and i want single item selecting for all this listbox items.
<ListBox Background="Transparent" BorderThickness="0" SelectedValue="{Binding SelectedMenuValue,Mode=TwoWay}" ItemsSource="{Binding Path=Items,Source={StaticResource XmlSourceMenu}}">
<ListBox.Resources>
<DataTemplate DataType="{x:Type revoxml:Group}">
<Expander Header="{Binding Title}">
<TreeView ItemsSource="{Binding Menus}">
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding}">
<StackPanel Orientation="Horizontal" Margin="10 0">
<fa:ImageAwesome Height="30" Width="30" VerticalAlignment="Center" Margin="5" Icon="{Binding Icon}" />
<TextBlock Text="{Binding Title}" Height="30" VerticalAlignment="Center" Margin="5"/>
</StackPanel>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
</Expander>
</DataTemplate>
<DataTemplate DataType="{x:Type revoxml:SubMenu}">
<StackPanel Orientation="Horizontal" Margin="10 0">
<fa:ImageAwesome Height="30" Width="30" VerticalAlignment="Center" Margin="5" Icon="{Binding Icon}" />
<TextBlock Text="{Binding Title}" Height="30" VerticalAlignment="Center" Margin="5"/>
</StackPanel>
</DataTemplate>
</ListBox.Resources>
</ListBox>
for easier understanding data for this listbox comming from xml file like this :
<MainMenu>
<Group Title="title">
<SubMenu Icon="Inbox" Title="inbox" Tag="38"/>
<SubMenu Icon="CommentingOutline" Title="New Message" Tag="37"/>
<SubMenu Icon="Tachometer" Title="Archive" Tag="39"/>
<Menu Icon="CartArrowDown" Title="purchases" >
<SubMenu Icon="CartArrowDown" Title="new" Tag="26"/>
<SubMenu Icon="CartPlus" Title="list" Tag="28"/>
</Menu>
</Group>
<SubMenu Icon="InfoCircle" Title="info" Tag="6000" />
<SubMenu Icon="Close" Title="close" Tag="0"/>
</MainMenu>

this should solve it ! but you need to implement your own selected item, or you could change groupboxes to expander and items control to tree view to match your code
<Style TargetType="StackPanel" x:Key="HoverStackPanelStyle">
<Setter Property="Background" Value="Transparent"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="Red"/>
</Trigger>
</Style.Triggers>
</Style>
<ScrollViewer>
<HeaderedItemsControl Background="Transparent" ItemsSource="{Binding Path=Items,Source={StaticResource XmlSourceMenu}}">
<ItemsControl.Resources>
<DataTemplate DataType="{x:Type revoxml:SubMenu}">
<StackPanel Orientation="Horizontal" Margin="10 0" Style="{StaticResource HoverStackPanelStyle}">
<fa:ImageAwesome Height="30" Width="30" VerticalAlignment="Center" Margin="5" Icon="{Binding Icon}" />
<TextBlock Text="{Binding Title}" FontFamily="{StaticResource nazanin}" Height="30" VerticalAlignment="Center" Margin="5"/>
</StackPanel>
</DataTemplate>
<HierarchicalDataTemplate DataType="{x:Type revoxml:Menu}" ItemsSource="{Binding Menus}">
<GroupBox Header="{Binding Title}" Margin="0 5">
<ItemsControl ItemsSource="{Binding Menus}">
<ItemsControl.Resources>
<DataTemplate DataType="{x:Type revoxml:SubMenu}">
<StackPanel Name="StackPanel" Orientation="Horizontal" Margin="10 0" Style="{StaticResource HoverStackPanelStyle}">
<fa:ImageAwesome Height="30" Width="30" VerticalAlignment="Center" Margin="5" Icon="{Binding Icon}" />
<TextBlock Text="{Binding Title}" FontFamily="{StaticResource nazanin}" Height="30" VerticalAlignment="Center" Margin="5"/>
</StackPanel>
</DataTemplate>
</ItemsControl.Resources>
</ItemsControl>
</GroupBox>
</HierarchicalDataTemplate>
</ItemsControl.Resources>
</HeaderedItemsControl>
</ScrollViewer>

Related

TreeView subcollection autosort when properties changes

I would like to sort the second level of my TreeView. The sorting depends on two different conditions depending on the FieldType and the Order properties. In my case it is possible that the order increases or decreases by the user. The user uses arrow up and down buttons. How can I keep the list sortet if an item is added or removed and the user changes the Order property?
My current TreeView:
<TreeView Grid.Row="0" x:Name="tvImages" ItemsSource="{Binding SelectedTemplate.Images}">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type entities:TemplateImageDTO}" ItemsSource="{Binding FieldSections}">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Order, StringFormat=Image {0}}" Margin="0,3,0,0"/>
</StackPanel>
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type entities:FieldSectionDTO}">
<DockPanel LastChildFill="False" HorizontalAlignment="Stretch" Width="Auto">
<StackPanel DockPanel.Dock="Left" Orientation="Horizontal">
<TextBlock Text="{Binding FieldType, Converter={StaticResource enumConverter}}" Margin="0,3,0,0" />
<TextBlock Text=" - Field " Margin="0,3,0,0" />
<TextBlock Text="{Binding Order, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Margin="0,3,0,0" />
</StackPanel>
<StackPanel Orientation="Horizontal" DockPanel.Dock="Right" Margin="0,0,10,0">
<Button Width="24" Height="24" Style="{DynamicResource MahApps.Metro.Styles.MetroCircleButtonStyle}">
<iconPacks:PackIconFontAwesome Kind="AngleUpSolid" Foreground="{DynamicResource AccentColorBrush}" />
</Button>
<Button Width="24" Height="24" Margin="10,0,0,0" Style="{DynamicResource MahApps.Metro.Styles.MetroCircleButtonStyle}">
<iconPacks:PackIconFontAwesome Kind="AngleDownSolid" Foreground="{DynamicResource AccentColorBrush}" />
</Button>
</StackPanel>
</DockPanel>
</HierarchicalDataTemplate>
</TreeView.Resources>
</TreeView>
I found my Solution here: https://stackoverflow.com/a/19363888/6751312
After the user clicked the arrow up and down button, I increase and decrease the order property and resort the list.

wpf .net 4.5 Isvirtualizng when grouping updating list wrongly

i am binding a lot of images in listview using following code
lvImages.ItemsSource = lstVisualDuplicateImage;
following properties used in ListView
here is my complete XAML Binding ang Grouping is performed iam using .net 4.5
<ListView Name="lvImages" Margin="0,2,0,38"
VirtualizingPanel.IsContainerVirtualizable="True"
VirtualizingPanel.IsVirtualizing="True"
VirtualizingPanel.IsVirtualizingWhenGrouping="True"
VirtualizingPanel.VirtualizationMode="Recycling" Grid.Row="1"
SelectionChanged="ListViewFiles_SelectionChanged"
ContextMenuOpening="ListViewFiles_ContextMenuOpening"
ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Disabled" Grid.RowSpan="3">
<ListView.ContextMenu>
<ContextMenu>
<MenuItem x:Name="menuOpen" Header="Open" Click="menuOpen_Click" />
<MenuItem x:Name="menuOpenFileLocation" Header="Open File Location" Click="menuOpenFileLocation_Click" />
<MenuItem x:Name="menuRemove" Header="Remove" Click="menuRemove_Click" />
<MenuItem x:Name="menuOpenProperties" Header="Properties" Click="menuOpenProperties_Click" />
</ContextMenu>
</ListView.ContextMenu>
<ListView.ItemsPanel>
<ItemsPanelTemplate >
<!--<VirtualizingStackPanel Orientation="Horizontal" >-->
<WrapPanel Orientation="Horizontal"/>
<!--</VirtualizingStackPanel>-->
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.View>
<GridView >
<GridView.ColumnHeaderContainerStyle>
<Style TargetType="GridViewColumnHeader">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</GridView.ColumnHeaderContainerStyle>
<GridViewColumn Width="160" Header="Group Details" >
<GridViewColumn.CellTemplate>
<DataTemplate>
<Border CornerRadius="2" BorderThickness="2" BorderBrush="#B3B4B5">
<StackPanel >
<StackPanel Orientation="Horizontal">
<CheckBox Margin="0" MinWidth="22" Name="chkSelRow" IsChecked="{Binding Path=Checked}" Unchecked="lvFileItem_UnChecked" Checked="lvFileItem_Checked" />
<TextBlock Margin="5,0,0,0" Text="{Binding Path=size}" />
</StackPanel>
<Image Height="120" Width="120">
<Image.Source>
<BitmapImage
DecodePixelHeight="120"
DecodePixelWidth="120"
UriSource="{Binding Path=getUri, Mode=OneWay,UpdateSourceTrigger=Explicit }"
CreateOptions="IgnoreColorProfile"
CacheOption="None" />
</Image.Source>
</Image>
<StackPanel Orientation="Vertical">
<TextBlock Margin="5,0,0,3" Text="{Binding Path=FileName}" />
</StackPanel>
</StackPanel>
</Border>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Expander IsExpanded="True" Style="{DynamicResource newExpanderStyle}" >
<Expander.Header>
<StackPanel Orientation="Horizontal">
<Button Content="View Gropu" Style="{StaticResource LinkButton}" Foreground="Blue" Margin="10,5,0,0" x:Name="btnViewGroup" ></Button>
<TextBlock Text=" Group NO " FontSize="12" Foreground="Black" Margin="30,0,0,0" HorizontalAlignment="Center" VerticalAlignment="Center" />
<TextBlock Text="(" FontSize="14" Margin="0,2,0,0" Foreground="Black" />
<TextBlock Text="{Binding Name}" FontWeight="Bold" Foreground="Black" FontSize="12" HorizontalAlignment="Center" VerticalAlignment="Center" />
<TextBlock Text=")" FontSize="14" Margin="0,2,0,0" Foreground="Black" />
<TextBlock Text=" Items in Group" FontSize="12" Foreground="Black" Margin="60,0,0,0" HorizontalAlignment="Center" VerticalAlignment="Center" />
<TextBlock Text="(" FontSize="14" Margin="0,2,0,0" Foreground="Black" />
<TextBlock Text="{Binding ItemCount}" FontSize="12" Foreground="Black" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center" />
<TextBlock Text=")" FontSize="14" Margin="0,2,0,0" Foreground="Black" />
</StackPanel>
</Expander.Header>
<ItemsPresenter />
</Expander>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
</ListView>
no of item is complete in listview
Problem is images repeat and change their position in groups not loading correctly and refreshing is there any way to virtualize groups.
You have changed the ListView.ItemsPanel from a VirtualizingStackPanel to a WrapPanel. Virtualization only works correctly when the panel supports virtualization. In this case, the standard WrapPanel does not support virtualization.

Wpf ListView Is it possible to order the group items differently from the group headers?

I have a List View Control with grouping and sorting.
The group headers are Dates in descending order.
I am trying to find out how to order the grouped items under each group header in an ascending order, but cant figure out how to get it done or if it is even possible with ListView.
Here is the XAML I have so far.
Note: ScheduledItemSearchResults is an observable collection of ScheduleItems each item has a Title and a ScheduleDate property.
<Grid x:Name="TxScheduleItemResults"
Grid.Column="1">
<Grid.Resources>
<CollectionViewSource Source="{Binding ScheduledItemSearchResults}" x:Key="scheduledItems">
<CollectionViewSource.SortDescriptions>
<scm:SortDescription PropertyName="Value.ScheduleDateTime" Direction="Descending"/>
</CollectionViewSource.SortDescriptions>
<CollectionViewSource.GroupDescriptions>
<dat:PropertyGroupDescription PropertyName="Value.ScheduleDateTime.Date" />
</CollectionViewSource.GroupDescriptions>
</CollectionViewSource>
</Grid.Resources>
<ListView x:Name="ScheduledItemResultsList"
Style="{StaticResource TransparentListViewStyle}"
ItemContainerStyle="{StaticResource alternatingListViewItemStyle}"
AlternationCount="2"
ItemsSource="{Binding Source={StaticResource scheduledItems}}"
>
<ListView.View>
<GridView>
<GridViewColumn Header="Scheduled Items"
Width="{Binding ElementName=ScheduledItemResultsList, Path=ActualWidth}"
>
<GridViewColumn.HeaderTemplate>
<DataTemplate>
<TextBlock Style="{StaticResource ModuleGroupHeader}"
Text="{Binding}"
/>
</DataTemplate>
</GridViewColumn.HeaderTemplate>
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox Text="{Binding Value.Title}" Width="200"/>
<TextBox Text="{Binding Value.ScheduleDateTime, StringFormat={}{0:HH:mm:ss}}" Width="120"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Expander IsExpanded="True">
<Expander.Header>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=Items[0].Value.ScheduleDateTime.Date, StringFormat={}{0:dd/MM/yyyy}}" FontWeight="Bold" Foreground="Gray" FontSize="22" VerticalAlignment="Bottom" />
<TextBlock Text="{Binding ItemCount}" FontSize="22" Foreground="Green" FontWeight="Bold" FontStyle="Italic" Margin="10,0,0,0" VerticalAlignment="Bottom" />
<TextBlock Text=" item(s)" FontSize="22" Foreground="Silver" FontStyle="Italic" VerticalAlignment="Bottom" />
</StackPanel>
</Expander.Header>
<ItemsPresenter />
</Expander>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
</ListView>
</Grid>
You can have several SortDescriptions elements in one CollectionViewSource:
<CollectionViewSource Source="{Binding ScheduledItemSearchResults}" x:Key="scheduledItems">
<CollectionViewSource.SortDescriptions>
<!--This will sort groups-->
<scm:SortDescription PropertyName="Value.ScheduleDateTime.Date" />
<!--This will items-->
<scm:SortDescription PropertyName="Value.ScheduleDateTime" Direction="Descending"/>
</CollectionViewSource.SortDescriptions>
<CollectionViewSource.GroupDescriptions>
<dat:PropertyGroupDescription PropertyName="Value.ScheduleDateTime.Date" />
</CollectionViewSource.GroupDescriptions>
</CollectionViewSource>
P.S. I don't quite get how exactly you want to sort it, but if you sort first groups and then items it should work.

Tooltip style. Can't bind to datacontext

i have one problem with tooltip.
I want to add templated tooltip to button with some information inside.
Here the button with tooltip, which datacontext bounded to some viewmodel:
<fluent:Button DataContext="{Binding NewConnections, Source={StaticResource Locator}}" Command="{Binding AddCloudStorageAccount}" Header="Add Account">
<fluent:Button.LargeIcon>
<Image Source="pack://application:,,,/Icons;component/UI/v1/add_account.png" Width="48"/>
</fluent:Button.LargeIcon>
<fluent:Button.ToolTip>
<ToolTip DataContext="{Binding UserInput.AddAccountsButtonInfo, Source={StaticResource Locator}}" Style="{StaticResource ButtonTooltip}"></ToolTip>
</fluent:Button.ToolTip>
</fluent:Button>
Style:
<Style TargetType="ToolTip" x:Key="ButtonTooltip">
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Border Background="LightYellow" BorderThickness="0.5" BorderBrush="Maroon">
<StackPanel Orientation="Vertical" Margin="3">
<TextBlock x:Name="_txtText" Text="{Binding Title}"></TextBlock>
<TextBlock x:Name="_txtDescription" Margin="0 10 0 0" Text="{Binding Description}"></TextBlock>
<TextBlock x:Name="_txtHotKeyDescription" Margin="0 10 0 0" Text="{Binding HotKeyDescription}"></TextBlock>
</StackPanel>
</Border>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
I set some breakpoints to see if viewmodel is accessed. And it's ok. But properties like Title not accessed at all and i see only empty rectangle without any text
Do someone have some ideas?
Just resolved it(set datacontext in border). Maybe someone will be interested in:
<Style TargetType="ToolTip" x:Key="ButtonTooltip">
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Border Background="LightYellow" BorderThickness="0.5" BorderBrush="Maroon" DataContext="{Binding Path=DataContext, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ToolTip}}}">
<StackPanel Orientation="Vertical" Margin="3">
<TextBlock x:Name="_txtText" Text="{Binding Title}"></TextBlock>
<TextBlock x:Name="_txtDescription" Margin="0 10 0 0" Text="{Binding Description}"></TextBlock>
<TextBlock x:Name="_txtHotKeyDescription" Margin="0 10 0 0" Text="{Binding HotKeyDescription}"></TextBlock>
</StackPanel>
</Border>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>

How to move text to center of ListBox?

I have almost tried everything but for some reason it is not working
<StackPanel Orientation="Vertical" Grid.Row="1" Margin="5,30,5,10">
<TextBlock Text="View Options" FontSize="25" Style="{StaticResource PhoneTextNormalStyle}"/>
<ListBox HorizontalContentAlignment="Stretch" Background="Red" ItemsSource="{Binding Path=ViewOptions}" Margin="10">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock HorizontalAlignment="Center" TextAlignment="Center" Text="{Binding}" FontSize="35" Margin="20" Style="{StaticResource PhoneTextNormalStyle}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
Above XAML give me
How to move the textblock to center of listboxitem?
<StackPanel Orientation="Vertical" Grid.Row="1" Margin="5,30,5,10">
<TextBlock Text="View Options" FontSize="25" Style="{StaticResource PhoneTextNormalStyle}"/>
<ListBox x:Name="listBox" HorizontalContentAlignment="Stretch" ItemsSource="{Binding Path=ViewOptions}" Margin="10,30,10,10">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock HorizontalAlignment="Center" TextAlignment="Center" Text="{Binding}" FontSize="35" Margin="20" Style="{StaticResource PhoneTextNormalStyle}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
You need to change the HorizontalContentAlignment to center
<StackPanel Orientation="Vertical" Grid.Row="1" Margin="5,30,5,10">
<TextBlock Text="View Options" FontSize="25" Style="{StaticResource PhoneTextNormalStyle}"/>
<ListBox HorizontalContentAlignment="Center" Background="Red" ItemsSource="{Binding Path=ViewOptions}" Margin="10">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock HorizontalAlignment="Center" TextAlignment="Center" Text="{Binding}" FontSize="35" Margin="20" Style="{StaticResource PhoneTextNormalStyle}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I just tried this and it worked. Two possible differences:
My data source was a simple List<string>.
I removed the references to your styles (i.e. PhoneTextNormalStyle).
Are you binding to simple data?
Does PhoneTextNormalStyle specify left-alignment?

Categories

Resources