WPF Combobox: Only the first item should be editable - c#

Only the first item in Combobox (selectedIndex = 0) should be editable. I have got it already. But the problem is that the selected text didn't get highlighted.
Any help would be appreciated!
Code
<Window.Resources>
<Style x:Key="ComboBoxStyle" TargetType="{x:Type ComboBox}">
<Setter Property="IsEnabled" Value="True"></Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=comboBox1}" Value="0">
<Setter Property="ComboBox.IsEditable" Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
<Style x:Key="FirstItem" TargetType="{x:Type ListBoxItem}">
<Style.Triggers>
<Trigger Property="ComboBox.AlternationIndex" Value="0" >
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="FontStyle" Value="Italic"/>
<Setter Property="FontFamily" Value="SEGOEWP"/>
<Setter Property="FontSize" Value="15"/>
<Setter Property="Foreground" Value="Gray"/>
<Setter Property="Opacity" Value="1"/>
<Setter Property="TextBlock.TextTrimming" Value="WordEllipsis"/>
</Trigger>
</Style.Triggers>
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Green"/>
</Style.Resources>
</Style>
</Window.Resources>
<StackPanel >
<ComboBox Name="comboBox1" Style="{StaticResource ComboBoxStyle}" Width="100" Height="38"
AlternationCount="500" ItemsSource="{Binding Items}"
ItemContainerStyle="{StaticResource FirstItem}"
SelectedItem="{Binding SelectedItem}"
SelectedIndex="{Binding SelectedIndex}"
IsTextSearchEnabled="false"
Text="{Binding NewItem, UpdateSourceTrigger=LostFocus}">
<ComboBox.InputBindings>
<KeyBinding Command="{Binding LoginCMD}" Key="Return" />
</ComboBox.InputBindings>
</ComboBox>
</StackPanel>

Related

How can I have in an datagridcomboboxcolumn get the Checked value of each seperate Combobox?

