This is a migrated thread and some comments may be shown as answers.

Programmatically select item and focus it

14 Answers 385 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Predrag
Top achievements
Rank 1
Predrag asked on 08 Dec 2011, 09:52 AM

Hi,

I’m using RadTreeView with HierarchicalDataTemplate. I need to programmatically select an item in the tree view and expand it.
I’m using approach described here http://blogs.telerik.com/xamlteam/posts/11-01-12/treeview-bringintoview.aspx. I need also to focus the item in order to be highlighted. When I call item.Focus(); almost every time nothing happens (it returns false). In debug mode I was able to set item.IsFocused = true; and then it worked (item was highlited), but you cannot access to IsFocused setter property of RadTreeViewItem from code because it is protected.

How can I focus this selected item from code in order to highlight it?

Best regards,

Predrag

14 Answers, 1 is accepted

Sort by
0
Kiril Stanoev
Telerik team
answered on 08 Dec 2011, 05:17 PM
Hello Predrag,

 Could you please try calling Focus() within a Dispatcher:

this.Dispatcher.BeginInvoke(() =>
{
    treeViewItem.Focus();
});

Let me know if this helps.

Best wishes,
Kiril Stanoev
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Predrag
Top achievements
Rank 1
answered on 09 Dec 2011, 11:21 AM
Hello Kiril,

I tried calling the Focus() with Dispatcher, but it didn’t help.  

My page is bounded to view model, on it I have refresh button (which uses relative binding to reload command), than I have user control which has RadTreeView and user control for selected item details. When data reload is finished view model reload command will send reloaded message, my Tree view control is registered to this message. What it actually does is reexpand tree view nodes and reselects view model selected item.

It looks like my UserControl that contains RadTreeView is not focused, because when I click on control selected tree view item becomes highlighted (then also my user control is focused).

If is not possible to focus on item is there any way to change the style for selected unfocused RadTreeViewItem in RadTreeView with HierarchicalDataTemplate?


Best regards,
Predrag
0
Accepted
Petar Mladenov
Telerik team
answered on 14 Dec 2011, 09:06 AM
Hi Predrag,

 Please check out the attached project where I extracted the default ItemContainerStyle of the RadTreeView and changed the Background of the RadTreeViewItems when they are Selected but not focused:

<LinearGradientBrush x:Key="ControlSubItem_Background_UnFocus" EndPoint="0,1">
            <!--<GradientStop Color="#FFf8f6f9" Offset="0"/>
            <GradientStop Color="#FFf0f0f0" Offset="1"/>-->
            <GradientStop Color="Blue" Offset="0" />
            <GradientStop Color="DeepSkyBlue" Offset="1" />
        </LinearGradientBrush>
<Border x:Name="SelectionUnfocusedVisual"
                           Grid.Column="2"
                           Grid.ColumnSpan="6"
                           BorderBrush="{StaticResource ControlSubItem_OuterBorder_UnFocus}"
                           BorderThickness="{StaticResource ControlSubItem_OuterBorderThickness}"
                           CornerRadius="{StaticResource ControlSubItem_OuterCornerRadius}"
                           Visibility="Collapsed">
                       <Border Background="{StaticResource ControlSubItem_Background_UnFocus}"
                               BorderBrush="{StaticResource ControlSubItem_InnerBorder_UnFocus}"
                               BorderThickness="{StaticResource ControlSubItem_InnerBorderThickness}"
                               CornerRadius="{StaticResource ControlSubItem_InnerCornerRadius}" />
                   </Border>
 
Please let us know if this satisfies you or not.  Greetings,
Petar Mladenov
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Predrag
Top achievements
Rank 1
answered on 26 Dec 2011, 02:01 PM

Thank you very much. This is exactly what I needed.

0
Mark
Top achievements
Rank 1
answered on 06 Mar 2012, 08:52 AM
Any chance you can get the selected/focused item to scroll into view if it is below display area.

Shorten the browser window, select the item at the bottom, scroll to the top, click the selector button - where is the selected item? Not in view...
0
Hristo
Telerik team
answered on 06 Mar 2012, 01:35 PM
Hi,

You could take a look at the following blog post for about BringIntoView feature of RadTreeView: http://blogs.telerik.com/xamlteam/posts/11-01-12/treeview-bringintoview.aspx 
The post contains a sample project you could use to check if this approach is applicable to your case.

Kind regards,
Hristo
the Telerik team
Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
0
Mark
Top achievements
Rank 1
answered on 07 Mar 2012, 01:11 AM
Thanks Hristo, that is precisely what I was looking for, who'd of thunk it was right there in the object tree!
0
Gopala
Top achievements
Rank 1
answered on 28 Mar 2013, 08:46 PM
I want the same thing but I am using MVVM model not code behind.

<telerik:RadTreeView ItemsSource="{Binding ReportRoots}"
                             SelectionMode="Extended"
                             IsDragDropEnabled="False"
                             IsEditable="False"
                             Grid.Row="1"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"                           
                             x:Name="rtvReportRoots"
                             SelectedItem="{Binding SelectedReportRoot, Mode=TwoWay}">
            <telerik:RadTreeView.ItemTemplate>
                <telerik:HierarchicalDataTemplate ItemsSource="{Binding Children}"
                                                  DataType="ViewModels:ReportRootEntityViewModel">
                    <Grid x:Name="NodeContainer">                       
                        <TextBlock Text="{Binding Path=Name}"
                                   Foreground="Gray"/>
                    </Grid>
                </telerik:HierarchicalDataTemplate>
            </telerik:RadTreeView.ItemTemplate>
        </telerik:RadTreeView>

