Questions on UI for WPF Forum

4 answers

218 views

Hi,

is there a way to change the time display format to 24h, or generally adjust the date time format in the time bars?

Regards,
Mathias

TimeLine

answered on 25 May 2012

1 answer

213 views

Styling Performance

I am using the RadGridView in conjunction with the filter control for a project. The data in the GridView is readonly. I have the IsReadOnly property set to true. I am using one of the builtin styles (Office_Silver theme) but I am overriding some of the styles because we don't like the way rows and column headers are still being highlighted (turns yellow) when the user's mouse hovers over a row or column. It gives the user a false sense that they are supposed to be able to do something when they can't. Anyhow, when I set the Style property with the overridden style resource the performance of the GridView degrades big time. I have a 2800 row data set that I am loading into the RadGridView control and it takes 3 to 4 minutes to load. If I remove the Style property setting, it is almost instantaneous. The problem is obviously with my styling. Unfortunately, much of WPF's styling still eludes me.

Here is my style:

<Style x:Key="RadGridViewReadOnlyStyle" TargetType="{x:Type telerik:RadGridView}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type telerik:RadGridView}">

<AdornerDecorator>

<Border x:Name="PART_MasterGridContainer" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">

<Grid x:Name="HierrarchyBackground" Background="{TemplateBinding Background}">

<Grid.ColumnDefinitions>

<ColumnDefinition/>

<ColumnDefinition x:Name="ScrollBarColumn" MinWidth="0" Width="0"/>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

<RowDefinition Height="Auto"/>

<RowDefinition x:Name="PART_AttachedBehaviorRow" Height="Auto"/>

<RowDefinition/>

<RowDefinition x:Name="ScrollBarRow" Height="0" MinHeight="0"/>

<RowDefinition Height="Auto"/>

</Grid.RowDefinitions>

<telerik:GridViewGroupPanel x:Name="PART_GroupPanel" BorderBrush="#FF848484" Background="{TemplateBinding GroupPanelBackground}" Grid.ColumnSpan="2" Foreground="{TemplateBinding GroupPanelForeground}" IsTabStop="False" Grid.Row="0">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewGroupPanel>

<telerik:GridViewScrollViewer x:Name="PART_ItemsScrollViewer" Background="Transparent" CanContentScroll="True" Grid.ColumnSpan="2" Grid.Row="2" Grid.RowSpan="2">

<telerik:GridViewScrollViewer.FooterRow>

<telerik:GridViewFooterRow x:Name="PART_FooterRow" IsTabStop="False" IndentLevel="{TemplateBinding GroupCount}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewFooterRow>

</telerik:GridViewScrollViewer.FooterRow>

<telerik:GridViewScrollViewer.HeaderRow>

<telerik:GridViewHeaderRow x:Name="PART_HeaderRow" IsTabStop="False" IndentLevel="{TemplateBinding GroupCount}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewHeaderRow>

</telerik:GridViewScrollViewer.HeaderRow>

<telerik:GridViewScrollViewer.NewRow>

<telerik:GridViewNewRow x:Name="PART_AddNewRow" IsTabStop="False" IndentLevel="{TemplateBinding GroupCount}" Visibility="Collapsed">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewNewRow>

</telerik:GridViewScrollViewer.NewRow>

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

<Grid>

<telerik:GridViewVirtualizingPanel x:Name="PART_GridViewVirtualizingPanel"/>

<Label></Label>

</Grid>

</telerik:GridViewScrollViewer>

<telerik:ScrollPositionIndicator x:Name="PART_ScrollPositionIndicator" Grid.ColumnSpan="2" ContentTemplate="{TemplateBinding ScrollPositionIndicatorTemplate}" HorizontalAlignment="Right" IsHitTestVisible="False" IsTabStop="False" Margin="0,0,28,0" Grid.Row="2">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

<telerik:ScrollPositionIndicator.Visibility>

<Binding Mode="TwoWay" Path="IsScrolling" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<telerik:BooleanToVisibilityConverter/>

