TargetName not found - c#

I have two stackpanels on in another, the inner one has visibility "collapsed", it has the name "verborgen.
When mouseOver the inner stackpanel needs to change to visibility "visible".
So i use TargetName="verborgen"
However, it always returns to me that "The name "verborgen" is not recognized
<DataTemplate x:Key="WastebinTemplate">
<ContentControl map:MapLayer.Position="{Binding GeoLocation}">
<ContentControl.Content>
<StackPanel>
<TextBlock Background="{StaticResource Blue}" Text="{Binding Barcode}"/>
<StackPanel x:Name="verborgen" Visibility="Collapsed" Background="{StaticResource Orange}">
<Button Name="btnRemove" Content="Remove wastebin" Click="btnRemove_Click">
</Button>
<Label>Adres</Label>
<TextBox Name="txbAdres" Text="{Binding Address}"/>
<Label>Location type</Label>
<ComboBox ItemsSource="{Binding Source={StaticResource LocationTypeInstance}, Path=LocationTypes}"
DisplayMemberPath="Description" SelectedItem="{Binding LocationType}" SelectedValuePath="ID" SelectedValue="{Binding LocationType.ID}" />
<Label>Capaciteit</Label>
<Slider Minimum="0" Maximum="100" TickFrequency="10" Value="{Binding Capacity}"></Slider>
</StackPanel>
</StackPanel>
</ContentControl.Content>
</ContentControl>
<DataTemplate.Resources>
<Style TargetType="StackPanel">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Visibility" Value="Visible" TargetName="verborgen" />
<Setter Property="Panel.ZIndex" Value="9999"/>
</Trigger>
</Style.Triggers>
</Style>
</DataTemplate.Resources>
</DataTemplate>

Found it, the problem was instead of a datatemplate style I just used a datatemplate.trigger
<Window x:Class="Oefening2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:map="clr-namespace:Microsoft.Maps.MapControl.WPF;assembly=Microsoft.Maps.MapControl.WPF"
xmlns:model="clr-namespace:Oefening2.model"
Title="Wastebins in Kortrijk" WindowState="Maximized">
<Window.Resources>
<model:LocationType x:Key="LocationTypeInstance"/>
<DataTemplate x:Key="WastebinTemplate">
<ContentControl map:MapLayer.Position="{Binding GeoLocation}">
<ContentControl.Content>
<StackPanel>
<TextBlock Background="{StaticResource Blue}" Text="{Binding Barcode}"/>
<StackPanel x:Name="verborgen" Visibility="Collapsed" Background="{StaticResource Orange}">
<Button Name="btnRemove" Content="Remove wastebin" Click="btnRemove_Click">
</Button>
<Label>Adres</Label>
<TextBox Name="txbAdres" Text="{Binding Address}"/>
<Label>Location type</Label>
<ComboBox ItemsSource="{Binding Source={StaticResource LocationTypeInstance}, Path=LocationTypes}"
DisplayMemberPath="Description" SelectedItem="{Binding LocationType}" SelectedValuePath="ID" SelectedValue="{Binding LocationType.ID}" />
<Label>Capaciteit</Label>
<Slider Minimum="0" Maximum="100" TickFrequency="10" Value="{Binding Capacity}"></Slider>
</StackPanel>
</StackPanel>
</ContentControl.Content>
</ContentControl>
<DataTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="verborgen" Property="Visibility" Value="Visible"/>
<Setter Property="Panel.ZIndex" Value="9999" />
</Trigger>
</DataTemplate.Triggers>
</DataTemplate>
</Window.Resources>
<Grid x:Name="Root">
<map:Map x:Name="myMap" CredentialsProvider="AnlnVG80DKkOfS5KLoUofPfy8t0a6AdtJvynRT_rxvV8MQ6cy6eEhQ6MHPBd5P3c" ZoomLevel="14" Center="50.8333,3.2667" MouseDoubleClick="MapWithPushpins_MouseDoubleClick">
<map:MapItemsControl ItemsSource="{Binding Wastebins}" ItemTemplate="{StaticResource WastebinTemplate}" />
</map:Map>
</Grid>
</Window>

Related

Add ToolTip to DataTemplate in WPF TreeView

