在XAML画布上放大和缩小的滚动条

时间:2016-03-28 15:01:19

标签: wpf vb.net xaml scrollbar zooming

我有一个画布,将从后面的代码生成图像,我的xaml如下所示      

<ScrollViewer HorizontalScrollBarVisibility="Visible"  VerticalScrollBarVisibility="Visible" >
    <WrapPanel >
        <Grid ScrollViewer.HorizontalScrollBarVisibility="Visible" >
            <Grid.RowDefinitions>
                <RowDefinition Height="25" />
                <RowDefinition Height="20" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="350"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Menu x:Name="menu1" Grid.Row="0" BorderBrush="AliceBlue" VerticalAlignment="Top" FontFamily="Comic Sans MS" DockPanel.Dock="Top" RenderTransformOrigin="0.48,3.04" >
                <MenuItem Header="_File" Width="92" FontSize="16" FontWeight="Normal" FontFamily="Century Gothic" >

                    <MenuItem Header="_Print"/>
                    <MenuItem Header="_Print Preview"/>
                    <MenuItem Header="_Exit"/>

                </MenuItem>
            </Menu>

            <ToolBar x:Name="toolBar1" Grid.Row="1" Grid.RowSpan="2" BorderBrush="Red"  BorderThickness="3" Margin="0,0,0,900"   Height="30" VerticalAlignment="Top" DockPanel.Dock="Top" >
                <Button x:Name="Zoomin" Click="menuItemZoomin_Click" HorizontalAlignment="Left" Margin="1" Width="90"  FontSize="16" FontWeight="SemiBold" Height="55" RenderTransformOrigin ="0.917,0.587" IsHitTestVisible="True" IsEnabled="True" FontFamily="Century Gothic" Content="Zoom In" />
                <Button x:Name="Zoomout" Click="menuItemZoomout_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" RenderTransformOrigin="0.917,0.587" Height="55" FontFamily="Century Gothic" Content="Zoom Out"/>
                <!--<Button x:Name="Print" Click="PrintBtn_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" RenderTransformOrigin="0.917,0.587" Height="55" FontFamily="Century Gothic" Content="Print"/>-->
            </ToolBar>



            <Canvas x:Name="cvsWarehouse"  Grid.Row="1"  Focusable="True" ScrollViewer.CanContentScroll="True"  ScrollViewer.HorizontalScrollBarVisibility="Visible" ScrollViewer.VerticalScrollBarVisibility="Visible"    MouseWheel="Canvas_MouseWheel"  RenderTransformOrigin="0.5,0.5" Margin="15,144,122,151" Grid.ColumnSpan="2"  >
                <Canvas.LayoutTransform>
                    <TransformGroup>
                        <ScaleTransform x:Name ="st1" ScaleX="{Binding Value, ElementName=uiScaleSlider}"
                            ScaleY="{Binding Value, ElementName=uiScaleSlider}"  />
                        <TranslateTransform Y="100" />
                    </TransformGroup>

                </Canvas.LayoutTransform>
            </Canvas>
        </Grid>
    </WrapPanel>

cvsWarehouse 是实际的画布,其中许多代码背后的工作继续生成图像,输出窗口如下所示。 Scrollbar showing only half

当它最大化时,它不显示滚动条。我疯狂地用Google搜索,尽我所能,但仍无法解决问题。我想滚动到画布的末尾。下面还有更多图片,但 wrappanel或布局转换在这里没有任何效果。这也有放大和缩小但仍然不会显示滚动条。

Maximized but still content is there below but no scrollbars 当我说下面的内容仍然存在时,这就是我的意思

Such a huge canvas

如何使此滚动条可见。喜欢放大或缩小或最小化或最大化

1 个答案:

答案 0 :(得分:0)

我遇到了类似的问题,我发现这个问题的第一个答案是有用的 - (LayoutTransform on certain elements in canvas?)。将ScrollViewer应用于画布(已应用Layout变换的元素)。滚动条必须检测画布大小的变化才能显示滚动条。此外,我不认为你需要在Canvas标签内 - ScrollViewer.CanContentScroll =“True”ScrollViewer.Horizo​​ntalScrollBarVisibility =“Visible”ScrollViewer.VerticalScrollBarVisibility =“Visible”。 ScrollViewer标记内的这些定义应该呈现所需的功能。