I have an an DataGrid in which I load Data from an ObservableCollection and each row has an CheckBox so that I can have a list of checked Rows. Now I wanted to add an new Column to the DataGrid which is an ComboBox and in the ComboBox is a list with Checkboxen. I want for each row that when I check one Row and then when I check other Items from the ComboBox that I can combine the selected row and the selected values from my ComboBox.
The problem is that if I check one Row of the Combobox item it will check for every other ComboBox that appears in the DataGrid.
I want only to check the value of the combobox for one row and combine it with the Value of the checked row of the datagrid.
Here is my Code of my DataGrid:
<DataGrid Style="{DynamicResource DataGridStyle}"
Margin="10" SelectionUnit="CellOrRowHeader" AutoGenerateColumns="False"
CanUserAddRows="False" CanUserDeleteRows="False" SelectionMode="Single" VerticalAlignment="Stretch"
x:Name="SpaltenGrid" ItemsSource="{Binding bischenanders, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
GridLinesVisibility="None" ScrollViewer.CanContentScroll="True"
ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.HorizontalScrollBarVisibility="Auto">
<DataGrid.Columns >
<DataGridCheckBoxColumn x:Name="selectedField" Binding="{Binding IsChecked, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Header="Auswahl" CanUserSort="False">
<DataGridCheckBoxColumn.ElementStyle>
<Style TargetType="CheckBox" BasedOn="{StaticResource {x:Type CheckBox}}" />
</DataGridCheckBoxColumn.ElementStyle>
</DataGridCheckBoxColumn>
<DataGridTextColumn Header="Spaltenname" Binding="{Binding Spaltenname}" Width="1.5*"/>
<DataGridComboBoxColumn x:Name="cmbAdditionColume" Header="AdditionsSpalten" DisplayMemberPath="Spaltenname"
CanUserSort="False" Width="*">
<DataGridComboBoxColumn.ElementStyle>
<Style TargetType="ComboBox" BasedOn="{StaticResource ComboBoxStyle1 }" />
</DataGridComboBoxColumn.ElementStyle>
</DataGridComboBoxColumn>
<!--<DataGridTemplateColumn Header="Week Days" Width="*" x:Name="cmbTemplateColumn">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<ComboBox x:Name="cmbAdditionColume" Foreground="Black"
DisplayMemberPath="Spaltenname" Style="{StaticResource ComboBoxStyle1}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>-->
</DataGrid.Columns>
<DataGrid.Resources>
<!-- Select everything with orange... -->
<SolidColorBrush
Color="Transparent"
x:Key="{x:Static SystemColors.HighlightBrushKey}" />
<!-- ...all the time -->
<SolidColorBrush
Color="Transparent"
x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" />
<!--Design kopfzeile-->
<Style TargetType="{x:Type DataGridColumnHeader}" x:Name="test2" >
<Setter Property="Background" Value="Red"/>
<Setter Property="Foreground" Value="Black"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="Height" Value="30"/>
<Setter Property="FontSize" Value="15"/>
<Setter Property="BorderThickness" Value="0" />
<Setter Property="BorderBrush" Value="Green"/>
<Setter Property="Padding" Value="10 0 0 0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
<Grid x:Name="insideHeader" Background="Transparent">
<Border x:Name="borderHeader" BorderThickness="0"
CornerRadius="10"
Background="White"
Padding="10,0,0,0"
>
<ContentPresenter />
</Border>
<!--<Thumb HorizontalAlignment="Right"
Grid.Column="1"
Name="PART_HeaderGripper"
Margin="0,4,0,4"
Width="2"/>-->
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="{DynamicResource PrimaryBlueColor}"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="borderHeader" Property="Background" Value="{DynamicResource SecundaryGrayColor}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type DataGridRowHeader}">
<Setter Property="Content" Value=">" />
<Setter Property="Foreground" Value="{DynamicResource PrimaryBlueColor}" />
<Setter Property="FontWeight" Value="Bold"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridRowHeader}">
<Grid x:Name="insideHeader" Background="Transparent">
<Border x:Name="borderHeader" BorderThickness="0"
CornerRadius="2"
Background="White"
Padding="0,10,0,0"
>
<TextBlock Text=">" FontSize="12" VerticalAlignment="Top" Margin="0 0 0 0" TextAlignment="Center" FontWeight="Bold" Width="20" Foreground="{DynamicResource PrimaryBlueColor}" />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter TargetName="borderHeader" Property="Background" Value="{DynamicResource PrimaryGrayColor}"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="borderHeader" Property="Background" Value="{DynamicResource SecundaryGrayColor}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!--Deaktivieren Des rowheader
<Style TargetType="{x:Type DataGridRowHeader}">
<Setter Property="Background" Value="Transparent"/>
</Style>-->
<!--Cellen Design-->
<Style TargetType="{x:Type DataGridCell}">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Foreground" Value="Black"/>
<Setter Property="FontFamily" Value="sans-serif"/>
<Setter Property="BorderThickness" Value="0" />
<Setter Property="BorderBrush" Value="#333333"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridCell}">
<Border x:Name="insideBorder" Background="Transparent" BorderThickness="0 2 0 1" BorderBrush="#dddddd">
<Border x:Name="BorderCell" BorderThickness="0"
CornerRadius="6"
Background="White"
Padding="8,5,0,5"
Margin="2">
<ContentPresenter/>
</Border>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="{DynamicResource PrimaryBlueColor}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</DataGrid.Resources>
</DataGrid>
my itemtemplate of my ComboBox:
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<CheckBox IsChecked="{Binding Path=cmbIsChecked, Mode=TwoWay}" Width="20"/>
<TextBlock Text="{Binding Path=Spaltenname}" VerticalAlignment="Center" />
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
my "bischenanders" collection (sry for that bad name I will fix that in the future)
my outputColumns class:
public class OutputColumns
{
public string Spaltenname{ get; set; }
public bool IsChecked { get; set; }
public bool cmbIsChecked { get; set; }
}
}
thats the way I read the selected Items for the rows and for the Combobox rows
public List<OutputColumns> GetSelectedItems()
{
var selectedItems = new List<OutputColumns>();
foreach (OutputColumns item in View.bischenanders)
{
try
{
if (item.IsChecked)
{
selectedItems.Add(item);
}
}
catch
{
}
}
return selectedItems;
}
public List<OutputColumns> cmbGetSelectedItems()
{
var selectedItems = new List<OutputColumns>();
foreach (OutputColumns item in View.bischenanders)
{
try
{
if (item.cmbIsChecked)
{
selectedItems.Add(item);
}
}
catch
{
}
}
return selectedItems;
}
So that If this row is checked:
Picture
and in the combobox that 2 rows are checked:
Picture2
then I want that these 3 values are getting Combined
but when I check in one CombobBox every combobox in the DataGrid has the same checked Values
It looks like that every time I open a new ComboBox he getting the data from the class and then there will the programm find a version where it is checked, because ComboBoxs I already have open get there own checked values, only the new ones getting the checked one that are checked in the previous checkbox.
Thanks for help!

