Expand/collapse on mouseEnter?

3 posts, 0 answers
  1. Emilio
    Emilio avatar
    2 posts
    Member since:
    Oct 2013

    Posted 14 Apr Link to this post

    Hello,

    I'd like to be able to expand/collapse the TreeviewItems by simply mousing over.  I see that this was resolved in a web setting using javascript (http://www.telerik.com/forums/treeview-expand-on-hover), but is there a way to do this in WPF?

    Thanks,

    Emilio

  2. Emilio
    Emilio avatar
    2 posts
    Member since:
    Oct 2013

    Posted 14 Apr Link to this post

    Oops, nevermind.  The solution was actually easier than I thought.

    By setting an event handler for the TreeViewItemContainerStyle in my XAML, I was able to manipulate the IsExpanded property.

    <Style x:Key="TreeViewItemContainerStyle" TargetType="{x:Type tp:RadTreeViewItem}">
        <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}"/>
        <EventSetter Event="MouseEnter" Handler="RadTreeViewItem_MouseEnter"/>
    </Style>

     

    private void RadTreeViewItem_MouseEnter(object sender, MouseEventArgs e)
    {
        var hoveredItem = sender as RadTreeViewItem;
        if (hoveredItem.IsExpanded)
            hoveredItem.IsExpanded = false;
        else
            hoveredItem.IsExpanded = true;
    }
  3. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2986 posts

    Posted 18 Apr Link to this post

    Hello Emilio,

    I would also suggest the following which avoid the code behind:

    <Style TargetType="telerik:RadTreeViewItem">
                   <Setter Property="IsExpanded" Value="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" />
               </Style>


    Regards,
    Petar Mladenov
    Telerik by Progress
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Back to Top