I am making a GUI for an project and trying to implement zooming as well...

Everything is fine except the fact that when i zoom to much in i dont get a scroll bar even if i put in a scrollviewer...here is the code

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="wpftest.Window1"
    Title="Window1" Height="500" Width="500" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="230*" />
            <RowDefinition Height="185*" />
            <RowDefinition Height="25*" />
        </Grid.RowDefinitions>
        <Slider Width="100" HorizontalAlignment="Right" x:Name="uiScaleSlider" ToolTip="Zoom" Value="1" Minimum="1" Maximum="10" Grid.Row="2" Margin="0,3,0,0" SmallChange="0.1" />
        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Grid.Row="1" Grid.RowSpan="1">
            <Grid Grid.Row="1" Grid.Column="0" Grid.RowSpan="1" Margin="0,0,0,0">
                <Grid.RenderTransform>
                    <ScaleTransform ScaleX="{Binding Path=Value, ElementName=uiScaleSlider}" ScaleY="{Binding Path=Value, ElementName=uiScaleSlider}"/>
                </Grid.RenderTransform>
                <Rectangle Name="rectangle1" Stroke="Black" Margin="156.698,40.008,236.714,56.678">
                   
                </Rectangle>
            </Grid>
        </ScrollViewer>
    </Grid>
</Window>

first i was using a stackpanel instead of grid but i couldnt put them how i wanted... and instead of rendertransform i used layouttransform but then the elements scaled in a strange way...anyone know how to solve this :(