Changing Foreground color of ComboBox CheckBox

I am trying to change the foreground color of ComboBoxItem, however it does not apply, what am I doing wrong? Also I'm trying to change the foreground color of hovers on ComboBoxItem which does not work as well.
Here is my xaml:
<ComboBox Foreground="Yellow" Name="txtDispatch" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Margin="0,0,15,0" Grid.Column="2" Grid.Row="0" materialDesign:HintAssist.Hint="Select Dispatch" SelectionChanged="txtDispatch_SelectionChanged">
<ComboBox.ItemTemplate >
<DataTemplate >
<CheckBox Foreground="Yellow" Name="chkDispatch" Width="220" Checked="txtDispatch_Checked" Unchecked="txtDispatch_Checked" Content="{Binding Dispatch.id}" IsChecked="{Binding Check_Status}" CommandParameter="{Binding Dispatch.id}" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
<ComboBox Foreground="Black">
<ComboBox.Style>
<Style TargetType="ComboBox">
<Setter Property="ItemContainerStyle">
<Setter.Value>
<Style TargetType="ComboBoxItem">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Background" Value="White"/> <!--Optional-->
<Setter Property="Foreground" Value="Red"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="White"/> <!--Optional-->
<Setter Property="Foreground" Value="Yellow"/>
</Trigger>
</Style.Triggers>
</Style>
</Setter.Value>
</Setter>
</Style>
</ComboBox.Style>
<!-- Items List-->
<ComboBoxItem>1</ComboBoxItem>
<ComboBoxItem>2</ComboBoxItem>
<ComboBoxItem>3</ComboBoxItem>
<ComboBoxItem>4</ComboBoxItem>
<ComboBoxItem>5</ComboBoxItem>
</ComboBox>
Very Simple. Use the style.

MultiTrigger Condition to same binding/ Switch controls using Trigger

