Stretchable Tchart control in Silverlight

TeeChart for Microsoft Visual Studio .NET, Xamarin Studio (Android, iOS & Forms) & Monodevelop.
Post Reply
BlueMonkey
Newbie
Newbie
Posts: 34
Joined: Tue Nov 04, 2008 12:00 am

Stretchable Tchart control in Silverlight

Post by BlueMonkey » Mon Jun 21, 2010 9:16 pm

I have a simple Silverlight example that I cannot get to work. I noticed that this issue has come up before in the Forum, but I could not find out whether there is a solution, or it is a bug.

I have a tab control with two tab items. In each tab item I have a TChart control that is supposed to stretch to fill the tab item. If I assign a fixed size to the TChart control in the first tab, then the TChart in the second tab will automatically stretch. If I try to make them both stretchable, then the designer preview fails. If I replace the TChart control in the first tab item with a simple button, the button correctly stretches and so does the TChart control in the second tab item. I have tried all kinds of variations but I cannot get both TChart controls to stretch automatically. See attached code. Remove the hard coded dimensions of the first TChart control to reproduce the problem.

Can you help?

Thanks,
Kent

Code: Select all

<UserControl xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"  
             xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"  
     xmlns:dataInput="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.Input"  
    xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"  x:Class="SilverlightTestApplication.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"
    xmlns:my="clr-namespace:Steema.TeeChart.Silverlight;assembly=TeeChart.Silverlight">
  
 
    <Grid  x:Name="gridChart" Background="LightBlue" Margin="10,10,10,10">
        <Grid.RowDefinitions>
            <RowDefinition MinHeight="10" />
            <!---Name="rowListView"-->
            <!--- listbox/filters -->
            <RowDefinition Height="auto"/>
            <!--- Splitter -->
            <RowDefinition MinHeight="200"/>
            <!--- Chart -->
            <RowDefinition Height="26"/>
            <!--- Toolbar -->
            <RowDefinition Height="26"/>
            <!--- Tool panel -->
        </Grid.RowDefinitions>
        <controls:TabControl Grid.Row="0" Name="tabTools" >
            <controls:TabItem Header="Filters" Name="tabItemToolsFilter" >
            </controls:TabItem>
            <controls:TabItem Header="Device Information" Name="tabItemToolsDeviceInfo" >
                <!---ToolTip="Display device information"-->
             </controls:TabItem>
            <controls:TabItem Header="Notepad" Name="tabItemToolsNotepad" >
                <!---ToolTip="Import/Export chart data"-->
            </controls:TabItem>
        </controls:TabControl>
        <controls:GridSplitter Grid.Row="1"  Name="gridSplitterChart" Height="10"  
                      VerticalAlignment="Center" HorizontalAlignment="Stretch"/>
        <!---ResizeDirection="Auto"-->
        <controls:TabControl Grid.Row="2" Name="tabControlChart" >
            <!--SelectionChanged="tabControlChart_SelectionChanged"-->
            <controls:TabItem Header="ITI (CBEMA)" Name="tabItemCBEMA">
                <StackPanel>
                    <Button Content="button 1"/>
                     <!--<my:TChart Name="tChart1" Height="420" Width="620" Margin="0,0,0,0"></my:TChart>-->
                    <my:TChart Name="ChartHMICBEMA" Height="420" Width="620" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="0,0,0,0" />
                    <!-- GetAxisLabel="ChartHMIDisplay_GetAxisLabel" GetNextAxisLabel="ChartHMIDisplay_GetNextAxisLabel" ClickLegend="ChartHMIDisplay_ClickLegend" -->
                    <!---MouseDown="ChartHMICBEMA_MouseDown" MouseUp="ChartHMICBEMA_MouseUp" MouseWheel="ChartHMICBEMA_MouseWheel"  MouseMove="ChartHMICBEMA_MouseMove"-->
                </StackPanel>
            </controls:TabItem>
            <controls:TabItem Header="VSSI" Name="tabItemChart">
                <!--<my:TChart Name="ChartHMIDisplay" Height="420" Width="620" Margin="0,0,0,0"></my:TChart>-->
                <my:TChart Name="ChartHMIDisplay" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="0,0,0,0" />
                <!-- GetAxisLabel="ChartHMIDisplay_GetAxisLabel" GetNextAxisLabel="ChartHMIDisplay_GetNextAxisLabel" ClickLegend="ChartHMIDisplay_ClickLegend"-->
                <!---MouseDown="ChartHMICBEMA_MouseDown" MouseUp="ChartHMICBEMA_MouseUp" MouseMove="ChartHMICBEMA_MouseMove"  MouseWheel="ChartHMICBEMA_MouseWheel"-->
            </controls:TabItem>
        </controls:TabControl>

    </Grid>