</Binding.Converter>

</Binding>

</telerik:ScrollPositionIndicator.Visibility>

</telerik:ScrollPositionIndicator>

<Border x:Name="PART_FrozenColumnsPreview" Background="#33000000" HorizontalAlignment="Left" Grid.Row="1" Grid.RowSpan="4" Visibility="Collapsed" VerticalAlignment="Stretch" Width="6"/>

<telerik:GridViewLoadingIndicator x:Name="PART_GridViewLoadingIndicator" Grid.ColumnSpan="2" IsTabStop="False" Grid.RowSpan="4" Visibility="Collapsed">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewLoadingIndicator>

<Rectangle x:Name="Background_Disabled" Grid.ColumnSpan="2" IsHitTestVisible="False" Grid.RowSpan="5" Visibility="Collapsed">

<Rectangle.Fill>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#E5000000"/>

<GradientStop Color="#E5000000" Offset="1"/>

<GradientStop Color="#4C000000" Offset="0.5"/>

</LinearGradientBrush>

</Rectangle.Fill>

</Rectangle>

</Grid>

</Border>

</AdornerDecorator>

<ControlTemplate.Triggers>

<Trigger Property="IsBusy" Value="True">

<Setter Property="Visibility" TargetName="PART_GridViewLoadingIndicator" Value="Visible"/>

</Trigger>

<Trigger Property="IsBusy" Value="False">

<Setter Property="Visibility" TargetName="PART_GridViewLoadingIndicator" Value="Collapsed"/>

</Trigger>

<Trigger Property="IsEnabled" Value="False">

<Setter Property="Visibility" TargetName="Background_Disabled" Value="Visible"/>

</Trigger>

<Trigger Property="ShowColumnFooters" Value="False">

<Setter Property="Visibility" TargetName="PART_FooterRow" Value="Collapsed"/>

</Trigger>

<Trigger Property="ShowColumnHeaders" Value="False">

<Setter Property="Visibility" TargetName="PART_HeaderRow" Value="Collapsed"/>

</Trigger>

<Trigger Property="ShowGroupPanel" Value="False">

<Setter Property="Visibility" TargetName="PART_GroupPanel" Value="Collapsed"/>

</Trigger>

<Trigger Property="ComputedVerticalScrollBarVisibility" SourceName="PART_ItemsScrollViewer" Value="Collapsed">

<Setter Property="Width" TargetName="ScrollBarColumn" Value="0"/>

</Trigger>

<Trigger Property="ComputedHorizontalScrollBarVisibility" SourceName="PART_ItemsScrollViewer" Value="Collapsed">

<Setter Property="Height" TargetName="ScrollBarRow" Value="0"/>

<Setter Property="Grid.RowSpan" TargetName="PART_ItemsScrollViewer" Value="1"/>

</Trigger>

<Trigger Property="ShowInsertRow" Value="True">

<Setter Property="Visibility" TargetName="PART_AddNewRow" Value="Visible"/>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="Background" Value="White"/>

<Setter Property="BorderBrush" Value="#FF848484"/>

<Setter Property="Foreground" Value="Black"/>

<Setter Property="BorderThickness" Value="1"/>

<Setter Property="AlternateRowBackground" Value="#FFF4F4F4"/>

<Setter Property="VerticalGridLinesBrush" Value="#FFCBCBCB"/>

<Setter Property="HorizontalGridLinesBrush" Value="#FFCBCBCB"/>

<Setter Property="GroupPanelBackground">

<Setter.Value>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFDFDFDF" Offset="1"/>

<GradientStop Color="#FFBABABA"/>

</LinearGradientBrush>

</Setter.Value>

</Setter>

<Setter Property="GroupPanelForeground" Value="Black"/>

<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>

<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>

<Setter Property="VerticalAlignment" Value="Stretch"/>

<Setter Property="HorizontalAlignment" Value="Stretch"/>

<Setter Property="SnapsToDevicePixels" Value="True"/>

