I have a unique request and I am very new to WPF.
I have a list of Items. When I select an Item, it should show the child items.
There are many ways to do this:
1. You have the sub listbox items slide down moving the parent listbox items down. There will be lot of bouncing around
2. To avoid the height change, I am thinking that the sub listbox items can popup and I select the child items. If not, then I click away and get back to my parent listbox items.
I have no idea where to begin adding a sub listbox items underneath it's parent listbox item.
I have two listbox in my xaml
<Window x:Class="MakeModel.MakeModelYear"
Icon="cc_64x64_blue_02.ico"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:MakeModel"
Title="Car Make and Model" Height="740.667" Width="426" Opacity="0.9"
WindowStartupLocation="CenterScreen" ResizeMode="CanResize" Background="White">
<Window.Resources>
</Window.Resources>
<Grid>
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFFFFE" Offset="0"/>
<GradientStop Color="#FF6699CC" Offset="1.2"/>
</LinearGradientBrush>
</Grid.Background>
<Grid.RowDefinitions>
<RowDefinition Height="156*"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0*"/>
<ColumnDefinition Width="53*"/>
<ColumnDefinition Width="198*"/>
</Grid.ColumnDefinitions>
<StackPanel Margin="0,31,0,29" Grid.ColumnSpan="3">
<GroupBox Header="Make / Model" BorderBrush="WhiteSmoke" BorderThickness="0" Margin="5,0" Foreground="#FF0B6C78" FontSize="18" FontFamily="Microsoft Sans Serif">
<!--Task -->
<StackPanel>
<ListBox x:Name="cmbMake" HorizontalAlignment="Left" VerticalAlignment="Top" Width="387" Cursor="Arrow"
ItemsSource="{Binding SelectedMake}" DisplayMemberPath ="Make"
SelectionChanged="cmbMake_SelectionChanged" SelectionMode="Single" RenderTransformOrigin="0.494,1.409" Margin="0,3,0,0" Height="150" BorderBrush="#FF336699" FontFamily="Microsoft Sans Serif" FontSize="12" >
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" Color="Transparent"/>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/>
</Style.Resources>
<EventSetter Event="UIElement.MouseEnter" Handler="cmbFirstDigitLineItem_MouseMove" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter Property="Background" Value="#FFD7E1EC" />
</Trigger>
<Trigger Property="IsSelected" Value="True" >
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="FontSize" Value="24" />
<Setter Property="Foreground" Value="Black" />
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.Template>
<ControlTemplate>
<Border CornerRadius="5" BorderThickness="0" BorderBrush="#FF336699">
<ItemsPresenter/>
</Border>
</ControlTemplate>
</ListBox.Template>
</ListBox>
</StackPanel>
</GroupBox>
</StackPanel>
<StackPanel Margin="0,205,0,29" Grid.ColumnSpan="3">
<GroupBox Header="" BorderBrush="WhiteSmoke" BorderThickness="0" Margin="5,0">
<!--Subtask -->
<StackPanel>
<ListBox x:Name="cmbModel" HorizontalAlignment="Left" VerticalAlignment="Top" Width="387" Cursor="Arrow"
ItemsSource="{Binding SelectedModel}" DisplayMemberPath ="Model"
SelectionChanged="cmbModel_SelectionChanged" SelectionMode="Single" RenderTransformOrigin="0.494,1.409" Margin="0,3,0,0" Background="#FFE0E0E0" BorderBrush="#FF336699" FontFamily="Arial">
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" Color="Transparent"/>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/>
</Style.Resources>
<EventSetter Event="UIElement.MouseEnter" Handler="cmbSecondDigitLineItem_MouseMove" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter Property="Background" Value="#FFD7E1EC" />
</Trigger>
<Trigger Property="IsSelected" Value="True" >
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="FontSize" Value="24" />
<Setter Property="Background" Value="Transparent" />
<Setter Property="Foreground" Value="Black" />
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.Template>
<ControlTemplate>
<Border CornerRadius="5" BorderThickness="0" BorderBrush="#FF336699">
<ItemsPresenter/>
</Border>
</ControlTemplate>
</ListBox.Template>
</ListBox>
</StackPanel>
</GroupBox>
</StackPanel>
</Grid>
</Window>
Well, let me try to explain in plain and simple English :)
First, you should have your classes something like this:
public class Foo{
public ObservableCollection<MyParentObject> ListToBind {get;set;}
.... (rest of properties)
}
public class MyParentObject{
public ObservableCollection<MyChildObject> ChildListToBind {get;set;}
.... (rest of properties)
}
Then in your XAML you can have something like this:
And then as Window or UserControl Resources you have:
<DataTemplate x:key="listItemTemplate">
<Grid>
<ListBox ItemsSource={Binding ChildListToBind}" ItemTemplate="........"/>
</Grid>
</DataTemplate>
This is not perfect code...but hope it gives you head start to what you want.
Regards,
Related
I've got a TabControl with several TabItems. I'm trying to make them have a flatter design. The idea is to have the outside border of the tab go away, with the active tab indicated by a green line at the bottom of the tab. I've been able to get the green line to work perfectly, but no matter what I do I can't get rid of the left, top, and right lines of each TabItem.
Due to text formatting constraints in my specs, I have wrapped the TabItem header into a TextBlock wrapped by a Border. I suspect this combination may have something to do with it. If there is a way to show the green bottom border on the active tab, while allowing line breaks (each tab has two words that need to be split into two lines) and text centering in the tab header, I am totally fine with changing my configuration. I've tried various combinations of the BorderThickness, Margin, and Padding properties to no avail.
<TabControl HorizontalAlignment="Stretch" VerticalContentAlignment="Stretch" x:Name="tabControl">
<TabItem MaxWidth="55" HorizontalAlignment="Center" Background="White">
<TabItem.Header>
<Border Style="{StaticResource TabItemText}">
<TextBlock TextAlignment="Center" Text="Actions Needed" TextWrapping="Wrap"></TextBlock>
</Border>
</TabItem.Header>
</TabItem>
</TabControl>
This is the tab coloring code. It does some redundant things at the moment, but it illustrates what I'm trying to do.
<Style x:Key="TabItemText" TargetType="{x:Type Border}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=TabItem}}" Value="True">
<Setter Property="BorderBrush" Value="#57B481"/>
<Setter Property="BorderThickness" Value="0 0 0 4"/>
<Setter Property="Margin" Value="0 0 0 -3"/>
</DataTrigger>
<DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=TabItem}}" Value="False">
<Setter Property="BorderThickness" Value="0 0 0 0"/>
<Setter Property="Margin" Value="0 0 0 -3"/>
</DataTrigger>
</Style.Triggers>
</Style>
You can/should change the Template of TabItem. It contains a Border and you should fix its BorderThicknessto something like "0,0,0,2". The Last Value determines the height of the green border you are trying to create. You should also set the BorderBrush and BackgroundBrush to be the same. You change the BorderBrush in the Trigger IsSelected==True to your selected Color. Note that there is no need to use a Border in the Header of you TabItem. Just use a TexBlock to control TextWrapping and stuff. There are other minor changes that I explain in the following example:
<TabControl HorizontalAlignment="Stretch" VerticalContentAlignment="Stretch" x:Name="tabControl">
<TabControl.Resources>
<LinearGradientBrush x:Key="LightBrush" StartPoint="0,0" EndPoint="0,1">
<GradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="#FFF" Offset="0.0"/>
<GradientStop Color="#EEE" Offset="1.0"/>
</GradientStopCollection>
</GradientBrush.GradientStops>
</LinearGradientBrush>
<SolidColorBrush x:Key="SolidBorderBrush" Color="#888" />
<SolidColorBrush x:Key="WindowBackgroundBrush" Color="#FFF" />
<SolidColorBrush x:Key="DisabledBackgroundBrush" Color="#EEE" />
<SolidColorBrush x:Key="DisabledBorderBrush" Color="#AAA" />
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />
<ControlTemplate x:Key="simpleTI" TargetType="TabItem">
<Grid>
<Border Name="Border"
BorderThickness="0,0,0,2"
Background="{StaticResource LightBrush}"
BorderBrush="{StaticResource LightBrush}"
CornerRadius="0" >
<ContentPresenter x:Name="ContentSite" Margin="5,0" VerticalAlignment="Center" HorizontalAlignment="Center"
ContentSource="Header" RecognizesAccessKey="True"/>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter TargetName="Border" Property="BorderBrush" Value="#57B481" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}" />
<Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBorderBrush}" />
<Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</TabControl.Resources>
<TabItem MaxWidth="55" HorizontalAlignment="Center" Background="White" Template="{StaticResource simpleTI}" >
<TabItem.Header>
<TextBlock TextAlignment="Center" Text="Actions Needed" TextWrapping="Wrap" />
</TabItem.Header>
</TabItem>
<TabItem MaxWidth="55" HorizontalAlignment="Center" Background="White" Template="{StaticResource simpleTI}" >
<TabItem.Header>
<TextBlock TextAlignment="Center" Text="Actions Needed 1" TextWrapping="Wrap" />
</TabItem.Header>
</TabItem>
<TabItem MaxWidth="55" HorizontalAlignment="Center" Background="White" Template="{StaticResource simpleTI}" >
<TabItem.Header>
<TextBlock TextAlignment="Center" Text="Actions Needed 2" TextWrapping="Wrap" />
</TabItem.Header>
</TabItem>
</TabControl>
I'm pretty sure you're going to need to override the control template of your TabItem and/or TabControl to accomplish this. See https://msdn.microsoft.com/en-us/library/ms752032.aspx for a starting point.
The following code is treeview:
<TreeView BorderThickness="1,1,1,1" BorderBrush="#ffcccccc" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
ItemTemplate="{StaticResource itemTypeTreeViewTemplate}"
ItemsSource="{Binding ItemTypes}"
ItemContainerStyle="{StaticResource treeViewItemStyle}"/>
And i set the itemTemplate to set the binding of items. Then set the ItemContainerStyle to change IsSelected style:
<Style x:Key="treeViewItemStyle" TargetType="TreeViewItem">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="LightBlue" />
</Trigger>
</Style.Triggers>
</Style>
<HierarchicalDataTemplate x:Key="itemTypeTreeViewTemplate"
ItemsSource="{Binding Child}">
<DockPanel Margin="0,5,0,5">
<Button VerticalAlignment="Center"
x:Name="btn1" Width="25"
Visibility="{Binding Path=IsMouseOver,RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter }}"
Content="U" DockPanel.Dock="Right" cal:Message.Attach="[Event Click] = [Action EditItemType($dataContext)]"
Style="{StaticResource ButtonStyle1}" />
<TextBlock Margin="0,2,0,2" VerticalAlignment="Center" Text="{Binding ItemTypeName}" Foreground="#FF2e8bcc" FontSize="10" FontFamily="微软雅黑" />
</DockPanel>
</HierarchicalDataTemplate>
But the isSelected style is not work. Anybody find the key??
Instead of using a style trigger, you should override the colour key for the highlighted state. Here's the code:
<Style x:Key="treeViewItemStyle" TargetType="TreeViewItem">
<!--<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="LightBlue" />
</Trigger>
</Style.Triggers>--><!--Remove Style.Trigger block-->
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}"
Color="LightBlue"/>
</Style.Resources>
</Style>
Hope this helps. The other keys for this control are:
HighlightBrushKey - Focussed background. (Is focussed when
selected)
HighlightTextBrushKey - Focussed foreground.
InactiveSelectionHighlightBrushKey - Normal background.
InactiveSelectionHighlightTextBrushKey - Normal foreground.
I'm trying bind my Classes to HierarchicalDataTemplate. See code below.
XAML
<Window x:Name="window" x:Class="MyCompany.Press.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:helpers="clr-namespace:MyCompany.Press.Helpers"
xmlns:press="clr-namespace:MyCompany.Press"
mc:Ignorable="d"
Title="Press analyzer" Height="500" Width="800.5" ContentRendered="WindowContentRenderedEventHendler" Closing="WindowClosingEventHandler"
d:DataContext="{d:DesignData MainWindow}">
<Grid Name="MainGrid">
...
<TreeView Name="ArticlesTreeView" Grid.Column="0" AllowDrop="True" >
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type press:NewsPaperDocument}" ItemsSource="{Binding Children}">
<TextBlock Text="{Binding Name}" Tag="{Binding Object}" FontWeight="Bold" />
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type press:NewsPaperPage}" ItemsSource="{Binding Children}">
<TextBlock Text="{Binding Name}" Tag="{Binding Object}" Foreground="#00a300" />
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type press:NewsPaperTitle}" ItemsSource="{Binding Children}">
<TextBlock Text="{Binding Name}" Tag="{Binding Object}" Foreground="#da532c" />
</HierarchicalDataTemplate>
<DataTemplate DataType="{x:Type press:NewsPaperBlock}">
<TextBlock Text="{Binding Name}" Tag="{Binding Object}" Foreground="#2b5797" />
</DataTemplate>
</TreeView.Resources>
<TreeView.ItemContainerStyle>
<Style TargetType="{x:Type TreeViewItem}">
<!-- Style for the selected item -->
<Setter Property="BorderThickness" Value="1" />
<Style.Triggers>
<!-- Selected and has focus -->
<Trigger Property="IsSelected" Value="True">
<Setter Property="BorderBrush" Value="#7DA2CE" />
</Trigger>
<!-- Mouse over -->
<Trigger Property="helpers:TreeViewHelper.IsMouseDirectlyOverItem" Value="True">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFFAFBFD" Offset="0" />
<GradientStop Color="#FFEBF3FD" Offset="1" />
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter Property="BorderBrush" Value="#B8D6FB" />
</Trigger>
<!-- Selected but does not have the focus -->
...
</Style.Triggers>
<Style.Resources>
<Style TargetType="Border">
<Setter Property="CornerRadius" Value="2" />
</Style>
</Style.Resources>
</Style>
</TreeView.ItemContainerStyle>
</TreeView>
</Grid>
</Grid>
</Window>
If I use x:Type, designer say
Design view is unavailable for x64 and ARM target platforms.
and error like
The name "NewsPaperDocument" does not exist in the namespace "clr-namespace:MyCompany.Press"
but code compile and run completely.
Same error I have on <Trigger Property="helpers:TreeViewHelper.IsMouseDirectlyOverItem" Value="True"> line.
If I remove x:Type designer works fine, but HierarchicalDataTemplate doesn't work correctly
P.S. TreeViewHelper I get here http://blogs.msdn.com/b/mikehillberg/archive/2006/09/21/mytreeviewhelperismousedirectlyoveritem.aspx
I need the area series charting to look like:
I succeeded in hiding the two axis and changing the colors to gradient brush.
I still need help on changing the opacity so the green one will be "behind" the orange one.
Also - How do I change the little points on the graph?
How do I change the background to be transparent?
How to hide the chart title?
Right now it looks like this:
Any help will be very appreciated!
Here is my xaml code:
<LinearGradientBrush x:Key="GreenGradientBrush" StartPoint="0.5,0" EndPoint="0.5,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="#77b31a" Offset="0.75"></GradientStop>
<GradientStop Color="#85d805" Offset="0.45"></GradientStop>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<LinearGradientBrush x:Key="OrangeGradientBrush" StartPoint="0.5,0" EndPoint="0.5,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="#fff92900" Offset="0.75"></GradientStop>
<GradientStop Color="#ffff6115" Offset="0.45"></GradientStop>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<Style x:Key="GreenAreaSeriesStyle" TargetType="Control">
<Setter Property="Background" Value="{StaticResource GreenGradientBrush}" />
<Setter Property="Opacity" Value="1"></Setter>
</Style>
<Style x:Key="OrangeAreaSeriesStyle" TargetType="Control">
<Setter Property="Background" Value="{StaticResource OrangeGradientBrush}" />
<Setter Property="Opacity" Value="1"></Setter>
</Style>
<datavis:ResourceDictionaryCollection x:Key="MyPalette">
<ResourceDictionary>
<Style x:Key="DataPointStyle" BasedOn="{StaticResource GreenAreaSeriesStyle}" TargetType="Control" >
</Style>
</ResourceDictionary>
<ResourceDictionary>
<Style x:Key="DataPointStyle" BasedOn="{StaticResource OrangeAreaSeriesStyle}" TargetType="Control" >
</Style>
</ResourceDictionary>
</datavis:ResourceDictionaryCollection>
<Style x:Key ="PerformanceChartMajorTickMarkStyle" TargetType="Line">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</Window.Resources>
<charting:Chart Palette="{StaticResource MyPalette}" HorizontalAlignment="Left" Margin="39,38,0,0" Name="chart1" Title="Chart Title" VerticalAlignment="Top" Width="815" Height="598" OverridesDefaultStyle="False">
<charting:Chart.LegendStyle>
<Style TargetType="datavis:Legend">
<Setter Property="Width" Value="0" />
</Style>
</charting:Chart.LegendStyle>
<charting:AreaSeries Name="Green" DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding}" IsSelectionEnabled="True" >
<charting:AreaSeries.IndependentAxis>
<charting:CategoryAxis Orientation="X" Visibility="Hidden"/>
</charting:AreaSeries.IndependentAxis>
<charting:AreaSeries.DependentRangeAxis>
<charting:LinearAxis Orientation="Y" Visibility="Hidden"/>
</charting:AreaSeries.DependentRangeAxis>
</charting:AreaSeries>
<charting:AreaSeries Name="Orange" DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding}" IsSelectionEnabled="True">
<charting:AreaSeries.IndependentAxis>
<charting:CategoryAxis Orientation="X" Visibility="Hidden"/>
</charting:AreaSeries.IndependentAxis>
<charting:AreaSeries.DependentRangeAxis>
<charting:LinearAxis Orientation="Y" Visibility="Hidden"/>
</charting:AreaSeries.DependentRangeAxis>
</charting:AreaSeries>
</charting:Chart>
I posted a similar question and got the following answer, which really helped me.
<ch:Chart Margin="56,21,50,72" Title="MyChart" DataContext="{Binding ElementName=Window, Mode=OneWay}" Style="{StaticResource controlStyle}" >
<ch:AreaSeries Name="DefaultArea" ItemsSource="{Binding Path=Key}" IndependentValueBinding="{Binding Key}" DependentValueBinding="{Binding Value}" Opacity="1" Title="111111" >
<ch:AreaSeries.Style>
<Style TargetType="ch:AreaSeries">
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ch:AreaSeries">
<Canvas x:Name="PlotArea">
<Path Data="{TemplateBinding Geometry}" StrokeThickness="3" Fill="Pink" Style="{TemplateBinding PathStyle}" Opacity="1" />
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ch:AreaSeries.Style>
</ch:AreaSeries>
<ch:AreaSeries Name="PersonnelArea" ItemsSource="{Binding Path=Key}" IndependentValueBinding="{Binding Key}" DependentValueBinding="{Binding Value}" Opacity="1" >
<ch:AreaSeries.Style>
<Style TargetType="ch:AreaSeries">
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ch:AreaSeries">
<Canvas x:Name="PlotArea">
<Path Data="{TemplateBinding Geometry}" StrokeThickness="3" Fill="Yellow" Style="{TemplateBinding PathStyle}" Opacity="1" />
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ch:AreaSeries.Style>
</ch:AreaSeries>
</ch:Chart>
You can also set the style as Ressource in XAML and then assign it dynamically in the code behind.
Here my original question with the Answer:
WPF AreaSeries: How to change background opacity?
<Window.Resources>
<Style x:Key="ListBoxStyle" TargetType="{x:Type ListBox}">
<Setter Property="Background" Value="{StaticResource ResourceKey=ListboxBack}"/>
<Setter Property="Foreground" Value="Green"/>
<Setter Property="Width" Value="284"/>
<Setter Property="Height" Value="332"/>
<Setter Property="Margin" Value="18,77,0,151"/>
<Setter Property="ItemTemplate" Value="{DynamicResource DataTemplate1}"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Padding" Value="0,0,0,0"/>
</Style>
<DataTemplate x:Key="DataTemplate1">
<Grid Width="276" Height="36" Background="{x:Null}" Opacity="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.069*"/>
<ColumnDefinition Width="0.931*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Name="recback" Padding="40,0,0,0" Text="{Binding [0], FallbackValue=Number}" Width="Auto" HorizontalAlignment="Stretch" Margin="-1.899,0,-5.334,0" Grid.Column="0" FontSize="13.333" Height="38.277" VerticalAlignment="Top" Foreground="Black" Background="{x:Null}" Opacity="1" Grid.ColumnSpan="2" />
<Rectangle HorizontalAlignment="Stretch" Height="1" Margin="3.5,0" VerticalAlignment="Bottom" Width="Auto" Fill="White" Grid.ColumnSpan="2"/>
</Grid>
</DataTemplate>
</Window.Resources>
<ListBox Style="{StaticResource ResourceKey=ListBoxStyle}" BorderThickness="0" x:Name="listBox1" Foreground="White" FontSize="18" d:LayoutOverrides="VerticalAlignment" BorderBrush="{x:Null}" />
I create ListBox with DataTemplate. DataTemplate contains a Rectangle and a Textblock. When I select item in ListBox I want to change TextBlock foreground and Rectangle background. Could you help me?
Use a similar to the following approach. This way you will override the default Brushes with the specified x:Key used of this ListBox Only. Perhaps you need additional or different x:Keys to override
<ListBox>
<ListBox.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="LightBlue" />
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Green" />
</ListBox.Resources>
</ListBox>
By reading again your question i understand that perhaps you also need DataTriggers in your DataTemplate.
You might also try something like this Notice that Forground and BackGround should be set in the style not in TextBlock for this code to work:
<TextBlock x:Name="recback" Padding="40,0,0,0" Text="{Binding [0], FallbackValue=Number}" Width="Auto"
HorizontalAlignment="Stretch" Margin="-1.899,0,-5.334,0" Grid.Column="0" FontSize="13.333" Height="38.277"
VerticalAlignment="Top" Opacity="1" Grid.ColumnSpan="2">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="Black"/>
<Setter Property="Background" Value="{x:Null}"/>
<Style.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}, Path=IsSelected}" Value="True">
<Setter Property="Foreground" Value="Red"/>
<Setter Property="Background" Value="Yellow"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>