</UserControl>

Sandra
Site Admin
Site Admin
Posts: 3132
Joined: Fri Nov 07, 2008 12:00 am

Re: Stretchable Tchart control in Silverlight

Post by Sandra » Wed Jun 23, 2010 9:54 am

Hello Kent,

I have tested your project and I could reproduce your problem here with your attached code. But, I have been debugging your code, and I found that if I comment StackPanel lines, the first Chart automatically stretch. Please, could you tell us if commenting StrackPanel code works as you want and if it is a good solution for you?

Code: Select all

<!--<StackPanel>
                    <Button Content="button 1"/>-->
                    <!--<my:TChart Name="tChart1" Height="420" Width="620" Margin="0,0,0,0"></my:TChart>-->
                    <my:TChart Name="ChartHMICBEMA"  VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="0,0,0,0" />
                    <!-- GetAxisLabel="ChartHMIDisplay_GetAxisLabel" GetNextAxisLabel="ChartHMIDisplay_GetNextAxisLabel" ClickLegend="ChartHMIDisplay_ClickLegend" -->
                    <!---MouseDown="ChartHMICBEMA_MouseDown" MouseUp="ChartHMICBEMA_MouseUp" MouseWheel="ChartHMICBEMA_MouseWheel"  MouseMove="ChartHMICBEMA_MouseMove"-->
                <!--</StackPanel>-->
I hope will helps.

Thanks,
Best Regards,
Sandra Pazos / Development & Support
Steema Software
Avinguda Montilivi 33, 17003 Girona, Catalonia
Tel: 34 972 218 797
http://www.steema.com
Image Image Image Image Image Image
Instructions - How to post in this forum

BlueMonkey
Newbie
Newbie
Posts: 34
Joined: Tue Nov 04, 2008 12:00 am

Re: Stretchable Tchart control in Silverlight

Post by BlueMonkey » Wed Jun 23, 2010 4:49 pm

Removing the StackPanel did not solve the problem. The chart in the first tab still does not stretch. The chart in the second tab does stretch.
Attachments
Silverlight_no_stretch.JPG
Chart does not stretch
Silverlight_no_stretch.JPG (150.43 KiB) Viewed 9171 times

Sandra
Site Admin
Site Admin
Posts: 3132
Joined: Fri Nov 07, 2008 12:00 am

Re: Stretchable Tchart control in Silverlight

Post by Sandra » Fri Jun 25, 2010 9:29 am

Hello Kent,


Using next code, last version of TeeChartSilverlight and commented StackPanel both charts are Stretch automatically:

Code: Select all

<UserControl xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" 
             xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit" 
     xmlns:dataInput="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.Input" 
    xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"  
        x:Class="SilverlightApplication1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"
    xmlns:my="clr-namespace:Steema.TeeChart.Silverlight;assembly=TeeChart.Silverlight">

    <Grid  x:Name="gridChart" Background="LightBlue" Margin="10,10,10,10">
        <Grid.RowDefinitions>
            <RowDefinition MinHeight="10" />
            <!---Name="rowListView"-->
            <!--- listbox/filters -->
            <RowDefinition Height="auto"/>
            <!--- Splitter -->
            <RowDefinition MinHeight="200"/>
            <!--- Chart -->
            <RowDefinition Height="26"/>
            <!--- Toolbar -->
            <RowDefinition Height="26"/>
            <!--- Tool panel -->
        </Grid.RowDefinitions>
        <controls:TabControl Grid.Row="0" Name="tabTools" >
            <controls:TabItem Header="Filters" Name="tabItemToolsFilter" >
            </controls:TabItem>
            <controls:TabItem Header="Device Information" Name="tabItemToolsDeviceInfo" >
                <!---ToolTip="Display device information"-->
            </controls:TabItem>
            <controls:TabItem Header="Notepad" Name="tabItemToolsNotepad" >
                <!---ToolTip="Import/Export chart data"-->
            </controls:TabItem>
        </controls:TabControl>
        <controls:GridSplitter Grid.Row="1"  Name="gridSplitterChart" Height="10" 
                      VerticalAlignment="Center" HorizontalAlignment="Stretch"/>
        <!---ResizeDirection="Auto"-->
        <controls:TabControl Grid.Row="2" Name="tabControlChart" >
            <!--SelectionChanged="tabControlChart_SelectionChanged"-->
            <controls:TabItem Header="ITI (CBEMA)" Name="tabItemCBEMA">
                <!--<StackPanel>-->
                <!--<Button Content="button 1"/>-->
                <!--<my:TChart Name="tChart1" Height="420" Width="620" Margin="0,0,0,0"></my:TChart>-->
                    <my:TChart Name="ChartHMICBEMA"  VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="0,0,0,0" />
                    <!-- GetAxisLabel="ChartHMIDisplay_GetAxisLabel" GetNextAxisLabel="ChartHMIDisplay_GetNextAxisLabel" ClickLegend="ChartHMIDisplay_ClickLegend" -->
                    <!---MouseDown="ChartHMICBEMA_MouseDown" MouseUp="ChartHMICBEMA_MouseUp" MouseWheel="ChartHMICBEMA_MouseWheel"  MouseMove="ChartHMICBEMA_MouseMove"-->
                    <!--</StackPanel>-->
            </controls:TabItem>
            <controls:TabItem Header="VSSI" Name="tabItemChart">
                <!--<my:TChart Name="ChartHMIDisplay" Height="420" Width="620" Margin="0,0,0,0"></my:TChart>-->
                <my:TChart Name="ChartHMIDisplay" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="0,0,0,0" />
                <!-- GetAxisLabel="ChartHMIDisplay_GetAxisLabel" GetNextAxisLabel="ChartHMIDisplay_GetNextAxisLabel" ClickLegend="ChartHMIDisplay_ClickLegend"-->
                <!---MouseDown="ChartHMICBEMA_MouseDown" MouseUp="ChartHMICBEMA_MouseUp" MouseMove="ChartHMICBEMA_MouseMove"  MouseWheel="ChartHMICBEMA_MouseWheel"-->
            </controls:TabItem>
        </controls:TabControl>

    </Grid>
