Questions on UI for WPF Forum

12 answers

1.0K+ views

How to add dynamic RadCartesianChart.Series into my ChartView

This is my chart view:

<telerik:RadCartesianChart x:Name="bpsChart" Margin="20,92,31,474">

<telerik:RadCartesianChart.Grid>

<telerik:CartesianChartGrid MajorXLineDashArray="5, 5" MajorYLineDashArray="5, 5" MajorLinesVisibility="None">

<telerik:CartesianChartGrid.MajorYLineStyle>

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

<Setter Property="Stroke" Value="Gray"/>

</Style>

</telerik:CartesianChartGrid.MajorYLineStyle>

<telerik:CartesianChartGrid.MajorXLineStyle>

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

<Setter Property="Stroke" Value="Gray"/>

</Style>

</telerik:CartesianChartGrid.MajorXLineStyle>

</telerik:CartesianChartGrid>

</telerik:RadCartesianChart.Grid>

<telerik:RadCartesianChart.HorizontalAxis>

<telerik:CategoricalAxis ShowLabels="False" IsEnabled="False" TickThickness="0" LineThickness="0" >

</telerik:CategoricalAxis>

</telerik:RadCartesianChart.HorizontalAxis>

<telerik:RadCartesianChart.VerticalAxis >

<telerik:LinearAxis ShowLabels="False" IsEnabled="False" TickThickness="0" LineThickness="0" />

</telerik:RadCartesianChart.VerticalAxis>

<telerik:RadCartesianChart.Series>

<telerik:LineSeries CategoryBinding="Date" ValueBinding="Value" Stroke="LightSeaGreen"

ItemsSource="{Binding MyData, RelativeSource={RelativeSource AncestorType=Window}}"/>

</telerik:RadCartesianChart.Series>

</telerik:RadCartesianChart>

As you can see i am populate this with MyData which is my object the contains only only variable: double.

Now i have a list of several MyData objects and i want to create from each on them a stroke line on my ChartView.

What is the best option to do that ? (XAML or code behind)

I will glad for code example.

ChartView

answered on 15 Jul 2015

1 answer

64 views

Sort result is wrong when use the default sort

when click column header for sorting use the build in sort function the result is wrong. May I know the reason?

GridView

answered on 15 Jul 2015

5 answers

456 views

[Solved] How to remove the red border and button on RadMaskedInput

By default on mouseover RadMaskedInput shows red border and red circle button (see attachment), is there a way to remove it.

MaskedInput (Numeric, DateTime, Text, Currency)

answered on 15 Jul 2015

1 answer

207 views

Icon Chooser data field in RadDataForm

Hey,

Still kinda new to Telerik and WPF...

How would I go about creating an Icon Chooser data field - it would contain the chosen (or existing) icon, a text field with a path to the icon/png file and a button which would open an OpenFileDialog to allow the selection of an Icon file. This file path would then be copied to the text box which is bound to the Icon property in the ViewModel.

Thanks.

BW

DataForm

answered on 15 Jul 2015

3 answers

154 views

Inconsistent and Odd Tile Content Behaviour

I've recently added a new tile to my main tiles in the app. This tile takes a twitter feed and displays a list of the tweets. I've had to extract the links out to a separate property, which I then bind to a Hyperlink. To keep the latest tweets on the top I use a ViewSource which is a resource on the user control the TileList is part of.

The odd behaviour is that the links aren't always clickable. If I take the RadListBox out of the tile and into a grid in another part of the page it works perfectly all the time. I've deployed the app to a couple of test machines and on one of those the links are always clickable on the tile until you change the theme, then they break. On my local dev box, the clickability of the links is inconsistent. I can fire the app up in VS2013 10 times and out of that maybe 3 times it will work.

I've put together a quick video showing the issue: Tile Issues Video

The code for the tile is below. In the Grid, that works, the exact same RadTileList piece of code is used.

<tel:Tile x:Name="tileTweetFeed"

Background="#FF386DDA"

TileType="Quadruple"

Opacity="1"

IsEnabled="True"

Foreground="White"

AllowDrop="False" Focusable="False">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="Auto"/>

<RowDefinition Height="*"/>