I am trying to have p:MarqueeTextBlock to only scroll on ListBox IsSelected under TargetType="{x:Type ListBoxItem}".
Having trouble to work out adding a MultiTrigger conditions (fired when IsSelected becomes True or False) to change the Property="Scroll" of the p:MarqueeTextBlock to Off or LeftTypewriter. In addition not sure how to reference the p:MarqueeTextBlock in the DataTemplate; perhaps if I provide it an x:Name? However I get Template property has already been set on DataTemplate.
I need to add AOTbMain_MARQUEE somehow in x:Key="ListBoxStyle_GAME" like:
<p:MarqueeTextBlock Text="{Binding Path=Title}" Style="{StaticResource AOTbMain_MARQUEE}"/>
Code with above reference not added:
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:p="clr-namespace:Plugin.Controls;assembly=Plugin.v1"
mc:Ignorable="d"
d:DesignHeight="2160" d:DesignWidth="3840">
<UserControl.Resources>
<ResourceDictionary>
<Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Grid>
<Image x:Name="SelectedGameOverlay" Source="{}pack://siteoforigin:,,,/Images/Selected Game Overlay.png" RenderOptions.BitmapScalingMode="HighQuality" Visibility="Hidden" />
<ContentPresenter x:Name="SelectedGameTextColour" HorizontalAlignment="Left" />
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive" Value="False" />
<Condition Property="IsSelected" Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Opacity" Value="1" />
<Setter TargetName="SelectedGameOverlay" Property="Visibility" Value="Visible" />
<Setter TargetName="SelectedGameTextColour" Property="TextElement.Foreground" Value="#FFFFFF" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive" Value="True" />
<Condition Property="IsSelected" Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Opacity" Value="1" />
<Setter TargetName="SelectedGameOverlay" Property="Visibility" Value="Visible" />
<Setter TargetName="SelectedGameTextColour" Property="TextElement.Foreground" Value="#FFFFFF" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ListBoxStyle" TargetType="p:AutoscrollListBox">
<Setter Property="ItemContainerStyle" Value="{StaticResource ListBoxItemStyle}" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderThickness" Value="0" />
</Style>
<Style x:Key="ListBoxStyle_BASE" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyle}">
<Setter Property="ScrollMode" Value="Center" />
<Setter Property="ItemContainerStyle">
<Setter.Value>
<Style TargetType="ListBoxItem" BasedOn="{StaticResource ListBoxItemStyle}">
<Setter Property="Padding" Value="1" />
</Style>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="AOTbMain_MARQUEE" TargetType="p:MarqueeTextBlock">
<Setter Property="Scroll" Value="LeftTypewriter" />
<Setter Property="ScrollDelayBeg" Value="0:0:5" />
<Setter Property="ScrollDelayEnd" Value="0:0:3" />
<Setter Property="ScrollSpeed" Value="0:0:5" />
</Style>
<Style x:Key="ListBoxStyle_BASE_INDXFADER" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyle_BASE}">
<Style.Triggers>
<DataTrigger Binding="{Binding IndexVisibility}" Value="Visible">
<Setter Property="Opacity" Value="0.1" />
</DataTrigger>
<DataTrigger Binding="{Binding IndexVisibility}" Value="Hidden">
<Setter Property="Opacity" Value="1" />
</DataTrigger>
</Style.Triggers>
</Style>
<Style x:Key="ListBoxStyle_BASETB" TargetType="p:AutoscaleTextBlock">
<Setter Property="TextTrimming" Value="CharacterEllipsis" />
<Setter Property="TargetFontSize" Value="30" />
</Style>
<Style x:Key="ListBoxStyle_GAME" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyle_BASE_INDXFADER}">
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<p:AutoscaleTextBlock Text="{Binding Path=Title}" Style="{StaticResource ListBoxStyle_BASETB}" />
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ListBoxItemStyleSearch" TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Grid>
<ContentPresenter x:Name="SelectedSearchTextColour" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="True" />
<Setter Property="Opacity" Value="1" />
<Setter TargetName="SelectedSearchTextColour" Property="TextElement.Foreground" Value="#FFFFFF" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ListBoxStyleSearch" TargetType="p:AutoscrollListBox">
<Setter Property="ItemContainerStyle" Value="{StaticResource ListBoxItemStyleSearch}" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="Background" Value="Transparent" />
</Style>
<Style x:Key="ListBoxStyle_INDX" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyleSearch}">
<Setter Property="ItemContainerStyle">
<Setter.Value>
<Style TargetType="ListBoxItem" BasedOn="{StaticResource ListBoxItemStyleSearch}">
<Setter Property="Padding" Value="1" />
</Style>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
</UserControl.Resources>
<Grid>
<Viewbox HorizontalAlignment="Left">
<p:AutoscrollListBox Name="Index" Style="{StaticResource ListBoxStyle_INDX}" Visibility="{Binding IndexVisibility}" />
</Viewbox>
<p:AutoscrollListBox Name="Items" Style="{StaticResource ListBoxStyle_GAME}" />
</Grid>
</UserControl>
The following Style will show the AutoscrollListBox as content of the DataTemplate. Once the ListBoxItem is selected it will display the MarqueeTextBlock instead. If unselected it will switch back to the AutoscrollListBox.
Solution 1
<Grid>
<AutoscrollListBox Name="Items" >
<AutoscrollListBox.ItemTemplate>
<DataTemplate>
<DataTemplate.Resources>
<AutoscaleTextBlock x:Key="AutoscaleTextBlock"
Text="{Binding Title}"
Style="{StaticResource ListBoxStyle_BASETB}"
x:Shared="False" />
<MarqueeTextBlock x:Key="MarqueeTextBlock"
Text="{Binding Title}"
Style="{StaticResource AOTbMain_MARQUEE}"
x:Shared="False" />
</DataTemplate.Resources>
<ContentControl x:Name="ContentPresenter" />
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}"
Value="False">
<Setter TargetName="ContentPresenter"
Property="Content"
Value="{StaticResource AutoscaleTextBlock}"/>
</DataTrigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}"
Value="True">
<Setter TargetName="ContentPresenter"
Property="Content"
Value="{StaticResource MarqueeTextBlock}"/>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</AutoscrollListBox.ItemTemplate>
</AutoscrollListBox>
</Grid>
Solution 2
In case you are working with nested resource dictionaries and can't apply the x:Shared attribute you can swap the controls directly from the Trigger:
<Grid>
<AutoscrollListBox Name="Items" >
<AutoscrollListBox.ItemTemplate>
<DataTemplate>
<ContentControl x:Name="ContentPresenter" />
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}"
Value="False">
<Setter TargetName="ContentPresenter"
Property="Content">
<Setter.Value>
<AutoscaleTextBlock Text="{Binding Title}"
Style="{StaticResource AOTbMain_MARQUEE}" />
</Setter.Value>
</Setter>
</DataTrigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}"
Value="True">
<Setter TargetName="ContentPresenter"
Property="Content">
<Setter.Value>
<MarqueeTextBlock Text="{Binding Title}"
Style="{StaticResource AOTbMain_MARQUEE}"/>
</Setter.Value>
</Setter>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</AutoscrollListBox.ItemTemplate>
</AutoscrollListBox>
</Grid>
Solution 3
Or toggle the Visibility:
<Grid>
<AutoscrollListBox Name="Items" >
<AutoscrollListBox.ItemTemplate>
<DataTemplate>
<Grid>
<AutoscaleTextBlock x:Name="AutoscaleTextBlock"
Text="{Binding Title}"
Style="{StaticResource AOTbMain_MARQUEE}"
Visibilty="Visible" />
<MarqueeTextBlock x:Name="MarqueeTextBlock"
Text="{Binding Title}"
Style="{StaticResource AOTbMain_MARQUEE}"
Visibilty="Collapsed" />
</Grid>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}"
Value="True">
<Setter TargetName="AutoscaleTextBlock"
Property="Visibility"
Value="Collapsed" />
<Setter TargetName="MarqueeTextBlock"
Property="Visibility"
Value="Visible" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</AutoscrollListBox.ItemTemplate>
</AutoscrollListBox>
</Grid>

