Pulled LayoutTransformer from Silverlight Toolkit - behaving weird

Question

Background information: Long story short, Our company is currently using both the Telerik Silverlight tools and the Silverlight Toolkit to accomplish what we need in our program. Since Silverlight is dying out and the Silverlight Toolkit has not been updated since 2011, we are removing all dependencies on the Silverlight Toolkit and trying to replace those controls with a Telerik Alternative so that we are not using both toolkits. This way our customers only needs to download a 5mb file rather than a 10mb file.

Since there was no Telerik alternative to LayoutTransformer, I decided to just pull the code from the source and put it in our project. After pulling the source file from the Toolkit from here , placing it in my project, and then updating all the references I end up with a little problem.

The screen in question is supposed to look like this:

But it ends up looking like this after the change:


The only thing I changed was

<UserControl
   ...
   xmlns:layoutToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Layout.Toolkit">

To

<UserControl
   ...
   xmlns:layoutToolkit="clr-namespace:Company.MyApp.App.Controls.LayoutTransformer">

to make the control reference the code that I pulled out instead of the code from the assembly.


It seems that the Grid that is holding all that information is not autosizing and instead all the information just gets jammed into that little area.(Even though none of that code changed)


Does anyone know what might be causing the new LayoutTransformer to behave like this even though all the code is technically the same? Am I getting something wrong in pulling code from the Toolkit and placing it in my project? I tried to nail it down to only the relevant information, but if you need more information please let me know. Thanks!

Answer 1

My guess is that you need to also copy the XAML for the control style into your application resources.

<Style TargetType="layoutToolkit:LayoutTransformer">
    <Setter Property="Foreground" Value="#FF000000"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="layoutToolkit:LayoutTransformer">
                <Grid x:Name="TransformRoot" Background="{TemplateBinding Background}">
                    <ContentPresenter
                        x:Name="Presenter"
                        Content="{TemplateBinding Content}"
                        ContentTemplate="{TemplateBinding ContentTemplate}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 2

Couldn't get the LayoutTransformer to work no matter what I did so I just ended up switching it to a RenderTransform. From that change I got the problem that the ScrollViewer wasn't changing the scrollbars according to the width of the StackPanel when I would zoom in/out (the reason we went with the LayoutTransform in the first place is because it would automatically do that for you). To fix this I found a workaround by wrapping the StackPanel (which is being transformed) in a Canvas. Then when the StackPanel is being transformed I set the size of the Canvas. Here's the code below for any who might need it in the future.

XAML:

                <ScrollViewer
                    x:Name="PageScrollViewer"
                    HorizontalScrollBarVisibility="Auto"
                    VerticalScrollBarVisibility="Auto"
                    Background="#404040">
                    <Canvas x:Name="DocumentPanelHolder" UseLayoutRounding="False">
                        <StackPanel x:Name="DocumentPanel" Orientation="Vertical"/>
                    </Canvas>
                </ScrollViewer>

C#: //Inside the on set zoom function.

            ScaleTransform st = new ScaleTransform();
            st.ScaleX = newZoomValue;
            st.ScaleY = newZoomValue;
            this.DocumentPanel.RenderTransform = st;
            this.DocumentPanel.UpdateLayout();
            this.DocumentPanelHolder.Height = this.DocumentPanel.ActualHeight * newZoomValue;
            this.DocumentPanelHolder.Width = this.DocumentPanel.ActualWidth * newZoomValue;