I am having a weird problem with the RadDocking control. You can find the example xaml code below. I am setting the datacontext of the UserControl from codebehind. And for the local:SelectedComponentsView control the DataContext binding is not being set!! But when I put the entire RadDocking object inside a Tabcontrol and TabItem, it works!!! But I don't want to use a TabControl to fix this problem. Please advice on the problem I am facing.
Regards,
<UserControl x:Class="MyProject.Engineering.Common.Controls.EnergyStateModelView" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" xmlns:local="clr-namespace:MyProject.Engineering.Common.Controls" xmlns:controls="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls" mc:Ignorable="d" d:DesignHeight="750" d:DesignWidth="1000"> <UserControl.Resources> <SolidColorBrush x:Key="LightGrayBrush" Color="#FFEFEFF2" /> <SolidColorBrush x:Key="LightGrayBackgroundBrush" Color="#FFFFFFFF" /> <SolidColorBrush x:Key="DarkGrayBrush" Color="#FF424242" /> <SolidColorBrush x:Key="ContentForegroundBrush" Color="#FF020202" /> <SolidColorBrush x:Key="GreenBrush" Color="#FF388B41" /> <SolidColorBrush x:Key="DisableBrush" Color="#4C434647" /> <SolidColorBrush x:Key="LabelBrush" Color="#767676" /> <SolidColorBrush x:Key="ToolbarForegroundBrush" Color="#FF434647" /> <local:WidthConverter x:Key="WidthConverter"/> <local:ItemToIndexConverter x:Key="IndexConverter"/> <local:ResultToColorConverter x:Key="ColorConverter"/> <local:InverseBooleanConverter x:Key="InverseBooleanConverter"/> <controls:Windows8Colors x:Key="Windows8Colors" /> <SolidColorBrush x:Key="MarkerBrush" Color="{Binding Source={StaticResource Windows8Colors}, Path=Palette.MarkerColor}" /> <SolidColorBrush x:Key="AccentBrush" Color="{Binding Source={StaticResource Windows8Colors}, Path=Palette.AccentColor}" /> <SolidColorBrush x:Key="MainBrush" Color="{Binding Source={StaticResource Windows8Colors}, Path=Palette.MainColor}" /> <SolidColorBrush x:Key="BasicBrush" Color="{Binding Source={StaticResource Windows8Colors}, Path=Palette.BasicColor}" /> </UserControl.Resources> <UserControl.InputBindings> <KeyBinding Modifiers="Control" Key="N" Command="{Binding NewMenuCommand}"/> <KeyBinding Modifiers="Control" Key="O" Command="{Binding OpenMenuCommand}"/> <KeyBinding Modifiers="Control" Key="S" Command="{Binding SaveMenuCommand}"/> <KeyBinding Modifiers="Control+Shift" Key="S" Command="{Binding SaveAsMenuCommand}"/> <KeyBinding Modifiers="Control" Key="W" Command="{Binding CloseMenuCommand}"/> </UserControl.InputBindings> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <StackPanel Grid.Row="0"> <telerik:RadMenu Name="mnuMain" Background="Transparent"> <telerik:RadMenuItem Header="FILE" > <telerik:RadMenuItem Name="NewItem" Header="_New"InputGestureText="Ctrl+N" Command="{Binding NewMenuCommand}"/> <telerik:RadMenuItem Name="OpenItem" Header="_Open"InputGestureText="Ctrl+O" Command="{Binding OpenMenuCommand}" CommandParameter="{Binding ElementName=EnergyStateModelView}"/> <telerik:RadMenuItem Name="OpenRecentItem" Header="Open Recent" ItemsSource="{Binding LastLogs}"> <telerik:RadMenuItem.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <MenuItem Header="{Binding FileName}" Command="{Binding Open}"/> </StackPanel> </DataTemplate> </telerik:RadMenuItem.ItemTemplate> </telerik:RadMenuItem> <telerik:RadMenuItem IsSeparator="True"/> <telerik:RadMenuItem Name="SaveItem" Header="_Save"InputGestureText="Ctrl+S" Command="{Binding SaveMenuCommand}"/> <telerik:RadMenuItem Name="SaveAsItem" Header="_Save As"InputGestureText="Ctrl+Shift+S" Command="{Binding SaveAsMenuCommand}"/> <telerik:RadMenuItem Name="CloseItem" Header="_Close"InputGestureText="Ctrl+W" Command="{Binding CloseMenuCommand}"/> <telerik:RadMenuItem IsSeparator="True"/> <telerik:RadMenuItem Name="ExitMenu" Header="_Exit"InputGestureText="Ctrl+Q" Command="{Binding ExitMenuCommand}"/> </telerik:RadMenuItem> <telerik:RadMenuItem Header="VIEW"> <telerik:RadMenuItem Name="ComponentExplorerItem"Header="Component Explorer" IsCheckable="True" IsChecked="{Binding ElementName=tabFacility, Path=IsSelected, Mode=TwoWay}"/> <telerik:RadMenuItem Name="ConnectionExplorerItem"Header="Connection Explorer" IsCheckable="True" IsChecked="{Binding ElementName=tabConnection, Path=IsSelected, Mode=TwoWay}"/> <telerik:RadMenuItem IsSeparator="True"/> <telerik:RadMenuItem Name="MonitoringWindowDiagramItem"Header="Monitoring Window-Diagram"/> <telerik:RadMenuItemName="MonitoringWindowComponentTreeItem" Header="Monitoring Window-Component Tree"/> <telerik:RadMenuItem IsSeparator="True"/> <telerik:RadMenuItem Name="PropertiesWindow"Header="Properties Windows" IsCheckable="True" IsChecked="{Binding ElementName=PropertiesPane, Path=IsHidden, Converter={StaticResource InverseBooleanConverter}, Mode=TwoWay}"> <telerik:EventToCommandBehavior.EventBindings> <telerik:EventBinding Command="{Binding OnPropertiesWindowClickCommand}" CommandParameter="{Binding ElementName=PropertiesPane}" EventName="Click" /> </telerik:EventToCommandBehavior.EventBindings> </telerik:RadMenuItem> <telerik:RadMenuItem IsSeparator="True"/> <telerik:RadMenuItem Name="OutputWindow" Header="Output Window" IsCheckable="True" IsChecked="{Binding ElementName=OutputPane, Path=IsHidden, Converter={StaticResource InverseBooleanConverter}, Mode=TwoWay}"> <telerik:EventToCommandBehavior.EventBindings> <telerik:EventBinding Command="{Binding OnOutputWindowClickCommand}" CommandParameter="{Binding ElementName=OutputPane}"EventName="Click" /> </telerik:EventToCommandBehavior.EventBindings> </telerik:RadMenuItem> </telerik:RadMenuItem> <telerik:RadMenuItem Header="BUILD"> <telerik:RadMenuItem Name="CompileMenuItem"Header="Compile" InputGestureText="Ctrl+B" Command="{Binding CompileCommand}"/> <telerik:RadMenuItem Name="DownloadMenuItem"Header="Download" InputGestureText="Ctrl+D" Command="{Binding DownloadMenuCommand}"/> <telerik:RadMenuItem IsSeparator="True"/> <telerik:RadMenuItem Name="SimulateMenuItem"Header="Simulate" InputGestureText="Ctrl+S"/> </telerik:RadMenuItem> <telerik:RadMenuItem Header="HELP" /> </telerik:RadMenu> </StackPanel> <!--Main Content Grid--> <Grid Grid.Row="1"> <telerik:RadDocking x:Name="dockEngineering" Grid.Row="1"Margin="0,0,0,0" BorderThickness="0" Padding="0" Background="{StaticResource LightGrayBrush}"> <!--DocumentHost--> <telerik:RadDocking.DocumentHost> <telerik:RadSplitContainer> <telerik:RadPaneGroup> <telerik:RadPane Header="Engineering"> <local:SelectedComponentsViewDataContext="{Binding FacilityViewModel, Mode=TwoWay}"/> </telerik:RadPane> <telerik:RadPane Header="Monitoring"> <Grid Name="grdMonitoring"> </Grid> </telerik:RadPane> <telerik:RadPane Header="Forecast"> <Grid Name="grdForecast"> <local:ForecastView DataContext="{Binding ForecastViewModel}"/> </Grid> </telerik:RadPane> </telerik:RadPaneGroup> </telerik:RadSplitContainer> </telerik:RadDocking.DocumentHost> <telerik:RadSplitContainer MaxWidth="600"telerik:DockingPanel.InitialSize="300,150" Name="LeftContainer"InitialPosition="DockedLeft"> <telerik:RadPaneGroup x:Name="Group1"> <telerik:RadPane x:Name="LeftPane" Header="Facility Explorer"> <telerik:RadTabControl x:Name="tbcInner"x:FieldModifier="public" TabOrientation="Horizontal" TabStripPlacement="Bottom"SelectedIndex="0"> <telerik:RadTabItem x:Name="tabFacility"x:FieldModifier="public" Header="Facility View" IsSelected="True"> <!--Server Exproler--> <!--<telerik:RadPane x:Name="Pane11" Header="Facility Explorer">--> <Grid Margin="3 0"> <local:FacilityViewx:Name="FacilityView" DataContext="{Binding FacilityViewModel, Mode=TwoWay}"/> </Grid> <!--</telerik:RadPane>--> </telerik:RadTabItem> <telerik:RadTabItemx:Name="tabConnection" x:FieldModifier="public" Header="Connection View"IsSelected="False"> <!--<telerik:RadPane x:Name="Pane12" Header="Connection Explorer">--> <Grid Margin="3 0"> <local:CommunicationViewx:Name="CommunicationView" DataContext="{Binding CommunicationViewModel}"/> </Grid> <!--</telerik:RadPane>--> </telerik:RadTabItem> </telerik:RadTabControl> </telerik:RadPane> </telerik:RadPaneGroup> </telerik:RadSplitContainer> <telerik:RadSplitContainer MaxWidth="679"telerik:DockingPanel.InitialSize="210,250" Width="400" x:Name="RightContainer"InitialPosition="DockedRight"> <telerik:RadPaneGroup x:Name="Group2"> <!--Properties--> <telerik:RadPane x:Name="PropertiesPane"Header="Properties"> <Grid Margin="3 0"> <Grid.RowDefinitions> <RowDefinition Height="*" /> </Grid.RowDefinitions> <local:PropertyEditorx:Name="PropertyEditor" Item="{Binding SelectedItem}"/> </Grid> </telerik:RadPane> </telerik:RadPaneGroup> </telerik:RadSplitContainer> <telerik:RadSplitContainer x:Name="BottomContainer"InitialPosition="DockedBottom"> <telerik:RadPaneGroup x:Name="Group3"> <!--Properties--> <telerik:RadPane x:Name="OutputPane" Header="Output Window"> <Grid Margin="3 0"> <Grid.RowDefinitions> <RowDefinition Height="*" /> </Grid.RowDefinitions> <ListView Name="OutputBox"VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Background="LightYellow"ItemsSource="{Binding OutputMessages}"> <telerik:EventToCommandBehavior.EventBindings> <telerik:EventBindingCommand="{Binding OnOutputBoxSelectedCommand}" CommandParameter="{Binding ElementName=OutputBox, Path=SelectedItem}" EventName="SelectionChanged" /> </telerik:EventToCommandBehavior.EventBindings> <ListView.ItemContainerStyle> <StyleTargetType="ListViewItem"> <SetterProperty="Background" Value="{Binding ResultType, Converter={StaticResource ColorConverter}}"/> </Style> </ListView.ItemContainerStyle> <ListView.View> <GridView> <GridViewColumnHeader="Number" DisplayMemberBinding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListViewItem}}, Converter={StaticResource IndexConverter}}"/> <GridViewColumnHeader="Description" DisplayMemberBinding="{Binding MessageContent}" Width="{Binding ElementName=OutputBox, Path=ActualWidth, Converter={StaticResource WidthConverter},ConverterParameter=1}"/> </GridView> </ListView.View> </ListView> </Grid> </telerik:RadPane> </telerik:RadPaneGroup> </telerik:RadSplitContainer> </telerik:RadDocking> </Grid> </Grid> </UserControl>
10 Answers, 1 is accepted
As we see that you have posted a support thread with ID: 854287 about the same issue could we continue the discussion there. I will post our response from that thread in this thread also in order for it to be available to the community:
We are not aware of issues that could lead to this unexpected behavior when the DataContext is passed to the RadPane instances. We tried to reproduce the described issue but to no avail. When the DataContext of the UserControl in which the RadDockig is placed is set via the code behind and/or as a StaticResource the corresponding binding to the custom UserControls (ForecastView etc.) is correctly resolved. Note that when working with RadDocking and statically declared RadPane instances which rely on a DataContext, it is recommended to explicitly set the DataContext of those RadPane instances rather than leaving that context to be inherited by the structure. This is because the RadDocking control has features that remove the RadPane instances from the visual tree (making a pane floating) which could cause the DataContext to be lost in the process.
Regards,
Vladi
Telerik
Rank 1
Hi,
I am also facing a similar problem where I had Raddocking window and inside it i had a RadSplitContainer->RadPaneGroup->RadPane and inside it I had placed the Tabcontrol and inside the tabitem i had placed the Radlistbox where it has a itemsource of a list and inside radlistbox itemtemplate i had a usercontrol which contains the radcartesianchart.
Now i am binding some data to radcartesian chart and I am adding a item to radlistbox.This works fine here :)
but when i am trying to float the docking window the data inside the radcartesian chart get disappears and itemsource of the chart gets null.Kindly suggest me a solution.
Thanks,
Karthikeyan R
From the provided description of you scenario it seems the DataContext of the ListBox is lost when the Pane becomes floating and it is placed in ToolWindow. However, from the provided description we could not tell for sure what is causing the DataContext to be lost.
We have created a sample project based on the description of your scenario and it seems everything is working as expected. Please, modify the sample in order to reproduce our issue and send it back to us - thus we could be able to provide you with a prompt solution.
Hope this helps.
Regards,
Nasko
Telerik by Progress
Rank 1
Hi Nasko,
Thanks for your reply and the sample that you gave me seems similar to my application but i am using series provider to generate the series in the chart I will try to change the default series to series provider in your sample application and will let you know.
Thanks,
Karthikeyan R
Take us much as time as you need to modify the provided sample in order to reproduce your issue and send it back to us.
Meanwhile, if you have any additional questions or concerns regarding Telerik controls, please do not hesitate to contact us.
Regards,
Nasko
Telerik by Progress
Rank 1
Hi Nasko,
I have found the issue where i have used the vertical axis to be rendered dynamically by applying styles to lineseries as shown below
<Style TargetType="telerik:LineSeries">
<Setter Property="VerticalAxis" Value="{Binding VerticalAxis}" /></Style>
this was causing the error but when i am trying to declare the static vertical axis it is working fine.I am facing a issue where i need to render the vertical axis dynamically where it will have two axis declaration using viewmodel.The series added either will be on the left y axis or in the right y axis.So while i am trying to declare it using
<telerik:LinearAxis HorizontalLocation="{Binding Path=VerticalAxisLocation}" LabelFormat="{Binding Path=VerticalAxisLabelFormat}"/>
where i also need the labelformat to render from viewmodel.The VerticalAxisLocation and VerticalAxisLabelFormat are both string.I have also try to implement the triggers for it but horizontallocation property is not available in the style of the linearaxis.
Kindly suggest me a solution
Thanks,
Karthikeyan R
We are not sure that we completely understand your scenario and how exactly the Chart is declared. Could you please, try to isolate your issue in a sample project and send it to us? Using the sample we will be able to observe the described by you issue and we will be able to provide you with a prompt solution.
Some code snippets of your Chart declaration and images will also be of great help.
We are looking forward to hearing from you.
Regards,
Nasko
Telerik by Progress
Rank 1
Hi Nasko,
I cant able to attach the .zip extensions as extensions like.gif, .jpg, .jpeg, .png only allowed.I will share the code sample here
<telerik:RadCartesianChart>
<telerik:RadCartesianChart.HorizontalAxis>
<telerik:CategoricalAxis/>
</telerik:RadCartesianChart.HorizontalAxis>
<telerik:RadCartesianChart.VerticalAxis>
<telerik:LinearAxis />
</telerik:RadCartesianChart.VerticalAxis>
<telerik:RadCartesianChart.SeriesProvider>
<telerik:ChartSeriesProvider Source="{Binding ItemsCollection}">
<telerik:ChartSeriesProvider.SeriesDescriptors>
<telerik:CategoricalSeriesDescriptor CategoryPath="Name"
ItemsSourcePath="testCol"
ValuePath="QuantitySold" >
<telerik:CategoricalSeriesDescriptor.Style>
<Style>
<Setter Property="telerik:LineSeries.VerticalAxis">
<Setter.Value>
<telerik:LinearAxis HorizontalLocation="{Binding horizontalLocation}" Background="WhiteSmoke"
ElementBrush="WhiteSmoke"
Foreground="WhiteSmoke"/>
</Setter.Value>
</Setter>
</Style>
</telerik:CategoricalSeriesDescriptor.Style>
</telerik:CategoricalSeriesDescriptor>
</telerik:ChartSeriesProvider.SeriesDescriptors>
</telerik:ChartSeriesProvider>
</telerik:RadCartesianChart.SeriesProvider>
</telerik:RadCartesianChart>
Where i am trying to bind the linear axis using the viewmodel.
Thanks,
Karthikeyan R
Rank 1
HI Nasko,
Please find the viewmodel code
public class ViewModel
{
public ObservableCollection<Product> Products { get; set; }
public ObservableCollection<string> Items { get; set; }
public ObservableCollection<ProductCollections> ItemsCollection { get; set; }
public string horizontalLocation { get; set; }
public ViewModel()
{
this.ItemsCollection = new ObservableCollection<ProductCollections>();
this.Products = new ObservableCollection<Product>();
this.Products.Add(new Product() { Name = "Product1", QuantitySold = 10, horizontalLocation ="Right"});
this.Products.Add(new Product() { Name = "Product2", QuantitySold = 20, horizontalLocation = "Right" });
this.Products.Add(new Product() { Name = "Product3", QuantitySold = 30, horizontalLocation = "Right" });
this.Products.Add(new Product() { Name = "Product4", QuantitySold = 40, horizontalLocation = "Right" });
this.Products.Add(new Product() { Name = "Product5", QuantitySold = 50, horizontalLocation = "Right" });
this.Products.Add(new Product() { Name = "Product6", QuantitySold = 60, horizontalLocation = "Right" });
this.Items = new ObservableCollection<string>();
this.Items.Add("Item1");
this.Items.Add("Item2");
this.Items.Add("Item3");
ProductCollections obj = new ProductCollections();
obj.Name = "E";
obj.testCol = this.Products;
obj.horizontalLocation = "Right";
this.ItemsCollection.Add(obj);
}
}
the scenario now is not working properly. Please help me out to bind the horizontal location to the series.
Thanks,
Karthikeyan R
From the provided code-snippet it seems you try to bind to the "horizontalLocation" property part of the ProductCollection class. If that is the case the following binding needs to be used:
<telerik:CategoricalSeriesDescriptor.Style> <Style TargetType="telerik:LineSeries"> <Setter Property="telerik:LineSeries.VerticalAxis"> <Setter.Value> <telerik:LinearAxis DataContext="{Binding ItemsCollection[0]}" HorizontalLocation="{Binding horizontalLocation}" Background="Red" ElementBrush="Red" Foreground="Red"/> </Setter.Value> </Setter> </Style></telerik:CategoricalSeriesDescriptor.Style>As you are binding to a collection you need to provide the index of the item you want to bind to.
Hope the provided information will be helpful for you.
Regards,
Nasko
Telerik by Progress