I'm trying to add a tooltip to children in a TreeView in WPF. However, it appears even in the XAML I can't get a tooltip to render in the treeview children. Can someone please tell me how to get around this?
<Window x:Class="Client_Invoice_Auditor.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Client_Invoice_Auditor"
xmlns:self="clr-namespace:Client_Invoice_Auditor.CoreClientAR"
mc:Ignorable="d"
Title="Client Invoice Auditor" Height="450" Width="1000">
<Window.Resources>
<self:SPConverter x:Key="SPConverter"/>
<self:ErrorExpandConverter x:Key="ErrorExpandConverter"/>
<self:AssignRowConverter x:Key="AssignRowConverter"/>
<self:IssueIconConverter x:Key="IssueIconConverter"/>
</Window.Resources>
<Grid>
<Grid.ColumnDeitions>
</Grid.ColumnDeitions>
<Grid.RowDeitions>
<RowDeition Height="20*"/>
<RowDeition Height="80*"/>
</Grid.RowDeitions>
<Grid Grid.Row="0" Grid.Column="0">
<StackPanel Orientation="Vertical">
<DockPanel VerticalAlignment="Top" Height="20" Panel.ZIndex="1">
<Menu Name="fileMenu" Width="Auto" DockPanel.Dock="Top">
<MenuItem Header="File">
<MenuItem Header="Open Account File" Click="menuOpenFile_Click"/>
<MenuItem Header="Exit" Click="menuExit_Click"/>
</MenuItem>
<MenuItem Header="Options">
<!--<MenuItem Header="Update" Click="update_Click"/>-->
<MenuItem Header="About" Click="about_Click"/>
</MenuItem>
</Menu>
</DockPanel>
<WrapPanel Orientation="Horizontal" HorizontalAlignment="Center" Height="Auto">
<StackPanel Width="Auto" Orientation="Horizontal" HorizontalAlignment="Center">
<Border BorderBrush="MediumAquamarine" BorderThickness="2">
<Label Name="AccountNumber"/>
</Border>
<Border BorderBrush="MediumAquamarine" BorderThickness="2">
<Label Name="AcctDesc"/>
</Border>
<Border BorderBrush="MediumAquamarine" BorderThickness="2">
<Label Name="Organization"/>
</Border>
</StackPanel>
</WrapPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
<Label Margin="20,10,0,0" Content="Activity Date Time" />
<Label Margin="60,10,0,0" Content="Beginning Balance" />
<Label Margin="10,10,0,0" Content="Charge Amount" />
<Label Margin="30,10,0,0" Content="Adjustments" />
<Label Margin="40,10,0,0" Content="Payments" />
<Label Margin="60,10,0,0" Content="End Balance" />
<Label Margin="50,10,0,0" Content="Issues" />
</StackPanel>
</StackPanel>
</Grid>
<Grid Grid.Row="1" Grid.Column="0">
<Grid Name="IssuesGrid">
<Grid.ColumnDeitions>
<!--<ColumnDeition Width="80*"/>-->
<!--<ColumnDeition Width="20*"/>-->
</Grid.ColumnDeitions>
<TreeView Name="View">
<!--<Style TargetType="{x:Type TreeViewItem}">
<Setter Property="IsExpanded"
Value="{Binding Class, Converter={StaticResource ErrorExpandConverter}}" />
</Style>-->
<TreeView.ItemContainerStyle>
<Style TargetType="{x:Type TreeViewItem}">
<Setter Property="IsExpanded"
Value="{Binding Dummies, Converter={StaticResource ErrorExpandConverter}}" />
</Style>
</TreeView.ItemContainerStyle>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate DataType="{x:Type self:dailyAccountBalance}" ItemsSource="{Binding Dummies}">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left" IsEnabled="False" Grid.Row="{Binding RowIndex}" ToolTip="This info">
<TextBlock Width="150" Text="{Binding ActivityDate}" />
<TextBlock Width="100" Margin="20,0,0,0" Text="{Binding BegBalance}"/>
<TextBlock Width="100" Margin="20,0,0,0" Text="{Binding ChrgAmount}" />
<TextBlock Width="100" Margin="20,0,0,0" Text="{Binding AdjAmount}" />
<TextBlock Width="100" Margin="20,0,0,0" Text="{Binding PmtAmount}" />
<TextBlock Width="100" Margin="20,0,0,0" Text="{Binding EndBalance}" ToolTipService.IsEnabled="True" ToolTipService.ToolTip="This balance thing" ToolTip="This balance"/>
<ContentControl HorizontalAlignment="Left" Margin="20,0,0,0" Width="100" ToolTip="This">
<ContentControl.Content>
<MultiBinding Converter="{StaticResource IssueIconConverter}">
<Binding Path="RowIndex"/>
<Binding Path="Errors"/>
</MultiBinding>
</ContentControl.Content>
<!--<TextBlock Text="Test"/>-->
</ContentControl>
</StackPanel>
<HierarchicalDataTemplate.ItemTemplate>
<DataTemplate DataType="{x:Type self:DummyItem}">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
<!--<TextBlock Text="{Binding Text}" />-->
<DataGrid ItemsSource="{Binding ChargeActivities}" AutoGenerateColumns="False">
<DataGrid.Style>
<Style TargetType="{x:Type DataGrid}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Items.Count,
RelativeSource={RelativeSource Self}}" Value="0">
<Setter Property="Visibility" Value="Collapsed" />
</DataTrigger>
</Style.Triggers>
</Style>
</DataGrid.Style>
<DataGrid.Columns>
<DataGridTextColumn x:Name="ChrgID" Header=" Charge" Binding="{Binding ChargeID}" />
<DataGridTextColumn x:Name="ChrgType" Header="Charge Type" Binding="{Binding ChargeType}">
<DataGridTextColumn.ElementStyle>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<Trigger Property="Text" Value="CR">
<Setter Property="Foreground" Value="Red"/>
</Trigger>
</Style.Triggers>
</Style>
</DataGridTextColumn.ElementStyle>
</DataGridTextColumn>
<DataGridTextColumn x:Name="ChrgAmt" Header="Amount" Binding="{Binding ChargeAmount}">
<DataGridTextColumn.ElementStyle>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<DataTrigger Binding="{Binding ChargeType}" Value="CR">
<Setter Property="Foreground" Value="Red"/>
</DataTrigger>
</Style.Triggers>
</Style>
</DataGridTextColumn.ElementStyle>
</DataGridTextColumn>
<DataGridTextColumn x:Name="" Header="" Binding="{Binding Stuff}" />
<DataGridTextColumn x:Name="Class" Header=" Class" Binding="{Binding Class}">
<DataGridTextColumn.ElementStyle>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="{Binding Class, Converter={StaticResource SPConverter}}"/>
</Style>
</DataGridTextColumn.ElementStyle>
</DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
</StackPanel>
</DataTemplate>
</HierarchicalDataTemplate.ItemTemplate>
</HierarchicalDataTemplate>
<!--<TreeViewItem x:Key="Test">
<TextBlock Text="Me gusta"></TextBlock>
</TreeViewItem>-->
</TreeView.ItemTemplate>
</TreeView>
</Grid>
</Grid>
</Grid>
</Window>
Any suggestions to get tooltips to render in the treeview children would definitely be appreciated. Thanks a ton in advance.
You don't set the tooltip property of elements inside of the template, you set it on the TreeViewItem itself.
Here is a very simplified example:
<TreeView>
<TreeViewItem Header="Item #1" DataContext="Test1" />
<TreeViewItem Header="Item #2" DataContext="Test2" />
<TreeView.Resources>
<Style TargetType="{x:Type TreeViewItem}">
<Style.Setters>
<Setter Property="ToolTip" Value="{Binding}" />
</Style.Setters>
</Style>
</TreeView.Resources>
</TreeView>
Here I had to set the DataContext manually and hardcoded for the example to work since just using the Header property doesn't set it, but in the real world, you are going to be data bound, so it will be set.