</UserControl>

Code: Select all

 public MainPage()
        {
            InitializeComponent();
            ChartHMICBEMA.Header.Text = "ChartHMICBEMA";
            ChartHMIDisplay.Header.Text = "ChartHMIDisplay";
        }
And I get next results here:
StretchCharts.zip
(68.42 KiB) Downloaded 432 times
Please, check that previous code behaves like in your application and you get same results that us images. If it doesn't work like, please, you could tell us what version of TeeChartSilverlight you are using

I hope will helps.

Thanks,
Best Regards,
Sandra Pazos / Development & Support
Steema Software
Avinguda Montilivi 33, 17003 Girona, Catalonia
Tel: 34 972 218 797
http://www.steema.com
Image Image Image Image Image Image
Instructions - How to post in this forum

BlueMonkey
Newbie
Newbie
Posts: 34
Joined: Tue Nov 04, 2008 12:00 am

Re: Stretchable Tchart control in Silverlight

Post by BlueMonkey » Fri Jun 25, 2010 4:31 pm

Sandra,

I copied and pasted your code into a new project. I am not able to load the silverlight design page in the Visual Studio designer.
I am using Visual Studio 2010 (Version 10.0.30319.1 RTMRel).
I am using TeeChart.NET (Version 4.0.2010.27967 file version 4.0.2010.27966)

I get the following error if I do not provide a Height and Width property for the first TeeChart control:

System.Reflection.TargetInvocationException
Exception has been thrown by the target of an invocation.
at System.RuntimeMethodHandle._InvokeMethodFast(IRuntimeMethodInfo method, Object target, Object[] arguments, SignatureStruct& sig, MethodAttributes methodAttributes, RuntimeType typeOwner)
at System.RuntimeMethodHandle.InvokeMethodFast(IRuntimeMethodInfo method, Object target, Object[] arguments, Signature sig, MethodAttributes methodAttributes, RuntimeType typeOwner)
at System.Reflection.RuntimeMethodInfo.Invoke(Object obj, BindingFlags invokeAttr, Binder binder, Object[] parameters, CultureInfo culture, Boolean skipVisibilityChecks)
at System.Delegate.DynamicInvokeImpl(Object[] args)
at System.Windows.Threading.ExceptionWrapper.InternalRealCall(Delegate callback, Object args, Int32 numArgs)
at MS.Internal.Threading.ExceptionFilterHelper.TryCatchWhen(Object source, Delegate method, Object args, Int32 numArgs, Delegate catchHandler)


