Questions on UI for WPF Forum

25,520 questions

2 answers

315 views

Select Entire Row and Remove Expand Buttons

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>         

TreeView

answered on 13 May 2010

3 answers

194 views

RadDock Save Layout To App Settings

I know I can persist the RadDock layout to a file, but can I persist the layout to an application setting property? If so any example?

Thanks!

Docking

answered on 13 May 2010

4 answers

663 views

Change style of scrollbar

Can someone describe the easiest way to edit the style of the scrollbar.
I tried with Blend but it only changes background color which is not enough. I want to restyle everything, like bars and buttons, including style when clicked and dragged and hovered (Like any other style).
How can I manage this without too much work (E.q. creating a new theme).
Seems this is not in the styles in Blend???

GridView

answered on 13 May 2010

3 answers

173 views

How to integrate with TabControl

How does one integrate transitions with TabControl?

TransitionControl

answered on 13 May 2010

1 answer

192 views

HierarchyChildTemplate and RowDetailsTemplate

Hi, I don't understand the difference between HierarchyChildTemplate and RowDetailsTemplate
when to use one rather than the other.

Thanks
Dario

GridView

answered on 13 May 2010

5 answers

195 views

BringDataItemIntoView scrolling

Hi,

I'm using BringDataItemIntoView to go to the item i reselect after i refresh my grid.

But now i have a problem with when you select an item in the grid that is already visible (no scrolling required) and there aren't enough items to make the grid scroll.

So what happens the grid sets the selected item to the first row visible and the records above aren't shown any more and there isn't a scrollbar visible.

For example
If you have 3 records in the grid and you call the method BringDataItemIntoView on the third record, then this will put the 3 record to the first visible record in the grid but the 2 records above aren't visible any more and there also isn't a scrollbar (using the mouse wheel does the trick for scrolling)

Any ideas how i can fix this?

My code to bring the currentitem in to view

    
                                    int logId = 0;  
        
                                    if (radGridDocuments.CurrentItem != null)  
        
                                        logId = (radGridDocuments.CurrentItem as DocumentLog).LogId;  
        
                                    Mouse.OverrideCursor = Cursors.Wait;  
        
                                    btnDocumentsForTruck.IsChecked = false;  
        
                                    fillDocumentLog(((PrintShop.Data.Action)dtcDocumentType.SelectedItem).Name, txtCustomerName.Text, dtpFrom.SelectedDate, dtpTo.SelectedDate, txtDocumentNumber.Text, (dtcSender.SelectedItem as Sender).SenderId);  
        
                                    if (logId != 0)  
        
                                    {  
        
                                        DocumentLog d = (radGridDocuments.ItemsSource as BindingList<DocumentLog>).FirstOrDefault(x => x.LogId == logId);  
        
                                        if (d != null)  
        
                                        {  
        
                                            Record record = radGridDocuments.FindRecord(d);  
        
                                            record.IsSelected = true;  
        
                                            record.IsCurrent = true;  
        
                                            radGridDocuments.BringDataItemIntoView(radGridDocuments.CurrentItem);  
        
                                        }  
        
                                    }

GridView

answered on 13 May 2010

1 answer

139 views

Scrollbar in a RowDetails Grid

Hi, why can't I activate the orizzontal scrollbar in a RowDetails Grid ? I set ScrollViewer.HorizontalScrollBarVisibility="Visible" the scrollbar is visible but not enabled. Even the FreezeColumns don't run in the RowDetails Grid
(Version Q3 2009 SP2)

    
                        <telerikGridView:RadGridView x:Name="RiepiloghiPeriodi0Grid" Grid.Row="1" Grid.Column="0" AutoGenerateColumns="False" CanUserFreezeColumns="True" ShowGroupPanel="False" ItemsSource="{Binding RiepiloghiPeriodi0ItemsSource, Mode=TwoWay}" CurrentItem="{Binding RiepiloghiPeriodi0CurrentItem, Mode=TwoWay}" Margin="0,0,0,0" Initialized="RiepiloghiPeriodi0Grid_Initialized" CanUserDeleteRows="False" CanUserInsertRows="False" AreRowDetailsFrozen="False">  
        
                            <telerikGridView:RadGridView.RowDetailsTemplate> 
        
                                <DataTemplate> 
        
                                    <telerikGridView:RadGridView x:Name="RiepiloghiPeriodi1Grid" AutoGenerateColumns="False" CanUserFreezeColumns="True" ShowGroupPanel="True" ItemsSource="{Binding RiepilogoPeriodiVOList, Mode=TwoWay}" Margin="15,15,15,15" Initialized="RiepiloghiPeriodi1Grid_Initialized" CanUserDeleteRows="False" CanUserInsertRows="False" ShowGroupFooters="True" ShowColumnFooters="True" ScrollViewer.HorizontalScrollBarVisibility="Visible">    
        
                                    </telerikGridView:RadGridView> 
        
                                </DataTemplate> 
        
                            </telerikGridView:RadGridView.RowDetailsTemplate> 
        
                        </telerikGridView:RadGridView>

Thanks, Dario.

GridView

answered on 13 May 2010

1 answer

56 views

Newly added row select is not indicated

Hi,

I have a grid of System.Data.DataRow of System.Data.DataTable. I add a new row to the DataTable and I call Rebind() to refresh the content od the datagrid. Then I edit the fields of the new row in the grid. Finally I want to select the new row, but nothing happens (the color of the row is unchanged), though I can select other rows (they changes their color). I implemented the SelectionChanged method of the datagrid to figure out if the selection of the new row happens when I click on it. And it does! But it does not change color, so it is not indicated to the user that the selection was successful. Is it a known bug, or do I something wrong?

Thanks in advance!

Ferenc

GridView

answered on 13 May 2010

1 answer

87 views

RadDocking & Windows7Theme

Hello,

I have some problems with RadDocking with Windows7 Theme.

1. When "Center Indicator" is hidden, other indicators aren't correctly displayed. This problem also occurs in your demo application in Compass/Style section.

2. There is two title bars and two Cross button for floating panel.

Regards,
Guillaume.

Docking

answered on 13 May 2010

1 answer

73 views

paging focus sepecific row

hello!

I use RadDataPager (page size = 10). I want to focus on a specific row. I tried this code:

private

void GV_Results_DataLoaded(object sender, EventArgs e)

{

if (SelectedEntity != null)

V_Result SelectedRow = (

from V_Result r in GV_Results.Items

where r.R_ID.Equals(SelectedEntity.R_ID)

select r).FirstOrDefault();

GV_Results.SelectedItem = SelectedRow;

int selectedIndex = GV_Results.Items.IndexOf(GV_Results.SelectedItem);

if (selectedIndex != -1)

{

int pageIndex = selectedIndex / rpg_results.PageSize;

rpg_results.MoveToPage(pageIndex);

}
}
What happens is, in the data loaded function the grid loads only 10 records in each page index.
so if the wanted row is not in the first page, the SelectedRow is null. (because GV_Results.Items contains only the records that are in the first page).
And if I go to the page that contains the wanted row, the selectedRow is not null, but the selectedIndex will be 5 if the selected item was item number 15, and 7 if the selected index was actualy 27. Because
GV_Results.Items.IndexOf(GV_Results.SelectedItem); again behaves like it has only 10 items.

How can I focus on the selected item if it is not in the firs page?

GridView

answered on 12 May 2010

Top users last month