Outlook style Listview in WPF Listview

I am working on a system that manages documents and I currently implement a text search. The result shall be displayed in a list view similar to:
Each hit shall be displayed in a combined row with some information where the tit was found and a short embedded preview. The columns shall be resizable and the text shall be aligned with the width of the columns.
I have seen some examples how this can be done in Windows Forms but not using WPF. Can anybody point me to an example how to create a list view with sch type of rows.
Greetings
Clemens
I figured out that I can do it with datagrid that I style for my needs.
<Window x:Class="DataGridExample.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:DataGridExample"
mc:Ignorable="d"
Title="Hit List" Height="350" Width="350">
<Window.Resources>
<!-- Hover state brush -->
<SolidColorBrush x:Key="HoverBackgroundBrushKey" Color="#E5F3FB" />
<SolidColorBrush x:Key="HoverBorderBrushKey" Color="#70C0E7" />
<!-- Select (activate) the state of the brush -->
<SolidColorBrush x:Key="SelectedActiveBackgroundBrushKey" Color="#CBE8F6" />
<SolidColorBrush x:Key="SelectedActiveBorderBrushKey" Color="#26A0DA" />
<!-- Select (hover) state brush -->
<SolidColorBrush x:Key="SelectedHoverBackgroundBrushKey" Color="#D1E8FF" />
<SolidColorBrush x:Key="SelectedHoverBorderBrushKey" Color="#66A7E8" />
<!-- Select the (failed) status brush -->
<SolidColorBrush x:Key="SelectedInactiveBackgroundBrushKey" Color="#F7F7F7" />
<SolidColorBrush x:Key="SelectedInactiveBorderBrushKey" Color="#DEDEDE" />
</Window.Resources>
<Grid>
<DataGrid x:Name="HitList" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"
SelectionMode="Single" SelectionUnit="FullRow" AutoGenerateColumns="False"
GridLinesVisibility="None"
RowDetailsVisibilityMode="Visible"
RowHeaderWidth="0"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
ItemsSource="{Binding Path=Hits}">
<DataGrid.CellStyle>
<Style TargetType="DataGridCell">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridCell}">
<Border x:Name="BackgroundBorder" Background="Transparent">
<ContentPresenter VerticalAlignment="Center" Margin="4,0,6,0" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="BorderBrush" Value="{x:Null}"/>
</Style>
</DataGrid.CellStyle>
<DataGrid.RowStyle>
<Style TargetType="DataGridRow">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="{StaticResource HoverBackgroundBrushKey}"/>
</Trigger>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="{StaticResource SelectedActiveBackgroundBrushKey}" />
<Setter Property="BorderBrush" Value="{StaticResource SelectedActiveBackgroundBrushKey}" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True" />
<Condition Property="Selector.IsSelectionActive" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Background" Value="{StaticResource SelectedInactiveBackgroundBrushKey}" />
</MultiTrigger>
</Style.Triggers>
</Style>
</DataGrid.RowStyle>
<DataGrid.Columns>
<DataGridTemplateColumn Header="Document" MinWidth="50" Width="SizeToCells" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=DocumentName, Mode=OneWay}" Margin="0,0,12,0" FontWeight="SemiBold"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Field" MinWidth="50" Width="SizeToCells" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Field, Mode=OneWay}" Margin="0,0,12,0" FontWeight="SemiBold"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Location" MinWidth="50" Width="SizeToCells" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Location, Mode=OneWay}" Margin="0,0,12,0" FontWeight="SemiBold"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Length" MinWidth="50" Width="SizeToCells" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Length, Mode=OneWay}" Margin="0,0,12,0" FontWeight="SemiBold"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
<DataGrid.RowDetailsTemplate>
<DataTemplate>
<Border BorderThickness="2,2,8,2"
Width="{Binding RelativeSource={RelativeSource AncestorType={x:Type ItemsPresenter}}, Path=ActualWidth}"
HorizontalAlignment="Left" >
<TextBlock Margin="24,0,0,8" TextWrapping="Wrap" HorizontalAlignment="Left">
<TextBlock.Inlines>
<Run Text="{Binding Path=MatchEnvironment.Head}" FontStyle="Italic" Foreground="DarkGray"/>
<Run Text="{Binding Path=MatchEnvironment.Hit}" Background="Yellow" Foreground="Blue" FontWeight="Bold" FontStyle="Italic"/>
<Run Text="{Binding Path=MatchEnvironment.Tail}" FontStyle="Italic" Foreground="DarkGray"/>
</TextBlock.Inlines>
</TextBlock>
</Border>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
</DataGrid>
</Grid>