</Grid.RowDefinitions>

<TextBlock Text="vrHive Twitter Feed"

FontFamily="/vrHive;component/Fonts/#Zero Threes"

FontSize="11" />

<Border Visibility="Visible" Grid.Row="1"

BorderThickness="1"

Margin="5"

BorderBrush="White"

Background="#FF386DDA" >

<Grid >

<Grid.RowDefinitions>

<RowDefinition Height="*"/>

</Grid.RowDefinitions>

<tel:RadListBox x:Name="listTweetFeed" ItemsSource="{Binding Source={StaticResource ItemListViewSource}}" Background="{x:Null}" >

<tel:RadListBox.ItemTemplate>

<DataTemplate >

<Grid Margin="0">

<Grid.RowDefinitions>

<RowDefinition />

<RowDefinition/>

</Grid.RowDefinitions>

<TextBlock FontWeight="Bold"

Text="{Binding twitterMessage.CreatedDate}"

FontSize="13"/>

<TextBlock Grid.Row="1"

Text="{Binding twitterMessage_NoLink}"

Margin="10,5,0,0"

TextWrapping="Wrap"

Width="245"

HorizontalAlignment="Left" />

<Grid Grid.Row="2" Margin="10,2,0,0" Visibility="{Binding twitterMessage_Link, Converter={local:EmptyStringToVisibilityConverter}}">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="45"/>

<ColumnDefinition/>

</Grid.ColumnDefinitions>

<StackPanel Grid.Column="0"

Orientation="Vertical"

HorizontalAlignment="Left"

VerticalAlignment="Top"

Margin="0,6,0,0">

<TextBlock Grid.Column="0" Text="Link(s): " />

</StackPanel>

<tel:RadListBox Grid.Column="1"

ItemsSource="{Binding twitterMessage_Link}"

Background="{x:Null}"

BorderBrush="{x:Null}"

VerticalAlignment="Top"

VerticalContentAlignment="Top"

BorderThickness="0" >

<tel:RadListBox.ItemsPanel>

<ItemsPanelTemplate>

<StackPanel Orientation="Vertical"

HorizontalAlignment="Left"

VerticalAlignment="Top"/>

</ItemsPanelTemplate>

</tel:RadListBox.ItemsPanel>

<tel:RadListBox.ItemTemplate>

<DataTemplate>

<TextBlock>

<Hyperlink NavigateUri="{Binding}"

RequestNavigate="Hyperlink_RequestNavigate"

Cursor="Hand">

<TextBlock Text="{Binding}"

Foreground="Black"

FontWeight="Bold"

HorizontalAlignment="Left"

Focusable="True"/>

</Hyperlink>

</TextBlock>

</DataTemplate>

</tel:RadListBox.ItemTemplate>

</tel:RadListBox>

</Grid>

</DataTemplate>

</tel:RadListBox.ItemTemplate>

</tel:RadListBox>

</Grid>

</Border>

</Grid>

</tel:Tile>

I've tried changing the parent container for the RadTileList and that makes no difference. I've also tried dropping the RadTileList and using a standard ListBox and ListView, but neither of those works.

Is there a way I can get around this odd behaviour?

TileList

answered on 14 Jul 2015

2 answers

366 views

[Solved] RadPanes lose their DataTemplate when it moves from being docked to floating

The DataTemple of my RadPane are lost when the RadPane goes from being docked to floating. I am using the RadDocking control with MVVM thus I am using the DockingPaneFactory class. So far I have the following XAML in my MainWindow.xaml file.

<Window … >

<Window.Resources>

<DataTemplate DataType=“{x:Type ViewModelA}”>

<TextBlock Text=”ViewModelA” />

</DataTemplate>

<DataTemplate DataType=“{x:Type ViewModelB}”>

<TextBlock Text=”ViewModelB” />

</DataTemplate>

</Window.Resources>

</Window>

The XAML above defines two DataTemplates for my two View Models called ViewModelA and ViewModelB. Next I have my RadDocking XAML that defines three RadSplitContainers and the DockingPanesFactory.

<telerik:RadDocking PanesSource=”{Binding Panes}”>

