Questions on UI for WPF Forum

6 answers

175 views

number formatting like 23,344.45 should be displayed only in view mode. but when user enter it should display 23444.45 without formatting.
Below text property is not displaying data in N2 string format. what is correct way to use Value and Text property.?

<RadMaskedNumericInput
Value="{Binding XXX, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}"
Mask="" Text={Binding StringFormat=N2}"/>

MaskedInput (Numeric, DateTime, Text, Currency)

answered on 09 Nov 2012

3 answers

333 views

[Solved] Maximum Typing Delay for AutoComplete

Some of my users are slow typists. Is there a way to adjust the maximum delay between key strokes before the combobox assumes you are starting a new word?

In other words, if the following items are bound to the combo box:

12345
12346
12347
4111

And the user starts typing 1234, if they pause long enough between the 3 and the 4, the selection will go to the 4111 item. I want to be able to edit the amount of time they are allowed to take between key strokes before it it assumes they're starting a new search.
Thanks.

Aaron

ComboBox

answered on 09 Nov 2012

2 answers

230 views

The header of GridViewColumnGroup doesn't gets refreshed when set programatically.

Hi Telerik Team,

I have added a GridViewColumnGroup to a WPF RadGridView (version 2011.3.1220.40).

<Telerik:RadGridView.ColumnGroups>

<Telerik:GridViewColumnGroup Name="gvGroup" Header="Header"></Telerik:GridViewColumnGroup>

</Telerik:RadGridView.ColumnGroups>

The header text is dynamic in my case. The gridview data gets refreshed on click of an hyperlinkcolumn of the same grid, so the header text of the GridViewColumnGroup also needs to refreshed. I tried changing the header text programmatically as given below.

The data in the gridview gets refreshed but the header text of the GridViewColumnGroup is not getting refreshed consistently.
Sometimes it does gets refreshed where as sometimes it doesn't .

foreach (GridViewColumnGroup item in radgvPrerequisiteRelType.ColumnGroups)