System.InvalidOperationException
An unhandled exception was encountered while trying to render the current silverlight project on the design surface. To diagnose this failure, please try to run the project in a regular browser using the silverlight developer runtime.
at Microsoft.Windows.Design.Platform.SilverlightViewProducer.OnUnhandledException(Object sender, ViewUnhandledExceptionEventArgs e)
at Microsoft.Windows.Design.Platform.SilverlightViewProducer.SilverlightContentHost.MeasureOverride(Size availableSize)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at MS.Internal.Designer.ZoomableViewPresenter.DesignerBackground.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at System.Windows.Controls.Decorator.MeasureOverride(Size constraint)
at Microsoft.Windows.Design.Interaction.DesignerView.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at MS.Internal.Designer.Viewport.MeasureOverride(Size availableSize)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at MS.Internal.Helper.MeasureElementWithSingleChild(UIElement element, Size constraint)
at System.Windows.Controls.ScrollContentPresenter.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at System.Windows.Controls.Grid.MeasureCell(Int32 cell, Boolean forceInfinityV)
at System.Windows.Controls.Grid.MeasureCellsGroup(Int32 cellsHead, Size referenceSize, Boolean ignoreDesiredSizeU, Boolean forceInfinityV)
at System.Windows.Controls.Grid.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at System.Windows.Controls.ScrollViewer.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at System.Windows.Controls.Grid.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at MS.Internal.Helper.MeasureElementWithSingleChild(UIElement element, Size constraint)
at System.Windows.Controls.ContentPresenter.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at System.Windows.Controls.Control.MeasureOverride(Size constraint)
at System.Windows.FrameworkElement.MeasureCore(Size availableSize)
at System.Windows.UIElement.Measure(Size availableSize)
at System.Windows.Interop.HwndSource.SetLayoutSize()
at System.Windows.Interop.HwndSource.set_RootVisualInternal(Visual value)
at MS.Internal.DeferredHwndSource.ProcessQueue(Object sender, EventArgs e)


System.ArgumentException
Value does not fall within the expected range.
at MS.Internal.XcpImports.MethodEx(IntPtr ptr, String name, CValue[] cvData)
at MS.Internal.XcpImports.MethodEx(DependencyObject obj, String name)
at MS.Internal.XcpImports.UIElement_UpdateLayout(UIElement element)
at Microsoft.Windows.Design.Platform.SilverlightViewProducer.SilverlightContentHost.MeasureOverride(Size availableSize)
Attachments
VS_Error_Chart.JPG
Snapshot of Visual Studio with error
VS_Error_Chart.JPG (242.73 KiB) Viewed 9162 times

Sandra
Site Admin
Site Admin
Posts: 3132
Joined: Fri Nov 07, 2008 12:00 am

Re: Stretchable Tchart control in Silverlight

Post by Sandra » Mon Jun 28, 2010 9:02 am

Hello BlueMonkey,

I have tested again your code and I could reproduce the problem here with TeeChart2010, and I solve it changing the name of application thus:

Code Class name:

Code: Select all

x:Class="SilverlightApplication1.MainPage"
Change for your class name:

Code: Select all

 x:Class="SilverlightTestApplication.MainPage"
Could you please check again if your code works when you change class name and say us if now works as you want?

I hope will helps.

Thanks,
Best Regards,
Sandra Pazos / Development & Support
Steema Software
Avinguda Montilivi 33, 17003 Girona, Catalonia
Tel: 34 972 218 797
http://www.steema.com
Image Image Image Image Image Image
Instructions - How to post in this forum

BlueMonkey
Newbie
Newbie
Posts: 34
Joined: Tue Nov 04, 2008 12:00 am

Re: Stretchable Tchart control in Silverlight

Post by BlueMonkey » Mon Jun 28, 2010 4:44 pm

Sandra,

If I change the application name, then it does not match the content of the code behind file and I get a build error:

Error 1 The name 'InitializeComponent' does not exist in the current context

This problem seems to be specifically related to the Visual Studio design view. If I specify constant Width and Height properties, the design view appears and the application will run and display the fixed chart dimensions. If I remove the fixed chart dimensions (leaving the stretchable properties) then the design view gives the error "Value does not fall within the expected range.". However if I run the application in spite of the error in the design view, then the chart window will appear stretchable.

The conclusion is that if I want to see the design view of my GUI, I must supply fixed TChart dimensions. If I want to have a stretchable TChart in my runtime application, I must remove the fixed chart dimensions. I cannot have both.

It would be nice if the TChart would display correctly in the VS design view for both cases. Is this something you can fix?

Kent

Sandra
Site Admin
Site Admin
Posts: 3132
Joined: Fri Nov 07, 2008 12:00 am

Re: Stretchable Tchart control in Silverlight

Post by Sandra » Tue Jun 29, 2010 10:26 am

Hello BlueMonkey,

It would be nice if the TChart would display correctly in the VS design view for both cases. Is this something you can fix
Sorry, I think that I didn't understand your previous post correctly, but now I could reproduce your problem and I have added it in bug list with number [TW24015010]. We will try to fix it in next versions of TeeChartSilverlight.


Thanks,
Best Regards,
Sandra Pazos / Development & Support
Steema Software
Avinguda Montilivi 33, 17003 Girona, Catalonia
Tel: 34 972 218 797
http://www.steema.com
Image Image Image Image Image Image
Instructions - How to post in this forum

Post Reply