How do I change the selected item 'text' foreground color in a listbox

I have a ListBox with a DataTemplate. I'm trying to change the color of the text/foreground to white for the selected item in the listbox. I have seriously tried like 30 different ways to do it that I've found on google. I just can't get it to work. How can I change the foreground color?
Also, I would like to point out that I would like to not rely on the method that uses the SystemColors because I read that it won't work in .net 4.5 so I don't want it to break when we move our application to 4.5 some day. Here is my listbox xaml:
<ListBox Grid.Row="1" x:Name="Alerts" ItemsSource="{Binding Alerts}" HorizontalContentAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" AlternationCount="2">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal">
<Label Content="{Binding Type}" HorizontalAlignment="Left" Padding="1,1,1,0" />
<Label Content=" - " Padding="1,1,1,0"></Label>
<Label Content="{Binding Date}" HorizontalAlignment="Left" Padding="1,1,1,0" />
</StackPanel>
<Label Grid.Row="1" Content="{Binding Message}" HorizontalAlignment="Left" Margin="0" Padding="1,0,1,1" />
</Grid>
<Button Grid.Column="1"
CommandParameter="{Binding .}"
Command="{Binding Path=DataContext.Commands.RemoveAlertCommand, RelativeSource={RelativeSource AncestorType={x:Type ListBox}}}"
Content="X" HorizontalAlignment="Right" Width="Auto" Height="Auto" Foreground="#FFD40000" FontWeight="Bold" VerticalAlignment="Center" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="0">
<Setter Property="Background" Value="LightGray"></Setter>
</Trigger>
<Trigger Property="ItemsControl.AlternationIndex" Value="1">
<Setter Property="Background" Value="Ivory"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>
What about this:
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Foreground" Value="White"/>
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
In a DataTemplate that uses TextBlocks, the Foreground property would simply be inherited:
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"/>
</DataTemplate>
</ListBox.ItemTemplate>
In your DataTemplate with Label controls Foreground value inheritance does not work (see here why). But you may always bind to the Foreground property of the ListBoxItem like this:
<ListBox.ItemTemplate>
<DataTemplate>
<Label Content="{Binding}"
Foreground="{Binding Foreground,
RelativeSource={RelativeSource Mode=FindAncestor,
AncestorType=ListBoxItem}}"/>
</DataTemplate>
</ListBox.ItemTemplate>
Or you may simply replace your Labels with TextBlocks.