{

if (item.Name == "gvGroup")

{

item.Header = null;

item.Header = "ProjectId [" + lngProjectId + "]";

}

Could you please let me know the solution for this problem.

Thanks,
Regards,
Mausami

GridView

answered on 09 Nov 2012

1 answer

292 views

Hide TileViewItem Header

Dear Team,
I have a RadTileView which bind to list. Problem is that i dont want any header (area, text, togglebutton). Please guide me through sample application. In attached image my problem may be more clear. on Left side i have a tile view (items source not bind) have individual tileviewitems. I got my desired result. How i will get such result if i bind items source to some collection. Here in example i only set contentTemplate. Can you tell me difference between content template and itemstemplate???
Here is my code for your reference

<DataTemplate x:Key="ContentTemplate">

<Grid Width="{Binding RestoredWidth}" Height="{Binding RestoredHeight}">

<telerik:RadTileViewItem Background="#1a9fe0"

Content="{Binding Content}"

MinimizedHeight="125"

RestoredHeight="{Binding RestoredHeight}"

RestoredWidth="{Binding RestoredWidth}"

Style="{DynamicResource RadTileViewItemStyle}" />

</Grid>

</DataTemplate>

//Where RadTileViewItemStyle is Same Style I used in First RadTileView

<telerik:RadTileView Name="RadTileView1" Width="1000" Grid.Row="1" Grid.Column="1" MaximizeMode="Zero" Margin="20 0 0 0" Height="400"

ColumnsCount="4"

RowHeight="Auto"

ColumnWidth="Auto"

DragMode="Swap"

MinimizedColumnWidth="100"

MinimizedRowHeight="Auto"

HorizontalContentAlignment="Stretch"

PreservePositionWhenMaximized="True"

telerik:TileViewPanel.IsColumnsShrinkEnabled="True"

telerik:TileViewPanel.IsSizeBoundToPosition="True"

ContentTemplate="{StaticResource ContentTemplate}"

>

</telerik:RadTileView>

public List<TileView> Collection = new List<TileView>();

///////////////////////////////////////////////////////////////////////////

Collection.Add(new TileView() { Content = "Item8", RestoredHeight = 100, RestoredWidth = 245 });

Collection.Add(new TileView() { Content = "Item9", RestoredHeight = 100, RestoredWidth = 245 });

Collection.Add(new TileView() { Content = "Item10", RestoredHeight = 100, RestoredWidth = 245 });

Collection.Add(new TileView() { Content = "Item11", RestoredHeight = 100, RestoredWidth = 245 });

Collection.Add(new TileView() { Content = "Item12", RestoredHeight = 100, RestoredWidth = 245 });

Collection.Add(new TileView() { Content = "Item13", RestoredHeight = 100, RestoredWidth = 122 });

Collection.Add(new TileView() { Content = "Item14", RestoredHeight = 100, RestoredWidth = 122 });

Collection.Add(new TileView() { Content = "Item15", RestoredHeight = 100, RestoredWidth = 245 });

Collection.Add(new TileView() { Content = "Item16", RestoredHeight = 100, RestoredWidth = 245 });

RadTileView1.ItemsSource = Collection;

TileView

answered on 09 Nov 2012

6 answers

340 views

[Solved] AutoFit to fill whole space of the host window

Hello,
I have a diagram. When I call AutoFit() method it does not fill all the space available of the host window.I have to zoom in (manually) a bit to get a better fit. How do I achive AutoFit functionality that makes diagram as large as possible filling all visible space of the host window? Some function like ZoomToFit()?
I attach two images of what I get by default and what I would like to get.

Diagram

answered on 08 Nov 2012

1 answer

182 views

Self-Referencing Binding

Hi,

I have got model:

public class Category

{

public int Id { get; set; }

public string Name { get; set; }

public int? ParentCategoryId { get; set; }

public virtual Category ParentCategory { get; set; }

public virtual ICollection<Category> SubCategories { get; set; }

}

And in MVVM:

private ObservableCollection<Category> _categories;

public ObservableCollection<Category> Categories

{

get { return _categories; }

set

{

if (_categories == value) return;

_categories = value;

OnPropertyChanged("Categories");

}

I found an example, but I don't want to create a new model, and even more so to edit an existing one.
Could you explain to me step-by-step, how I can bind the data to treeview (with parents and their childs')?

TreeView

answered on 08 Nov 2012

1 answer

141 views

Nested RadDataForm

Hello
I tried insert one RadDataForm into another and I accomplished this, but nested form acts like parent e.g. I start edit parent form and child form is automatically being edited too. Can thay work independently? How can I achieve this ?

DataForm

answered on 08 Nov 2012

1 answer

240 views

How to use CellStyleSelector in MVVM?

I've followed your help sample and created a custom style selector like this:-

public class BlockTypeStyleSelector : StyleSelector

{

public override Style SelectStyle(object item, DependencyObject container)

{

if (item is SampleRun)

{

var sampleRun = item as SampleRun;

switch (sampleRun.BlockType)

{

case BlockType.NormalBlock:

return NormalBlockStyle;

case BlockType.CalibrationBlock:

return CalibrationBlockStyle;

}

return null;

}

public Style NormalBlockStyle { get; set; }

public Style CalibrationBlockStyle { get; set; }

}

I have also created the necessary styles in my view XAML:-

<GridStyleSelectors:BlockTypeStyleSelector x:Key="blockTypeStyle">

<GridStyleSelectors:BlockTypeStyleSelector.NormalBlockStyle>

<Style TargetType="telerik:GridViewCell">

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

</Style>

</GridStyleSelectors:BlockTypeStyleSelector.NormalBlockStyle>

<GridStyleSelectors:BlockTypeStyleSelector.CalibrationBlockStyle>

<Style TargetType="telerik:GridViewCell">

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

</Style>

</GridStyleSelectors:BlockTypeStyleSelector.CalibrationBlockStyle>

</GridStyleSelectors:BlockTypeStyleSelector>

The problem is, I'm programmatically creating the RadGridView columns in my view model. I can't simply assign an instance of my custom style selector to the column's CellStyleSelector property as there is nothing linking that instance to the styles in the XAML. Am I going about this the wrong way?

GridView

answered on 08 Nov 2012

1 answer

178 views

Row Colors and Style

Hello,

how do i set own row style colors (not only alternating colors). Are there events or dependency properties to bind colors to data model?

I have a pivot grid and want to set background colors in some rows.

Regards,
AM

PivotGrid

answered on 08 Nov 2012

10 answers

1.2K+ views

Weird spacing between columns

I'm having an issue with mysterious spacing showing up between my columns. In the attached picture you can see it between the first two columns. I'm not sure if this is being caused my header row/column styling or cell styling. It looks like even when there are no rows some of the headers seem to have different spacing between them. Any ideas what might cause this?

Here are the styles I'm using.

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

<Setter Property="Background" Value="{StaticResource GridBackgroundBrush}" />

<Setter Property="GridLinesVisibility" Value="None" />

</Style>

<Style TargetType="{x:Type telerik:GridViewHeaderRow}">

<Setter Property="Template">

<Setter.Value>

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

<SelectiveScrollingGrid>

<SelectiveScrollingGrid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="*"/>

</SelectiveScrollingGrid.ColumnDefinitions>

<Border x:Name="PART_GridViewHeaderRowBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"

Grid.ColumnSpan="4" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">

<Border Background="{TemplateBinding Background}"/>

</Border>

<telerik:DataCellsPresenter x:Name="PART_DataCellsPresenter" Grid.Column="3" IsTabStop="False" />

<Border x:Name="PART_IndicatorPresenter" BorderThickness="0" SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" Visibility="Collapsed">

<Border Background="{StaticResource ResourceKey=GridBackgroundBrush}"/>

</Border>

<telerik:IndentPresenter x:Name="PART_IndentPresenter" Grid.Column="1" IsTabStop="False" IndentLevel="{TemplateBinding IndentLevel}" MinHeight="{TemplateBinding MinHeight}"

SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical">

<telerik:IndentPresenter.ItemTemplate>

<DataTemplate>

<telerik:GridViewHeaderIndentCell IsTabStop="False" />

</DataTemplate>

</telerik:IndentPresenter.ItemTemplate>

</telerik:IndentPresenter>

<Border x:Name="PART_HierarchyIndentPresenter" BorderThickness="1" Grid.Column="2" SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" Width="25">

<Border.Visibility>

<Binding Path="HasHierarchy" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<BooleanToVisibilityConverter/>

</Binding.Converter>

</Binding>

</Border.Visibility>

</Border>

</SelectiveScrollingGrid>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="Background" Value="{DynamicResource GridBackgroundBrush}"/>

<Setter Property="MinHeight" Value="27"/>

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

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

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

<Setter Property="Padding" Value="0"/>

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

</Style>

<Style x:Key="BaseTelerikCell" TargetType="{x:Type telerik:GridViewCell}">

<Setter Property="Template">

<Setter.Value>

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

<Grid Background="{TemplateBinding Background}">

<Border VerticalAlignment="Stretch" BorderThickness="{StaticResource GridGapThickness}"

BorderBrush="{StaticResource GridBackgroundBrush}">

<ContentPresenter x:Name="CellContentPresenter" VerticalAlignment="Center"/>

</Border>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

<Style.Triggers>

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

<Setter Property="Background">

<Setter.Value>

<SolidColorBrush Color="{DynamicResource {x:Static SystemColors.WindowColorKey}}"/>

</Setter.Value>

</Setter>

<Setter Property="Foreground">

<Setter.Value>

<SolidColorBrush Color="{DynamicResource {x:Static SystemColors.WindowTextColorKey}}"/>

</Setter.Value>

</Setter>

</Trigger>

</Style.Triggers>

</Style>

<Thickness x:Key="GridGapThickness" Bottom="1" Top="1" Right="1.5" Left="1.5" />

<ControlTemplate x:Key="GridViewHeaderCellControlTemplate1" TargetType="{x:Type telerik:GridViewHeaderCell}">

<Grid x:Name="PART_HeaderCellGrid">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="*"/>

<ColumnDefinition Width="Auto"/>

</Grid.ColumnDefinitions>

<Border x:Name="GridViewHeaderCell" BorderBrush="{x:Null}" Grid.ColumnSpan="2">

<Border BorderBrush="{StaticResource GridBackgroundBrush}" Background="LightGray" BorderThickness="{StaticResource GridGapThickness}"/>

</Border>

<Border x:Name="GridViewHeaderCell_Over" BorderBrush="LightGray" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" Opacity="0" />

<Border x:Name="GridViewHeaderCell_Selected" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" Opacity="0">

</Border>

<ContentControl x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}"

Grid.Column="0" Foreground="LightGray" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

IsTabStop="{TemplateBinding IsTabStop}" Margin="{TemplateBinding Padding}"

VerticalAlignment="{TemplateBinding VerticalContentAlignment}">

<ContentControl.Style>

<Style TargetType="{x:Type ContentControl}">

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

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

</Style>

</ContentControl.Style>

</ContentControl>

<Path x:Name="PART_SortIndicator" Grid.ColumnSpan="2" Data="M0,0L1,0 2,0 3,0 4,0 5,0 5,1 4,1 4,2 3,2 3,3 2,3 2,2 1,2 1,1 0,1 0,0z"

Fill="Black" HorizontalAlignment="Center" Height="3" Margin="0,3,0,0" Opacity="0" RenderTransformOrigin="0.5,0.5"

Stretch="Fill" VerticalAlignment="Top" Width="5">

<Path.RenderTransform>

<TransformGroup>

<ScaleTransform ScaleY="-1" ScaleX="1"/>

<SkewTransform AngleY="0" AngleX="0"/>

<RotateTransform Angle="0"/>

<TranslateTransform X="0" Y="0"/>

</TransformGroup>

</Path.RenderTransform>

</Path>

<telerik:FilteringDropDown x:Name="PART_DistinctFilterControl" Grid.Column="1" IsTabStop="False"

Margin="0,0,8,0" Visibility="{TemplateBinding FilteringUIVisibility}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:FilteringDropDown>

<Thumb x:Name="PART_LeftHeaderGripper" Grid.ColumnSpan="2" HorizontalAlignment="Left" IsTabStop="{TemplateBinding IsTabStop}">

<Thumb.Style>

<Style TargetType="{x:Type Thumb}">

<Setter Property="Width" Value="8"/>

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

<Setter Property="BorderBrush" Value="Transparent"/>

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

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

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

<Setter Property="Padding" Value="0"/>

<Setter Property="Cursor" Value="SizeWE"/>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type Thumb}">

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"

Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

Padding="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</Thumb.Style>

</Thumb>

<Thumb x:Name="PART_RightHeaderGripper" Grid.ColumnSpan="2" HorizontalAlignment="Right" IsTabStop="{TemplateBinding IsTabStop}">

<Thumb.Style>

<Style TargetType="{x:Type Thumb}">

<Setter Property="Width" Value="8"/>

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

<Setter Property="BorderBrush" Value="Transparent"/>

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

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

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

<Setter Property="Padding" Value="0"/>

<Setter Property="Cursor" Value="SizeWE"/>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type Thumb}">

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"

Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

Padding="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</Thumb.Style>

</Thumb>

</Grid>

<ControlTemplate.Triggers>

<Trigger Property="SortingState" Value="Ascending">

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

<Setter Property="Opacity" TargetName="PART_SortIndicator" Value="1"/>

<Setter Property="LayoutTransform" TargetName="PART_SortIndicator">

<Setter.Value>

<ScaleTransform ScaleY="1" ScaleX="1"/>

</Setter.Value>

</Setter>

<Setter Property="Opacity" TargetName="GridViewHeaderCell_Selected" Value="1"/>

</Trigger>

<Trigger Property="SortingState" Value="Descending">

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

<Setter Property="Opacity" TargetName="PART_SortIndicator" Value="1"/>

<Setter Property="LayoutTransform" TargetName="PART_SortIndicator">

<Setter.Value>

<ScaleTransform ScaleY="-1" ScaleX="1"/>

</Setter.Value>

</Setter>

<Setter Property="Opacity" TargetName="GridViewHeaderCell_Selected" Value="1"/>

</Trigger>

<Trigger Property="SortingState" Value="None">

<Setter Property="Opacity" TargetName="PART_SortIndicator" Value="0"/>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

<Style x:Key="DefaultHeaderColumnStyle" TargetType="telerik:GridViewHeaderCell">

<Setter Property="Template" Value="{StaticResource GridViewHeaderCellControlTemplate1}"/>

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

<Setter Property="Background" Value="{x:Null}"/>

<Setter Property="BorderBrush" Value="{x:Null}"/>

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

</Style>

GridView

answered on 08 Nov 2012