When selecting a Cell using the Mouse, the BorderColor is different to when navigating via ArrowKeys.
Also it seems that the Property IsSynchronizedWithCurrentItem does not work correctly when using ArrowKeys.
The issue with the Color can be observed in the Demo
Hi,
Thanks, I am always happy to help.
If there is anything else I can assist you with, do not hesitate to contact me.
Regards,
Vicky
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Hi,
Thank you for your feedback.
I forwarded it to the UX designer of the team and they confirmed that this is not a bug, yet it was an intentional design decision. This is why the status of your Bug Report will be changed to Declined.
However, after a further discussion with both the designer and the development team, we decided that we will unify the border colors.
As a small gesture of appreciation for your cooperation, I am awarding you some Telerik points.
In the meantime, if your app theme is Fluent, you can unify the styles by using the FocusVisualStyle of the GridViewCell and updating it to the following:
<Grid>
<Grid.Resources>
<local:MyViewModel x:Key="MyViewModel" />
<Style TargetType="telerik:GridViewCell" BasedOn="{StaticResource GridViewCellStyle}">
<Setter Property="FocusVisualStyle">
<Setter.Value>
<Style>
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle x:Name="FocusVisualRectangle"
StrokeThickness="2"
Stroke="{telerik:FluentResource ResourceKey=IconBrush}"
Margin="0 0 1 1"/>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=telerik:GridViewDataControl}, Path=GridLinesVisibility}" Value="Vertical">
<Setter TargetName="FocusVisualRectangle" Property="Margin" Value="0 0 1 0" />
</DataTrigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=telerik:GridViewDataControl}, Path=GridLinesVisibility}" Value="Horizontal">
<Setter TargetName="FocusVisualRectangle" Property="Margin" Value="0 0 0 1" />
</DataTrigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=telerik:GridViewDataControl}, Path=GridLinesVisibility}" Value="None">
<Setter TargetName="FocusVisualRectangle" Property="Margin" Value="0" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<telerik:RadGridView x:Name="gridView" DataContext="{StaticResource MyViewModel}" ItemsSource="{Binding Clubs}"/>
</Grid>
Best regards,
Vicky
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
In terms of UI interaction, Current Cell = Selected Cell = Focused Cell is valid.
Ok then I do not understand why color changes when using the arrow keys, because that wouldn't be the case if they all are equal.
So there must be a difference, I do not see that the focus is lost once i start using arrow keys, so the current focused cell (and therefore current item and selected cell) do change, but why does the color change?
This would mean the cell that i navigate too is either:
not the current cell anymore
not the current item anymore
not the focused cell anymoe
Hi,
The key point is that RadGridView has two separate concepts of "current state".
The CurrentItem is related to the control’s native support of ICollectionView.CurrentItem. The grid view internally uses an ICollectionView implementation and can also work with a custom one. Setting IsSynchronizedWithCurrentItem to True forces the UI to synchronize the current cell/selected item with the CurrentItem in the data model. This current item can be tracked visually by observing a glyph in the RowIndicator.
The other representation of the current state – the current cell – is just a visual one. It indicates the cell which can be subject to an edit operation through the UI. The current cell basically represents the GridViewCell element in its current visual state. The grid cell is a single thing, yet it contains different visual elements (e.g. Borders, Rectangles) representing a visual state (or a combination of several) - e.g., current, selected, focused.
In terms of UI interaction, Current Cell = Selected Cell = Focused Cell is valid.
Best regards,
Vicky
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Hi Vicky,
thank you for the clarification. I thought there were only two things: SelectedCell and CurrentCell. If I understand you correct, there is also FocusedCell.
Is there a way to make sure FocusedCell = CurrentCell = SelectedCell, I thogut that is what IsSynchronizedWithCurrentItem is meant for.
Hi,
I can confirm that the colors of the current cell and the focus visual are different, and that this is a design decision for some of the Telerik themes.
You can observe it with the Crystal, Material and Expression Dark themes as well.
If the Fluent theme is the one you use in your app and you do not like the blue color (i.e., the focus visual), you can override the FocusVisualStyle of the GridViewCell. If you do not like the black color (i.e., the current cell), you can use the CurrentBorderBrush property of the GridViewCell to choose another.
Could you please provide some more details regarding the IsSynchronizedWithCurrentItem property?
Best regards,
Vicky
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.