wpf datagrid - how to remove black selected border?

I need help,
when I click at datagrid at cell, I want to select all line like in image (please look at image), but without black border. how to disable, or change color to transparent? I tried this:
<DataGrid.Resources>
<Style TargetType="DataGridCell">
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
</Style>
</DataGrid.Resources>
but don't work. nothing changes.
You need to style the selected cell not just cells. To do so you need to write this inside your style tag:
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="BorderThickness" Value="0"/>
</Trigger>
</Style.Triggers>
All you need was using Triggers hope it will work for you. Also you can change background for selected cell or whatever property you want.
Following example to customize wpf datagrid (border, cell corners, etc.). You can modify it as you wish.
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Page.Resources>
<Style x:Key="cellStyle" TargetType="DataGridCell">
<Setter Property="Padding" Value="0" />
<Setter Property="Margin" Value="2" />
<Setter Property="Background" Value="Black" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="DataGridCell">
<Border Background="Black" BorderThickness="0">
<Border x:Name="border"
BorderBrush="White"
BorderThickness="2"
Background="Black"
CornerRadius="5">
<ContentPresenter />
</Border>
</Border>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsSelected}" Value="true">
<Setter TargetName="border" Property="Background" Value="Orange"/>
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="rowStyle" TargetType="DataGridRow">
<Setter Property="Padding" Value="0" />
<Setter Property="Margin" Value="0" />
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Background" Value="Black" />
</Style>
<Grid>
<DataGrid HeadersVisibility="None" GridLinesVisibility="None" SelectionMode="Single" SelectionUnit="Cell" IsReadOnly="true"
RowStyle="{StaticResource rowStyle}" CellStyle="{StaticResource cellStyle}"
Background="Black" Foreground="White" ItemsSource="{Binding MyData}" />
</Grid>
</Page>

How to change Selected Row Background Image in wpf DataGrid