In my viewmodel, I am assigning SelectedReportRoot = reportRoot. at this point, I want to expand treeview and drill down and select the item and move into view.
0
Pavel R. Pavlov
Telerik team
answered on 01 Apr 2013, 02:44 PM
Hello Gopala,

In order to use one of the methods that bring items into the viewport of the RadTreeView control, you will have to make sure that the item is generated before attempting to visualize it. Have in mind that in MVVM scenarios we recommend using the BringPathIntoView() method. Its usage is demonstrated in the previous referenced article (this one).

Can you please clarify why it is an obstacle for you to implement the BringIntoView logic in your code behind? Please note that the BringIndexIntoVIew(), BringItemIntoView() and BringPathIntoView() methods (further described here) are implemented in the RadTreeView or in the RadTreeVeiwItems. Hence in order to use any of them you will have to have an instance of the control or the items.

However, there are other approaches that can be followed to manipulate visual elements from your viewmodel. For example this article describes how you can do this by using a message (IMessenger).

Regards,
Pavel R. Pavlov
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Gopala
Top achievements
Rank 1
answered on 01 Apr 2013, 03:19 PM
Hi,
I am sorry, I guess I didnot explain you my problem/task clearly. Here you go. If you have any questions please let me know.

In my application we are using RadTreeView like below. We are using MVVM model

<telerik:RadTreeView ItemsSource="{Binding ReportRoots}"
                             SelectionMode="Extended"
                             IsDragDropEnabled="False"
                             IsEditable="False"
                             Grid.Row="1"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"                           
                             x:Name="rtvReportRoots"
                             SelectedItem="{Binding SelectedReportRoot, Mode=TwoWay}">
            <telerik:RadTreeView.ItemTemplate>
                <telerik:HierarchicalDataTemplate ItemsSource="{Binding Children}"
                                                  DataType="ViewModels:ReportRootEntityViewModel">
                    <Grid x:Name="NodeContainer">                       
                        <TextBlock Text="{Binding Path=Name}"
                                   Foreground="Gray"/>
                    </Grid>
                </telerik:HierarchicalDataTemplate>
            </telerik:RadTreeView.ItemTemplate>
        </telerik:RadTreeView>

When ever user selects a search result in another grid what I need to do is I need to expand the above RadTreeview and select one item in above RadTreeview. I wrote a code which is doing it but it is not working correctly. I just want to do I need to create a new control by extending RadTreeview or I can just use RadTreeview. Can you please give me sample application which does what I said above.

After selecting the item, I need to scroll the selected item into view. This is my exact task. I hope now you got what I need.
0
Gopala
Top achievements
Rank 1
answered on 01 Apr 2013, 03:22 PM
Hi,

I continuation to my above reply. I wrote my code simiar to the one below. The performance is really bad. It's urgent we have a deadline

http://sladapter.blogspot.com/2010/11/how-to-bind-to-silverlight-treeview.html
0
Gopala
Top achievements
Rank 1
answered on 01 Apr 2013, 11:45 PM

I was able to solve my issue. Please see below for what I did. Comments and suggestions are always welcomed to improve my code.

In my UI I added this under UserControl.Resources

    <telerik:ContainerBindingCollection x:Key="BindingCollection">
                    <telerik:ContainerBinding PropertyName="IsSelected"
                                              Binding="{Binding IsSelected,Mode=TwoWay}" />
                    <telerik:ContainerBinding PropertyName="IsExpanded"
                                              Binding="{Binding IsExpanded, Mode=TwoWay}" />
                </telerik:ContainerBindingCollection>

I add below in my <telerik:RadTreeView.ItemTemplate>

    <telerik:RadTreeView.ItemTemplate>
                    <telerik:HierarchicalDataTemplate ItemsSource="{Binding Children}"
                                                      DataType="ViewModels:ReportRootEntityViewModel"
                                                      telerik:ContainerBinding.ContainerBindings="{StaticResource BindingCollection}">

My ItemsSource is collection of ReportRootEntityViewModel. In this, I added three new properties.

One is Parent of type ReportRootEntityViewModel.

Two boolean properties IsSelected and IsExpanded

Now it just matter of getting correct element and setting properties as below

    ReportRootEntityViewModel result = GetReportRootNode(Convert.ToInt32(data[0]), reportRoot.Children);
                if (result != null)
                {
                  if (_previousSelectedReportRoots != null)
                  {
                    _previousSelectedReportRoots.Parent.Parent.IsExpanded = false;
                    _previousSelectedReportRoots.Parent.IsExpanded = false;
                    _previousSelectedReportRoots.IsExpanded = false;
   
                    _previousSelectedReportRoots.IsSelected = false;
                  }
   
                  result.Parent.Parent.IsExpanded = true;
                  result.Parent.IsExpanded = true;
                  result.IsExpanded = true;
   
                  result.IsSelected = true;             
                  SelectedReportRoot = result;
                 
                  SelectedReportRootDisplayName = data[1];
                 DisplayLabel = "Display Name :";
                  _previousSelectedReportRoots = SelectedReportRoot;
                  return;
                } 

 

 

0
Tina Stancheva
Telerik team
answered on 03 Apr 2013, 12:40 PM
Hello Gopala,

We've posted a reply in the other forum thread you started and it will best to keep the communication there.

Regards,
Tina Stancheva
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Gopala
Top achievements
Rank 1
answered on 03 Apr 2013, 11:47 PM
Ok...
Tags
TreeView
Asked by
Predrag
Top achievements
Rank 1
Answers by
Kiril Stanoev
Telerik team
Predrag
Top achievements
Rank 1
Petar Mladenov
Telerik team
Mark
Top achievements
Rank 1
Hristo
Telerik team
Gopala
Top achievements
Rank 1
Pavel R. Pavlov
Telerik team
Tina Stancheva
Telerik team
Share this question
or