Questions on UI for WPF Forum

1 answer

159 views

Setting colours of 3d pie chart items in code-behind

I have just started working with Telerik controls having moved from Infragistics controls.

I have created a 3D pie chart in code-behind whose data is gathered from a database.

The legend items for the chart are also gathered from the database (both the title of each item and its colour is stored in the database as these colours are customisable by the user for each category).

I have managed to set the legend item colours correctly but now I need to set the colours of each 'slice' of the pie chart to match the legend.

I have followed the example on setting custom item styles at http://www.telerik.com/help/wpf/radchart-styling-and-appearance-custom-item-style.html but when I set a breakpoint on the BuildCustomItemStyles method it is only ever trying to style the legend items.

Here is my cod behind (including the BuildCustomItemStyles code).

/// <summary>

/// Interaction logic for AbsenceByReasonChart.xaml

/// </summary>

public partial class AbsenceByReasonChart : UserControl, IWpfChart

{

private List<OptionPropertiesData> optionPropertiesSet;

/// <summary>

/// Default constructor.

/// </summary>

public AbsenceByReasonChart()

{

InitializeComponent();

radChart1.

Loaded += new RoutedEventHandler(AbsenceByReasonChart_Loaded);

}

private void AbsenceByReasonChart_Loaded(object sender, RoutedEventArgs e)

{

WpfZoomUtils.ZoomChartArea(radChart1.DefaultView.ChartArea, Constants.WpfChartZoomFactor);

}

private Style BuildCustomItemStyle(Control item, Style style, DataPoint point, DataSeries dataSeries)

{

if ((item as BaseChartItem3D<Pie3D>) == null) return style;

Style newStyle = new Style();

newStyle.BasedOn = style;

newStyle.TargetType = typeof(Shape);

// this code gets the brush colour

Brush brush = new SolidColorBrush(getOptionColour(...));

newStyle.Setters.Add(new Setter(Shape.FillProperty, brush));

return newStyle;

}

public void SetChartTitle(DateTime startDate, DateTime endDate)

{

if (startDate == DateTime.MinValue || startDate == null) return;

radChart1.DefaultView.ChartTitle.Content = string.Format("Absence by Reason {0} to {1}", startDate.ToShortDateString(), endDate.ToShortDateString());

radChart1.DefaultView.ChartTitle.HorizontalAlignment = HorizontalAlignment.Center;

}

public void PopulateChart(DataTable data, DateTime startDate, DateTime endDate, List<OptionPropertiesData> optionPropertiesList)

{

if (data == null || data.Rows.Count == 0 || optionPropertiesList == null || optionPropertiesList.Count == 0) return;

optionPropertiesSet = optionPropertiesList;

if (radChart1.DefaultView.ChartArea.DataSeries != null && radChart1.DefaultView.ChartArea.DataSeries.Count > 0)

{

// remove existing data series

radChart1.DefaultView.ChartArea.DataSeries.Clear();

}

// define series data type

DataSeries series = new DataSeries()

{

Definition = new Pie3DSeriesDefinition(),

LegendLabel = "Attendance Type"

};

// turn on item tooltips and set the item format of the tooltip for each series item

ISeries3DDefinition chartDefintion = series.Definition as Pie3DSeriesDefinition;

if (chartDefintion != null)

{

chartDefintion.ShowItemToolTips = true;

chartDefintion.ItemToolTipFormat = "#LEGENDLABEL: #Y Employees";

chartDefintion.ItemLabelFormat = "#%{p0}";

}

// for the absence by reason chart, the legend colours must match the colours defined for each atendance type

// in the attendance maintenance section

// first, turn OFF the automatic generation of the legend for the chart

radChart1.DefaultView.ChartLegend.UseAutoGeneratedItems = false;

// whilst the chart is being populated, set the legend item appropriately

foreach (DataRow r in data.Rows)

{

if (r == null || r.ItemArray == null || r.ItemArray.Length == 0) continue;

// the item array of each data row has the following information:

// first item is the absence reason

// second item is the number of employees off due to this reason

// third item is the id of the data option for the absence reason

if (r.ItemArray[1] is int && r.ItemArray[0] is string && r.ItemArray[2] is long)

{

// ignore categories that have no value or rows where the absence reason data option id cannot be found

if (Convert.ToInt32(r.ItemArray[1]) <= 0 || Convert.ToInt64(r.ItemArray[2]) <= 0) continue;

// set the data for this category

series.Add(new DataPoint

{

XValue = Convert.ToInt64(r.ItemArray[2]),

YValue = Convert.ToInt32(r.ItemArray[1]),

});

// now define its legend item

ChartLegendItem legendItem = new ChartLegendItem()

{

Background = new SolidColorBrush(getOptionColour(Convert.ToInt64(r.ItemArray[2]), optionPropertiesList)),

Label = Convert.ToString(r.ItemArray[0])

};

radChart1.DefaultView.ChartLegend.Items.Add(legendItem);

}

SetChartTitle(startDate, endDate);

// finally, assign the chart the defined data series

radChart1.DefaultView.ChartArea.DataSeries.Add(series);

}

private System.Windows.Media.Color getOptionColour(long optionID, List<OptionPropertiesData> optionPropertiesList)

{

// find the option properties object for the option with the passed in option id

// and return its associated colour

OptionPropertiesData optionProperty = optionPropertiesList.Find(delegate(OptionPropertiesData opData) { return opData.getDataOptionID() == optionID; });

if (optionProperty != null)

{

System.Drawing.Color winFormColour = System.Drawing.Color.FromArgb(optionProperty.getPlannerColour());

if (winFormColour != null)

{

return new System.Windows.Media.Color()

{

A = winFormColour.A,

R = winFormColour.R,

G = winFormColour.G,

B = winFormColour.G

};

}

return new Color();

}

public RadChart GetChartInstance()

{

return radChart1;

}

Chart

answered on 02 Dec 2010

2 answers

144 views

OutlookBar Style

Hi,

How do i have a custom style template for the OutlookBar?

Thanx
Maqsood

OutlookBar

answered on 02 Dec 2010

7 answers

496 views

Hiding a line series

I am trying to show/hide series in a line chart. I am trying to use the Visibility property of the class LineSeriesDefinition . However it is not working and the concerned series remains visible. Please help.

The code is as follows:

SeriesMapping Mapping = new SeriesMapping();

Mapping .CollectionIndex = 0;

LineSeriesDefinition lineDefinition = new LineSeriesDefinition();

lineDefinition.Visibility =

SeriesVisibility.Collapsed; // I tried with 'Hidden' as well

lineDefinition.ShowItemLabels =

false;

lineDefinition.ShowPointMarks =

false;

lineDefinition.Appearance.Stroke =

Brushes.LightSalmon;

lineDefinition.Appearance.StrokeThickness = 1.0;

Mapping .SeriesDefinition = lineDefinition;

Mapping .ItemMappings.Add(

new ItemMapping("X Label", DataPointMember.XValue));

ItemMapping yItemMapping = new ItemMapping("Y Label", DataPointMember.YValue);

yItemMapping.SamplingFunction =

ChartSamplingFunction.Average;

Mapping.ItemMappings.Add(yItemMapping);

LineChart.SeriesMappings.Add(Mapping );

Chart

answered on 02 Dec 2010

2 answers

219 views

Binding Directly to SortDescriptors

Hi,

Is it possible to bind a SortDescriptiorCollection directly to the xaml?

i.e

<telerikGrid:RadGridView.SortDescriptors ItemSource="{Binding SortDescriptors}" />

NOTE: Sorry I meant his to be in the Silverlight section for GridVIew
Sara :)

<telerikGrid:RadGridView.SortDescriptors ItemSource="{Binding SortDescriptors}">

GridView

answered on 01 Dec 2010

3 answers

639 views

How to undo changes after RowEditEnded?

I am handling the RowEditEnded event of my RadGridView to save the changes to the database through a service. But if I get an error from the middle tier, I want to roll back those changes to the row.

At the time RowEditEnded is raised, it is too late to call CancelEdit(), so I thought that using the OldValues property of GridViewRowEditEndedEventArgs would be the best way to go, and apply them to each cell in the row. The problem is that OldValues is a dictionary and GridViewCellBase can only be indexed by position. I could find each cell binding and find the item in OldValues that matches it, but it seems to me that there should be a better way.

Is there an easy way to do this?

GridView

answered on 01 Dec 2010

1 answer

173 views

Auto Date Format in Date Picker

Hi ,

I am Ramesh , I am using Telerik controls and Grid in our application . we are using Telerik 2010 Q3 release dll

My Requirement is

Typing "010110" should translate to 01/01/2010 automatically

Let me know if there is any property available in Date picker control which satisfies this functionality

Thanks in Advance

Regards
Ramesh

DatePicker

answered on 01 Dec 2010

1 answer

133 views

Spline Chart

1. How can I create a Spline chart like in WPF Chart example with custom Values(it will help me to understand the structure)?

I tried

List<double[]> itemsSource = new List<double[]>();

itemsSource.Add(SeriesExtensions.GetUserData(12, 0));

itemsSource.Add(SeriesExtensions.GetUserData(12, 1));

but "SeriesExtensions" gives me an error.

2. Is it possible to Align the Y-Axis label?..by default it's center align.
Thanks

Chart

answered on 01 Dec 2010

2 answers

94 views

Can not find ressource "SyncToBoxTemplate"

Hi there,

in relation to your online demo I have built a grid with syncronisation between a TextBox an the GridCells. It works fine and I decided to add theese grid to a greater application.
In this application I can't get it to work. I just get an error the ressource "SyncToBoxTemplate" will not be found.
What does I've done wrong? I have copied the code 1:1

<Window x:Class="ICConfPrototyp.Entscheidungstabelle"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="MainWindow" Height="396" Width="525" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">

<Window.Resources>

<DataTemplate x:Key="SyncToBoxTemplate">

<TextBox Loaded="TextBox_Loaded" />

</DataTemplate>

</Window.Resources>

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="25" />

<RowDefinition Height="*" />

<RowDefinition Height="30" />

</Grid.RowDefinitions>

<TextBox Grid.Row="0" Height="25" VerticalAlignment="Center" Name="txtValue" IsEnabled="True" />

<telerik:RadGridView telerik:StyleManager.Theme="Windows7" HorizontalAlignment="Stretch" Name="rgvEntscheidungstabelle" VerticalAlignment="Stretch" ShowGroupPanel="False" CanUserReorderColumns="False" CanUserSortColumns="False" IsManipulationEnabled="True" Loaded="rgvEntscheidungstabelle_Loaded" RowLoaded="rgvEntscheidungstabelle_RowLoaded" IsFilteringAllowed="False" Grid.Row="1" SelectionUnit="Cell" SelectionMode="Extended" SelectedCellsChanged="grdView_SelectedCellsChanged" PreviewMouseLeftButtonDown="grdView_PreviewMouseLeftButtonDown" MouseLeftButtonDown="grdView_MouseLeftButtonDown" AutoGenerateColumns="False" GroupHeaderTemplate="{StaticResource SyncToBoxTemplate}">

<telerik:RadGridView.LayoutTransform>

<ScaleTransform ScaleX="{Binding Path=Value, ElementName=zoomSlider}"

ScaleY="{Binding Path=Value, ElementName=zoomSlider}"/>

</telerik:RadGridView.LayoutTransform>

</telerik:RadGridView>

<TextBox Grid.Row="2" Height="23" HorizontalAlignment="Left" Margin="256,4,0,0" Name="txtProzent" VerticalAlignment="Top" Width="34" Text="100" HorizontalContentAlignment="Center" TextChanged="txtProzent_TextChanged" />

<Label Content="%" Grid.Row="2" Height="28" HorizontalAlignment="Left" Margin="287,2,0,0" Name="label1" VerticalAlignment="Top" />

<telerik:RadSlider Name="zoomSlider" Minimum="0.001" Maximum="5" Value="1" Grid.Row="2" TickFrequency=".5" TickPlacement="Both" Margin="308,0,0,0" ValueChanged="zoomSlider_ValueChanged" HandlesVisibility="Visible">

<telerik:StyleManager.Theme>

<telerik:Windows7Theme />

</telerik:StyleManager.Theme>

</telerik:RadSlider>

<telerik:RadContextMenu.ContextMenu>

<telerik:RadContextMenu Opened="RadContextMenu_Opened"

ItemClick="RadContextMenu_ItemClick">

<telerik:RadContextMenu.Items>

<telerik:RadMenuItem Header="Zelle kopieren"

Name="contextmenue_copy_cell">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/table_row.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem Header="kopierter Zelleninhalt einfügen"

Name="contextmenue_insert_clipboard_cell">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/table_cell.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem IsSeparator="True" />

<telerik:RadMenuItem Header="Zeile anfügen"

Name="contextmenue_append_line">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/table_row.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem Header="Zeile einfügen"

Name="contextmenue_insert_line">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/table_column_add.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem Header="Zeile kopieren"

Name="contextmenue_copy_line">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/copy.ico"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem Header="Zelle Editieren"

Name="contextmenue_edit_cell">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/EditDocument.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem Header="Zeile löschen"

Name="contextmenue_delete_line">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/delete.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem IsSeparator="True" />

<telerik:RadMenuItem Header="Spalte einfügen"

Name="contextmenue_insert_column">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/table_column_add.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

<telerik:RadMenuItem Header="Spalte löschen"

Name="contextmenue_delete_column">

<telerik:RadMenuItem.Icon>

<Image Source="/ICConfPrototyp;component/Images/table_column_delete.png"

Stretch="UniformToFill" />

</telerik:RadMenuItem.Icon>

</telerik:RadMenuItem>

</telerik:RadContextMenu.Items>

</telerik:RadContextMenu>

</telerik:RadContextMenu.ContextMenu>

</Grid>

</Window>

I don't have any Ideas :(

Greetings
Andi

GridView

answered on 01 Dec 2010

2 answers

115 views

gantt dependency arrow

Hello,
I am trying to implement similar functionality with the dependency arrow in Gantt charts.
Anyone know the best way to do it?

ScheduleView

answered on 01 Dec 2010

4 answers

994 views

WPF RadGridView Scrolling Issues...

Hi,

I'm a licenced user of the WPF controls and have found a few issues during development of an application. Originally i thought these issues were down to my use of some custom columns and the behaviour i need, however, after many a fraught hour testing and re-testing i eventually loaded the WPF Demo (Q2 2010 SP1) and looked at the sample. To my amazment the samples also show the same behaviour!!

Issue 1: The first issue is is to do with editing cells and the scroll bar:
1) Start the GridView Editing sample from the demo's
2) Double click any cell to get the edit box
3) CLICK in the scroll bar on the right somewhere BELOW the handle (don't pick up the handle/bar and drag it as this works fine, it's only when clicking the free area either side of the handle).
4) In the grid there will now be a white cell (it can be in any of the columns not nessesarily the original column, this is more obvious when there is a horizontal scroll-bar)