I have DataGrid with the Following Code .
In alter native row background have my Own Image . so is possible then also i want to change the Row Background Image on selected Row.
<DataGrid x:Name="dtstandardview" BorderThickness="0" Height="429" Width="688" BorderBrush="Aqua" MouseLeftButtonDown="dtstandardview_MouseRightButtonUp_1"
GridLinesVisibility="None" MouseRightButtonUp="dtstandardview_MouseRightButtonUp_1"
VerticalScrollBarVisibility="Visible" AutoGenerateColumns="False" IsReadOnly="True"
CanUserDeleteRows="False" AlternationCount="2" CanUserResizeRows="False" Sorting="dtstandardview_Sorting_1"
Background="#DCDCDC" HeadersVisibility="Column" CanUserResizeColumns="False"
RowHeight="27" SelectionUnit="FullRow" CanUserAddRows="False" MinRowHeight="27" LoadingRow="dtstandardview_LoadingRow" LoadingRowDetails="dtstandardview_LoadingRowDetails" Loaded="dtstandardview_Loaded" Initialized="dtstandardview_Initialized" CellEditEnding="dtstandardview_CellEditEnding" AutoGeneratingColumn="dtstandardview_AutoGeneratingColumn" UnloadingRow="dtstandardview_UnloadingRow" UnloadingRowDetails="dtstandardview_UnloadingRowDetails" >
<DataGrid.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#FF0000"/>
</DataGrid.Resources>
<DataGrid.CellStyle>
<Style TargetType="{x:Type DataGridCell}">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="FontSize" Value="12"/>
<Setter Property="FontFamily" Value="Arial"/>
<Setter Property="Foreground" Value="#404040"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect BlurRadius="0" Color="#FF000000" Direction="-60" Opacity="0.32" ShadowDepth="1"/>
</Setter.Value>
</Setter>
<Setter Property="Margin" Value="10,5" />
<Setter Property="VerticalContentAlignment" Value="Bottom"/>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="#cde0e5"/>
<Setter Property="FontSize" Value="12"/>
<Setter Property="FontFamily" Value="Arial"/>
<Setter Property="Foreground" Value="#404040"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect BlurRadius="0" Color="#FF000000" Direction="-60" Opacity="0.32" ShadowDepth="1"/>
</Setter.Value>
</Setter>
<Setter Property="Margin" Value="10,5" />
<Setter Property="VerticalContentAlignment" Value="Bottom"/>
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.CellStyle>
<DataGrid.RowStyle>
<Style TargetType="{x:Type DataGridRow}">
<Setter Property="FontSize" Value="12"/>
<Setter Property="FontFamily" Value="Arial"/>
<Setter Property="Foreground" Value="#404040"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="DataContext">
<Setter.Value>
<TextBlock Margin="10,0,0,0" TextWrapping="Wrap" Text="{Binding}">
<TextBlock.Effect>
<DropShadowEffect BlurRadius="0" Color="#FF000000" Direction="-60" Opacity="0.32" ShadowDepth="1"/>
</TextBlock.Effect>
</TextBlock>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" >
<Setter.Value>
<ImageBrush ImageSource="/ClientApplication;component/Images/bonus_progress_bg.png"/>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.RowStyle>
<DataGrid.RowBackground >
<ImageBrush ImageSource="/ClientApplication;component/Images/second_row_bg.png"/>
</DataGrid.RowBackground>
<DataGrid.AlternatingRowBackground>
<ImageBrush ImageSource="/ClientApplication;component/Images/bonus_progress_bg.png"/>
</DataGrid.AlternatingRowBackground>
<DataGrid.ColumnHeaderStyle>
<Style TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="ContentTemplate" >
<Setter.Value>
<DataTemplate>
<TextBlock Foreground="#404040" FontWeight="Bold" Margin="10,0,0,0" TextWrapping="Wrap" Text="{Binding}" TextOptions.TextFormattingMode="Display">
<TextBlock.Effect>
<DropShadowEffect BlurRadius="0" Color="#FFFFFF" Direction="-90" Opacity="0.40" ShadowDepth="1" RenderOptions.ClearTypeHint="Auto" />
</TextBlock.Effect>
</TextBlock>
</DataTemplate>
</Setter.Value>
</Setter>
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/ClientApplication;component/Images/table_bg_header.png"/>
</Setter.Value>
</Setter>
<Setter Property="BorderBrush">
<Setter.Value>
<ImageBrush ImageSource="/ClientApplication;component/Images/titel_bg.png"/>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="#404040" />
<Setter Property="BorderThickness" Value="0, 0, 1, 0"/>
<Setter Property="Height" Value="26" />
<Setter Property="FontSize" Value="14"/>
<Setter Property="FontFamily" Value="Arial"/>
</Style>
</DataGrid.ColumnHeaderStyle>
</DataGrid>
When i select the row I am getting the Following Effect on grid.
I want Entire Row with light Blue color .
You can use using a TemplateBinding
<Border Name="DataGridCellBorder"
Background="{TemplateBinding Background}"/>
Previously I have faced same issue so I followed the following approach and it was worked fine for me. Once try it...
You are specifying some Width to the grid top Row right( You are using Buttons ) ? just give same width to the binding element i.e., if you are using Textblock give that width as same as its header thats it.

Categories