</Style>

Here is the XAML for my RadGridView control:

<telerikGV:RadGridView Name="DocLogFilterGridView"

CanUserFreezeColumns="False" CanUserReorderColumns="True" CanUserResizeColumns="True"

CanUserSortColumns="False" IsFilteringAllowed="True" IsReadOnly="True" ShowGroupPanel="False"

CanUserDeleteRows="False" CanUserInsertRows="False" CanUserSelect="False"

RowIndicatorVisibility="Collapsed"

ColumnReordered="DocLogFilterGridView_ColumnReordered"

ColumnWidthChanged="DocLogFilterGridView_ColumnWidthChanged"

AutoGeneratingColumn="DocLogFilterGridView_AutoGeneratingColumn"

DataLoaded="DocLogFilterGridView_DataLoaded"

ColumnReordering="DocLogFilterGridView_ColumnReordering"

ColumnWidthChanging="DocLogFilterGridView_ColumnWidthChanging"

Filtered="DocLogFilterGridView_Filtered"

SizeChanged="DocLogFilterGridView_SizeChanged"

SelectionChanging="DocLogFilterGridView_SelectionChanging"

telerik:StyleManager.Theme="Office_Silver" Style="{DynamicResource RadGridViewReadOnlyStyle}"

Loaded="DocLogFilterGridView_Loaded" EnableColumnVirtualization="True" EnableRowVirtualization="True">

</telerikGV:RadGridView>

Is there something I am doing wrong? Is there a better way to style the RadGridView so that it is more performant? Is there perhaps a different way to accomplish this?

Thanks for any help that can be provided.

Dustin

GridView

answered on 25 May 2012

7 answers

117 views

2012.1.215.35 breaks theme on windows controls

Hi,

I am currently using the metro theme in a .net 3.5 application.

When i upgrade to the latest version of the telerik controls, the themes break on some of the windows controls they are applied to.

For example, the checkbox control no longer shows when it is checked, and the password box has a border inside the textbox, I have not gone through all the other controls but some still show up just fine, like the textbox.

I am using styles in the app.xaml to set the theme styles on windows controls.

<Style TargetType="TextBox" BasedOn="{StaticResource {telerik:ThemeResourceKey ThemeType=telerik:MetroTheme, ElementType=TextBox}}" /><br

>    

<

Style TargetType="ListBox" BasedOn="{StaticResource {telerik:ThemeResourceKey ThemeType=telerik:MetroTheme, ElementType=ListBox}}" /><br

>    

<

Style TargetType="CheckBox" BasedOn="{StaticResource {telerik:ThemeResourceKey ThemeType=telerik:MetroTheme, ElementType=CheckBox}}" /><br

>    

<

Style TargetType="PasswordBox" BasedOn="{StaticResource {telerik:ThemeResourceKey ThemeType=telerik:MetroTheme, ElementType=PasswordBox}}" /><br

>    

<

Style TargetType="ScrollViewer" BasedOn="{StaticResource {telerik:ThemeResourceKey ThemeType=telerik:MetroTheme, ElementType=ScrollViewer}}" />

Reverting to the previous version of the telerik controls fixed the issue for now.(2011.3.1220.35)

Thank you,

General Discussions

answered on 25 May 2012

4 answers

633 views

Styling Contents of Filter Drop Down

I'm trying to style the contents of the filter drop down for each of the gird view columns. I'm happy with the actual contents and layout of the controls, I'm just wanting to change the colour scheme for all the check boxes, combo boxes, text boxes and buttons on the filter drop down. Can anyone point me in the right direction to achieve this?

GridView

answered on 24 May 2012

4 answers

197 views

StyleManager that uses current theme

I have the following requirement: I have modified styles taken from Implicit styles project, in order to achieve some custom appearance for TreeListView. When I run the application with this style, everything works fine. Next requirement is that I need to paint the background differently for each row based on some property value of item in collection.

<RadTreeListView RowStyleSelector="{StaticResource TaskRowStyleSelector}" />