How do you bind a ListBox of CheckBoxes while preserving selection style?

I have the following XAML to bind data to a ListBox filled with CheckBoxes:
<ListBox Background="Transparent" Grid.Column="8" Grid.Row="3" ItemsSource="{Binding Path=StakeTypes}" Foreground="White"
Name="lbStakes" ItemContainerStyle="{StaticResource SelectionListBoxItem}" SelectionChanged="lbStakes_SelectionChanged" SelectionMode="Extended">
<ListBox.ItemTemplate>
<DataTemplate>
<ListBoxItem IsSelected="{Binding IsSelected, Mode=TwoWay}" HorizontalContentAlignment="Stretch">
<CheckBox Cursor="Hand" IsChecked="{Binding IsSelected, Mode=TwoWay}" Content="{Binding Text}" HorizontalContentAlignment="Stretch" />
</ListBoxItem>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Problem is, the style for the ListBox selection is different than if I manually created each ListBox Item:
<ListBox Background="Transparent" Cursor="Hand" Grid.Column="6" Grid.Row="3" Name="lbStakes" SelectionMode="Extended">
<ListBoxItem IsSelected="True">
<CheckBox IsChecked="True" Foreground="White" Content="Low" />
</ListBoxItem>
<ListBoxItem IsSelected="True">
<CheckBox IsChecked="True" Foreground="White" Content="Medium" />
</ListBoxItem>
<ListBoxItem IsSelected="True">
<CheckBox IsChecked="True" Foreground="White" Content="High" />
</ListBoxItem>
<ListBoxItem IsSelected="True">
<CheckBox IsChecked="True" Foreground="White" Content="Highest" />
</ListBoxItem>
</ListBox>
Here are the images:
I would like it to look like the second image. Any ideas are greatly appreciated.
Update: The following is the style I am trying to apply to the ListBoxItem:
<Style x:Key="SelectionListBoxItem" TargetType="ListBoxItem">
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border Name="Border" Padding="3" SnapsToDevicePixels="true">
<ContentPresenter />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="Border" Property="Background" Value="{StaticResource myBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
The two styles are different because in your bound ListBox you are using ItemContainerStyle="{StaticResource SelectionListBoxItem}", whereas in your second snippit, the default listbox item style applies. Try removing this style assignment from the bound listbox.
<Window.Resources>
<Style x:Key="SelectionListBoxItem" TargetType="ListBoxItem">
<Setter Property="KeyboardNavigation.TabNavigation" Value="None"></Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border Name="Border" BorderBrush="Black" BorderThickness="0.5" SnapsToDevicePixels="true">
<ContentPresenter />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="Border" Property="Background" Value="Red"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<ListBox Background="Transparent" Grid.Column="8" Grid.Row="3" ItemsSource="{Binding Path=IsSelectede}" Foreground="White"
Name="lbStakes" ItemContainerStyle="{StaticResource SelectionListBoxItem}">
<ListBox.ItemTemplate>
<DataTemplate>
<ListBoxItem IsSelected="{Binding IsSelected, Mode=TwoWay}" HorizontalContentAlignment="Stretch" KeyboardNavigation.TabNavigation="None">
<CheckBox Cursor="Hand" IsChecked="{Binding IsSelected, Mode=TwoWay}" Content="{Binding Text}" HorizontalContentAlignment="Stretch" />
</ListBoxItem>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
some of the binding properties are changed please correct them according to your properties .And also the style of your brush.I hope this will help.

