Select Entire Row and Remove Expand Buttons

3 posts, 1 answers
  1. Ryan Black
    Ryan Black avatar
    54 posts
    Member since:
    Mar 2010

    Posted 07 May 2010 Link to this post

    Hopefully someone can shed some light on these issues for me.

    I have 3 states for my listitems (normal, clicked, highlighted) and would like these states to expand the entire length of the treeview control on mouse hover, selected, unselected.  I would also like to remove the expand buttons and have the treeview expand when a user clicks on the main item.  I found this example and thought there had to be an easier way for the treeview selection.  I hope there is!  Any help would be most appreciated.

    The good news is that I got databinding working :)

    A picture of my problems can be see here

    Thanks in advance
    Ryan

    My xml is as follows:
    <?xml version="1.0" encoding="utf-8" ?> 
    <Scenes> 
      <Scene name="Test"
        <Procedures> 
          <Procedure name="Ryan" /> 
          <Procedure name="Rocks" /> 
          <Procedure name="AT" /> 
          <Procedure name="Photoshop" /> 
        </Procedures> 
      </Scene> 
      <Scene name="Test2"
        <Procedures> 
          <Procedure name="WPF" /> 
          <Procedure name="Is" /> 
          <Procedure name="The" /> 
          <Procedure name="Best" /> 
          <Procedure name="Language" /> 
        </Procedures> 
      </Scene> 
      <Scene name="Test3"
        <Procedures> 
          <Procedure name="Firefox" /> 
          <Procedure name="IE" /> 
          <Procedure name="And" /> 
          <Procedure name="Opera" /> 
          <Procedure name="All" /> 
          <Procedure name="Suck" /> 
        </Procedures> 
      </Scene> 
    </Scenes> 

    And my mostly copied example code is below:
    <Window xmlns:my1="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"  xmlns:my="clr-namespace:CustomItemsPanel.ListBox"  x:Class="CustomItemsPanel.Window1" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:local="clr-namespace:CustomItemsPanel" 
        xmlns:Telerik="http://schemas.telerik.com/2008/xaml/presentation" 
        Title="Custom ItemsPanel" Height="461" Width="615" 
        WindowStartupLocation="CenterScreen" 
        > 
     
        <Window.Resources> 
            <!-- List Item Selected --> 
            <LinearGradientBrush x:Key="GotFocusStyle"  EndPoint="0.5,1" StartPoint="0.5,0"
                <LinearGradientBrush.GradientStops> 
                    <GradientStop Color="Black" Offset="0.501"/> 
                    <GradientStop Color="#FF091F34"/> 
                    <GradientStop Color="#FF002F5C" Offset="0.5"/> 
                </LinearGradientBrush.GradientStops> 
            </LinearGradientBrush> 
     
            <!-- List Item Hover --> 
            <LinearGradientBrush x:Key="MouseOverFocusStyle" StartPoint="0,0" EndPoint="0,1"
                <LinearGradientBrush.GradientStops> 
                    <GradientStop Color="#FF013B73" Offset="0.501"/> 
                    <GradientStop Color="#FF091F34"/> 
                    <GradientStop Color="#FF014A8F" Offset="0.5"/> 
                    <GradientStop Color="#FF003363" Offset="1"/> 
                </LinearGradientBrush.GradientStops> 
            </LinearGradientBrush> 
     
            <!-- List Item UnSelected --> 
            <LinearGradientBrush x:Key="LostFocusStyle" EndPoint="0.5,1" StartPoint="0.5,0"
                <LinearGradientBrush.RelativeTransform> 
                    <TransformGroup> 
                        <ScaleTransform CenterX="0.5" CenterY="0.5"/> 
                        <SkewTransform CenterX="0.5" CenterY="0.5"/> 
                        <RotateTransform CenterX="0.5" CenterY="0.5"/> 
                        <TranslateTransform/> 
                    </TransformGroup> 
                </LinearGradientBrush.RelativeTransform> 
                <GradientStop Color="#FF091F34" Offset="1"/> 
                <GradientStop Color="#FF002F5C" Offset="0.4"/> 
            </LinearGradientBrush> 
     
            <!-- List Item Highlight --> 
            <SolidColorBrush x:Key="ListItemHighlight" Color="#FFE38E27" /> 
     
            <!-- List Item UnHighlight --> 
            <SolidColorBrush x:Key="ListItemUnHighlight" Color="#FF6FB8FD" /> 
     
            <!-- Button Gradient --> 
            <LinearGradientBrush x:Key="ButtonGradient" EndPoint="0.5,1" StartPoint="0.5,0"
                <GradientStop Color="#FF0E3D70"/> 
                <GradientStop Color="#FF001832" Offset="1"/> 
            </LinearGradientBrush> 
        </Window.Resources> 
         
         
        <Grid> 
            <Grid.Resources> 
                <Style TargetType="ToggleButton" x:Key="Expander"
                    <Setter Property="IsTabStop" Value="False" /> 
                    <Setter Property="Cursor" Value="Hand" /> 
                    <Setter Property="Template"
                        <Setter.Value> 
                            <ControlTemplate TargetType="{x:Type ToggleButton}"
                                <ControlTemplate.Triggers> 
                                    <Trigger Property="IsMouseOver" Value="True"
                                        <Trigger.EnterActions> 
                                            <BeginStoryboard> 
                                                <Storyboard> 
                                                    <DoubleAnimation Duration="0:0:0.05" 
                                                            Storyboard.TargetName="Button" 
                                                            Storyboard.TargetProperty="Opacity" To="0" /> 
                                                    <DoubleAnimation Duration="0:0:0.05" 
                                                            Storyboard.TargetName="ButtonOver" 
                                                            Storyboard.TargetProperty="Opacity" To="1" /> 
                                                </Storyboard> 
                                            </BeginStoryboard> 
                                        </Trigger.EnterActions> 
                                    </Trigger> 
                                    <Trigger Property="IsChecked" Value="True"
                                        <Trigger.EnterActions> 
                                            <BeginStoryboard> 
                                                <Storyboard> 
                                                    <DoubleAnimation Duration="0:0:0.05" 
                                                            Storyboard.TargetName="CollapsedVisual" 
                                                            Storyboard.TargetProperty="Opacity" To="0" /> 
                                                    <DoubleAnimation Duration="0:0:0.05" 
                                                            Storyboard.TargetName="CollapsedVisualOver" 
                                                            Storyboard.TargetProperty="Opacity" To="0" /> 
                                                </Storyboard> 
                                            </BeginStoryboard> 
                                        </Trigger.EnterActions> 
                                        <Trigger.ExitActions> 
                                            <BeginStoryboard> 
                                                <Storyboard> 
                                                    <DoubleAnimation Duration="0:0:0.05" 
                                                            Storyboard.TargetName="CollapsedVisual" 
                                                            Storyboard.TargetProperty="Opacity" To="1" /> 
                                                    <DoubleAnimation Duration="0:0:0.05" 
                                                            Storyboard.TargetName="CollapsedVisualOver" 
                                                            Storyboard.TargetProperty="Opacity" To="1" /> 
                                                </Storyboard> 
                                            </BeginStoryboard> 
                                        </Trigger.ExitActions> 
                                    </Trigger> 
     
                                </ControlTemplate.Triggers> 
                                <Grid> 
                                    <Grid x:Name="Button" Margin="0,7,4,0" HorizontalAlignment="Right" 
                                            VerticalAlignment="Top" Width="11" Height="11"
                                        <Grid.Background> 
                                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"
                                                <GradientStop Color="#3F047BA5" Offset="0.996" /> 
                                                <GradientStop Color="#00000000" Offset="0" /> 
                                            </LinearGradientBrush> 
                                        </Grid.Background> 
                                        <Rectangle Stroke="#FF000000" HorizontalAlignment="Left" 
                                                VerticalAlignment="Top" Width="11" Height="11" /> 
     
                                        <Rectangle x:Name="CollapsedVisual" Fill="#FF000000" 
                                                HorizontalAlignment="Left" VerticalAlignment="Top" 
                                                Width="1" Height="5" Margin="5,3,0,0" /> 
                                        <Rectangle Fill="#FF000000" VerticalAlignment="Top" 
                                                HorizontalAlignment="Left" Height="1" Width="5" 
                                                Margin="3,5,0,0" /> 
                                    </Grid> 
     
                                    <Grid x:Name="ButtonOver" Margin="0,7,4,0" 
                                            HorizontalAlignment="Right" VerticalAlignment="Top" 
                                            Width="11" Height="11"
                                        <Rectangle Stroke="#FF167497" HorizontalAlignment="Left" 
                                                VerticalAlignment="Top" Width="11" Height="11"
                                            <Rectangle.Fill> 
                                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"
                                                    <GradientStop Color="#26167497" Offset="1" /> 
                                                    <GradientStop Color="#00167497" Offset="0" /> 
                                                </LinearGradientBrush> 
                                            </Rectangle.Fill> 
                                        </Rectangle> 
                                        <Rectangle x:Name="CollapsedVisualOver" Fill="#FF167497" 
                                                HorizontalAlignment="Left" VerticalAlignment="Top" 
                                                Width="1" Height="5" Margin="5,3,0,0" /> 
                                        <Rectangle Fill="#FF167497" VerticalAlignment="Top" 
                                                HorizontalAlignment="Left" Height="1" Width="5" 
                                                Margin="3,5,0,0" /> 
     
                                    </Grid> 
                                </Grid> 
     
                            </ControlTemplate> 
                        </Setter.Value> 
                    </Setter> 
                </Style> 
                
                <XmlDataProvider x:Key="MyList" Source="XML/Scenes.xml"/> 
     
                <HierarchicalDataTemplate x:Key="League" ItemsSource="{Binding XPath=Procedures/Procedure}"
                        <Border BorderBrush="#FF103C62" BorderThickness="1"  Margin="-2,0,0,-1"
                            <Grid> 
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Telerik:RadTreeView}}, Path=ActualWidth}" /> 
                                </Grid.ColumnDefinitions> 
                                <Label  
                                VerticalContentAlignment="Center" BorderThickness="0" BorderBrush="Transparent" 
                                Foreground="White" 
                                FontSize="18" 
                                Tag="{Binding XPath=@name}" 
                                        MinHeight="55" 
                                Cursor="Hand" 
                                FontFamily="Arial" 
                                FocusVisualStyle="{x:Null}" 
                                KeyboardNavigation.TabNavigation="None" 
                                Background="{StaticResource LostFocusStyle}" 
                                Name="SubItem" 
                                > 
                                    <Label.ContextMenu> 
                                        <ContextMenu Name="editMenu"
                                            <MenuItem Header="Edit"/> 
                                        </ContextMenu> 
                                    </Label.ContextMenu> 
                                    <TextBlock Text="{Binding XPath=@name}" Margin="15,0,40,0" TextWrapping="Wrap"></TextBlock> 
                                </Label> 
                            </Grid> 
     
                        </Border> 
                </HierarchicalDataTemplate> 
        
            </Grid.Resources> 
            <Grid Width="300" Height="320" HorizontalAlignment="Center" VerticalAlignment="Center"
                <Border  BorderBrush="#FF000000" CornerRadius="5" BorderThickness="5" Background="#FFFFFFFF"
     
                    <Telerik:RadTreeView 
                    ExpanderStyle="{StaticResource Expander}"  
                    ItemsSource="{Binding Source={StaticResource MyList}, XPath=/Scenes/Scene}" 
                    ItemTemplate="{StaticResource League}" 
                         
                        /> 
                </Border> 
            </Grid> 
        </Grid> 
     
    </Window> 


  2. Answer
    Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 13 May 2010 Link to this post

    Hello Ryan Black,

    Please accept my apology for the delayed response.
    I prepared a sample project for you. Take a look at it and let me know if this is what you had in mind or if you need more info.

    Kind regards,
    Tina Stancheva
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. UI for WPF is Visual Studio 2017 Ready
  4. Ryan Black
    Ryan Black avatar
    54 posts
    Member since:
    Mar 2010

    Posted 13 May 2010 Link to this post

    Tina,

    That example was worth the wait!  Thank you so much.  That was way better than the approaches I was taking.
    Keep up the good work!

    Ryan
Back to Top