<Style x:Key="PendingTreeListViewRowStyle" TargetType="telerik:TreeListViewRow">

<Setter Property="Background" Value="#FFFFE1C4" />

</Style>

<local:PersonRowStyleSelector x:Key="TaskRowStyleSelector"

PendingStyle="{StaticResource PendingTreeListViewRowStyle}"

.../>

And I have a TaskSelector which inherits from using System.Windows.Controls;StyleSelector. When I run the application, background is applied correctly, however I am loosing custom style that I made for RadTreeListView and RadTreeListViewItem. Next thing I tried is to add BasedOn attribute in above style, but then it doesn't paint the background (Setter Background doesn't do anything)..

So, how can I use style selector, set a background property, while preserving the custom made style for RadTreeListView and its sub elements.

TreeListView

answered on 24 May 2012

6 answers

523 views

Insert LineBreak with padding to a given position (code sample)

I've written some code that insert a line break and pads the new line to a specified position along the document X axis.

I needed this code as you cannot insert new lines with indent properties. Only paragraphs can have indent properties.

So why not use a paragraph you say? Well, I needed to be able to wrap custom annotations around multiple lines which cannot be done with Paragraphs.

Main Method: When inserting into the document you will need to change the Style that I have used (see inside the while loop). My style just highlights the blank padding so I can visually see what's going on.

public static void InsertLineBreakWithSpacing(this RadDocument document, PointF positionSpacing)

{

//Insert line break at caret position

document.InsertLineBreak();

//Insert line spaces for padding until position is found

while(positionSpacing.X > document.CaretPosition.Location.X)

{

document.Insert(" ", RadDocumentStyles.LineBreakSpacing());

}

Method Call:

//Pass - reference to RadDocument - Location to pad line out to

RadDocumentExtensions.InsertLineBreakWithSpacing(radRichTextBox.Document,radRichTextBox.Document.CaretPosition.Location);

Here's my Span Style to highlight the new line padding as I previously mentioned:

public static StyleDefinition LineBreakSpacing()

{

StyleDefinition lineBreak = new StyleDefinition();

lineBreak.Type = StyleType.Character;

lineBreak.SpanProperties.HighlightColor = Colors.LightGreen;

lineBreak.DisplayName = "lineBreakSpacing";

lineBreak.Name = "lineBreakSpacing";

return lineBreak;

}

I hope this helps you.

Please let me know if you know of a better way to achieve this.

Thanks,

Rob

RichTextBox

answered on 24 May 2012

1 answer

98 views

Load KML from background thread

Is it possible to read KML from a background thread?
We have some rather large KML files and want the UI to remain responsive while we load the data.

We have been using KmlReader.Read(), is there a background thread friendly alternative to this that we can use?

Map

answered on 24 May 2012

2 answers

190 views

Resizing columns when headers are hidden

Hello,

I have a scenario where I must hide the column headers using ShowColumnHeaders="False" . Once the headers are hidden, I cannot resize the columns anymore.

Is it possible to show the "double-arrow" between grid cells to allow resizing the grid even when headers are hidden? Any other suggestion?

Many thanks,

Simon

GridView

answered on 24 May 2012

6 answers

216 views

Is there a way to prevent focus rectangle from moving when expanding nodes?

The RadTreeView seems to move the focus rectangle to child nodes as you expand parent nodes, which is not desirable because in long trees it means that there is a lot of scrolling going on.

The attached images show the problem. I start with a single parent node that has the focus rectangle on it. As I expand nodes, the focus rectangle gets shifted to the child nodes as they are shown. I want the focus rectangle to stay with the original node so that there is no scrolling.

TreeView

answered on 24 May 2012

2 answers

91 views

How to hide one of the time bars

Hi,

can someone give me a hint now to hide one of the time bars of the timeline control? The vertical space is very limited where I'm trying to use it, so it should not be higher than about 50 pixels.

Any help is appreciated.

Regards,
Mathias

TimeLine

answered on 24 May 2012