<telerik:RadSplitContainer InitialPosition=”DockedLeft”>

<telerik:RadPaneGroup x:Name=”LeftPaneGroup” />

</telerik:RadSplitContainer>

<telerik:RadSplitContainer InitialPosition=”DockedRight”>

<telerik:RadPaneGroup x:Name=”RightPaneGroup” />

</telerik:RadSplitContainer>

<telerik:RadSplitContainer InitialPosition=”DockedBottom”>

<telerik:RadPaneGroup x:Name=”BottomPaneGroup” />

</telerik:RadSplitContainer>

<telerik:RadDocking.DockingPanesFactory>

<local:MyDockingPanesFactory />

</telerik:RadDocking.DockingPanesFactory>

</telerik:RadDocking>

Now I have my DockingPanesFactoryClass.

public class MyDockingPanesFactory : DockingPanesFactory {

protected override void AddPane(…) {

. . . .

}

protected override RadPane CreatePaneForItem(object item) {

if (item is DockPaneViewModel) {

return new RadPane() {

Header = ((DockPaneViewModel)item).Header,

Tag = ((DockPaneViewModel)item).InitialLocation,

DataContext = item,

Content = item

};

} else {

throw new ArgumentException(“Invalid Type”);

}

The above code sets the Header, Tag, DataContext, and Context of the new RadPane based on property of the ViewModel which inherits from a specific DockPaneViewModel. The key here is that the Content of the RadPane is set to the ViewModel so that the DataTemplate defined in the MainWindow.xaml can be discovered using its DataType.

Lastly, in my MainWindowViewModel (which is the DataContext for the MainWindow.xaml), I define the Panes collection for the binding of the PaneSource property in the RadDocking control.

public class MainWindowViewModel : ViewModelBase {

public ObservableCollection<DockPaneViewModel> Panes { get; set; }

public MainWindowViewModel() {

Panes = new ObservableCollection<DockPaneViewModel>() {

new ViewModelA(),

new ViewModelB()

};

}

When this application is run everything looks as expected and the RadPanes are docked in the correct location. In one of the RadPanes I see the text “ViewModelA” and in the other I see “ViewModelB” so I know the DataTemples are being applied. Now when I pull one of the RadPanes off and make it floating its DataContext seems to be lost and it simply shows the class name in the RadPane. Docking the RadPane back into the RadDocking control does not restore its DataTemplate.

Why do the DataTemples of my RadPanes seem to get removed when I move the RadPane from being docked to being floating?

Docking

answered on 14 Jul 2015

1 answer

140 views

Manual transition control idea

I'm not sure if this is feasible, but I have a feature to propose.

The transition control is nice, but because it is triggered strictly by content changes, it is limited to pretty specific scenarios. I suspect the transition code could work in many more scenarios, it if just knew when to trigger. So this is my proposal: add a BeginUpdate function that would freeze a copy of the content, and an EndUpdate function that would then transition from the frozen copy to the current content. In between the BeginUpdate and EndUpdate, one could make as many changes as needed to the content, without having to actually replace the content. Is this feasible?

TransitionControl

answered on 14 Jul 2015

5 answers

301 views

RadTreeView selection

Hi,

I have a RadTreeView with checkboxes(Implemented using MVVM as suggested by Telerik). To work with Keyboard events(checkbox should be checked when we enter a space), We implemented KeyDown event and is working fine.

Now if I select an item and enter space it gets checked, if I click on tab the next item gets focus but still the first item is in selected mode. Is there any way to get unselected, when we tab out . Please provide your inputs.

Thanks,

Subhashini

TreeView

answered on 14 Jul 2015

1 answer

177 views

QueryableEntityCollectionView over multiple entities?

I want to use QueryableEntityCollectionView as the datasource for a GridView. However, I want to show columns from several different tables in this Grid and have them all be filterable/sortable. I realize I could create a view in my database and and entity to map that view but I want to avoid that if at all possible.

for example:

public class USER

{

public int UserID {get;set;}

public String UserName {get;set;}

public int JobCode {get;set;}

}

public class JOB

{

public int JobCode {get;set;}

public String JobDescription {get;set;}

};