I have tried many things (including cancelling the edit on scroll, which doesn't work as the event is only fired when the scroll bar is dragged!). I can't turn virtualization off due to memory and performance constraints (though neither seemed to actually fix the issue).

Issue 2: The second issue is with the filter drop down window when the grid is in defered scrolling mode:
1) Create a standard grid on a form, ensure the filters are enabled and there is enough data to generate a sizable vertical scroll bar (i.e data height is at least twice that of the visible area).
2) Start the application with the ScrollMode set to "RealTime" (or the default mode).
    a) Open a filter drop-down for any column that has lots of unique values in it (this is to ensure the filter drop-down has a vertical scroll bar in the list)
    b) Scroll the filter list up and down by dragging the handle. This should work as expected.
    c) Stop the application
3) Change the grid ScrollMode to "deferred" and restart the application
    a) Open the filter drop-down for the same column as last time
    b) Scroll the filter list up and down by dragging the handle.  This now doesn't move the scroll bar in the filter drop-down but DOES scroll the parent grid up and down!!

This is a very strange one.  The up and down arrows at the top and bottom of the scroll bar work as expected (as well as the mouse wheel) however the grab-handle scrolls the parent grid?!

I've been unable to find a work-around for either of these issues (and Google has not been kind either!!). If nessesary i will open a support ticket but all the nessesary steps for replication are above.

I'm using the 2010 Q2 SP1 WPF Controls in Visual Studio 2008 in a standard WPF Application project. Both of these issues can be replicated easily using either the telerik demo's or a new blank project.

Has anyone had this issue before and can someone please help (my client isn't a happy bunny!!).

Cheers

(edit for spelling/gramar correction only)

GridView

answered on 01 Dec 2010