Difference between mouse click and source selection of SelectedItem?

[Psyduck]

Hello.

I've attached some examples.

This is different when I do a mouse click event and a SelectedItem on the source.

When selecting with the mouse, the default color of Fluent is cyan.

When defining SelectedItem by code, it is defined with a gray background. (SelectedItem = data)
When you select the SelectedItem with the mouse, it is selected again and it is changed to a cyan color.

is this correct?
How do I solve it?

 

[Stenly]

Hello Psyduck,

Thank you for providing images and a modified project.

This is the default behavior of the control because when the focus is lost, different styles from the Fluent theme are applied to the items - namely, the items go into the SelectionUnfocused state. So, to change that, the default control template of the RadTreeViewItem element needs to be edited.

The reason I suggested bringing the focus back was that in the case of using a Button for the selection, changing the focus did not result in any undesired behavior. When integrated with other controls, however, this approach would not be sustainable.

I have modified the provided project to use the NoXaml assemblies with the implicit styling theming approach. This allows to easily modify the default template without having to extract the whole style. That said, the project implements the mentioned approach without changing the focus of the controls. And the necessary trigger is edited (it is commented with "SelectionUnfocused state") to match the expected behavior.

In conclusion, could you try this approach and let me know how it goes?

Regards,
Stenly
Progress Telerik

[Psyduck]

Thanks for the example.

My project cannot be used with noxaml, so I modified it to xaml and tested it.

As a result it works the way I want it to.

 

And I found one difference.
All sources of ControlTemplate are the same.
I confirmed that only the Property="mat:MaterialAssist.CheckedBrush" of <!-- SelectionUnfocused state --> was changed.

 

Other than that, nothing has changed. Do I have to edit the whole thing to do this?

[Stenly]

In the current scenario, the extraction of the control template is the only reliable solution that I can suggest.

[Stenly]

Hello Psyduck,

Thank you for the provided project and image.

The reason for this result is that the RadTreeView control loses focus when the button is clicked and that the treeview items have a different appearance when they are not focused (coming from their default style).

To change this behavior, you could use the SelectionChanged event of the RadTreeView control and set the focus to the tree every time the event fires (which also occurs when the button is clicked). The code-behind method implementation should look as follows:

private void OnSelectionChanged(object sender, SelectionChangedEventArgs e)
{
    var tree = (RadTreeView)sender;

    tree.Focus();
}

That said, I have modified the provided project to use this approach, so could you try it out and let me know how it goes?

Regards,
Stenly
Progress Telerik

[Stenly]

Hello Psyduck,

If the OnSelectionChanged event approach is not preferred, you could set the FocusManager.FocusedElement attached property to the RadTreeView control. This property allows the tree to regain focus after it is lost. It is set as follows:

<telerik:RadTreeView  FocusManager.FocusedElement="{Binding RelativeSource={RelativeSource Mode=Self}}">

Or, you could set it to the button and every time it gets pressed, the last tree view item will take focus.

<telerik:RadButton FocusManager.FocusedElement="{Binding ElementName=radTree}"/>

That said, could you give this approach a try and let me know how it goes? 

Regards,
Stenly
Progress Telerik

[Psyduck]

Thank you.

This works just fine with a single control.

But it didn't work in my project.

 

I'm not sure if this is an error.

1. There are ListBox and TreeView.

When a listbox is selected in the treeview, the treeview loses focus.
Other than this, your suggested FocusManager works fine.

2. GridView was added in step 1.

Treeview loses focus when clicking on gridview.

 

Attach images and additional examples.

Is this a common situation?

[Psyduck]

Hello.

This works exactly.

I made it here with the MVVM pattern. This also actually works.

Is this different from code-behind?

<telerik:RadTreeView>
  <telerik:EventToCommandBehavior.EventBindings>
      <telerik:EventBinding EventName="SelectionChanged"
                            Command="{Binding SelectionChangedCommand}"
                            PassEventArgsToCommand="True"/>
  </telerik:EventToCommandBehavior.EventBindings>
</telerik:RadTreeView>

public ICommand SelectionChangedCommand => new DelegateCommand(obj =>
{
    //var tree = (RadTreeView)obj;
    //tree.Focus();
    if(obj is System.Windows.Controls.SelectionChangedEventArgs arg)
    {
        var tree = (RadTreeView)arg.OriginalSource;
        tree.Focus();
    }
});

And I want to keep this simple.
So I thought of a xaml style trigger but I couldn't get it to work.

Is there a way to apply it directly in style?
(Ignore the long code. I want the short code.)

 

Thanks.