WPF StackPanel Layout Question

I'm trying to create a layout similar to this:
alt text http://img20.imageshack.us/img20/3533/stackn.png
Here's the code I have:
<StackPanel TextBlock.FontFamily="Segoe UI" Orientation="Horizontal">
<StackPanel HorizontalAlignment="Stretch" Width="Auto">
<TextBlock Padding="5,0,5,0" FontSize="12" FontWeight="Bold" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Title}" />
<TextBlock Padding="5,0,5,0" FontSize="12" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Id}" />
</StackPanel>
<StackPanel>
<TextBlock Padding="5,0,5,0" FontSize="10" Text="Delete">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="FontWeight" Value="Bold" />
</Trigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
<TextBlock Padding="5,0,5,0" FontSize="10" Text="Move">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="FontWeight" Value="Bold" />
</Trigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
</StackPanel>
</StackPanel>
Why don't you use a Grid for this?
<Grid x:Name="LayoutRoot" Background="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="300" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0">
<TextBlock Text="{Binding Title}" />
</StackPanel>
<StackPanel Grid.Column="1">
<TextBlock Text="Move" />
</StackPanel>
</Grid>
I think you might be better off with a grid as your parent element. Omitting your styles and what not, here's the XAML for the layout in your drawing.
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="50" /> <!-- or some other fixed width -->
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0">
<!-- left hand stackpanel content -->
</StackPanel>
<StackPanel Grid.Column="1">
<!-- right hand StackPanel content -->
</StackPanel>
</Grid>
You don't really want a StackPanel for your red container. I'd go with a DockPanel, dock the rightmost blue panel to the right, and ensure LastChildFill is on to ensure the leftmost blue panel expands to the window width.
Here is the code for what I get from your post:
<DockPanel TextBlock.FontFamily="Segoe UI" LastChildFill="True">
<StackPanel DockPanel.Dock="Right">
<TextBlock Padding="5,0,5,0" FontSize="10" Text="Delete">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="FontWeight" Value="Bold" />
</Trigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
<TextBlock Padding="5,0,5,0" FontSize="10" Text="Move">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="FontWeight" Value="Bold" />
</Trigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
</StackPanel>
<StackPanel HorizontalAlignment="Stretch" Width="Auto">
<TextBlock Padding="5,0,5,0" FontSize="12" FontWeight="Bold" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Title}" />
<TextBlock Padding="5,0,5,0" FontSize="12" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Id}" />
</StackPanel>
</DockPanel>
Hope this helps!!

Categories

Resources