scrolling behavior

Hello,

The drawing panel becomes larger and larger as the user drags the scrolling bars. Is it possible to limit the drawing panel to the actual content.

Thanks jzhou

Hello Jzhou

There currently isn't a way to limit the drawing panel to the bounds of the diagram, but what you can do regarding the scroll bars is to set the AllowInfiniteScrolling property on the DiagramSurface to false. This will prevent scrolling/panning the surface in anyway from infinitely increasing the drawing panel size. Zooming and smart-scrolling however will still cause the drawing area to expand. Hope that helps.

-Jason Fauchelle

Hello,

I have set the AllowInfiniteScrolling to false, but I didn't feel any difference of the scrolling experience, this is my code:

<ms:DiagramSurface Grid.Row="2" Grid.Column="0" Name="ds" Diagram="{Binding DiagramModel}"
                       Formatter="{StaticResource DiagramFormatter}"
                       SelectionMode="Extended"
                       HorizontalSnapSpecifier="{ms:SnapToInterval 10}"
                       VerticalSnapSpecifier="{ms:SnapToInterval 10}"
                       SnapLineDrawing="{StaticResource SnapLineDrawing}"
                       VerticalScrollBarVisibility="Visible"
                       HorizontalScrollBarVisibility="Visible"
                       ZoomMode="ControlMouseWheel"
                       AllowInfiniteScrolling="False"
                       Zoom="{Binding Zoom, Mode=TwoWay}"
                       DefaultCreateConnectionLineStyle="{StaticResource DefaultCreateConnectionLineStyle}">
    </ms:DiagramSurface>

anything wrong?

Thanks

Hello Jzhou

You code looks correct. When this property is false, if you drag a scroll bar thumb, it should stop moving when you get to either end of the scroll bar track. But if you set it to true, dragging the scroll bar should continue scrolling the viewport even when you reach the end. That is the effect of this property. This is all we currently provide in terms of limiting the expansion of the viewport. Does the behavior I described above work at your end?

-Jason Fauchelle

Hello,

It doesn't work at my side. I found that the value of AllowInfiniteScrolling of DiagramSurface is false as expected, but the value of AllowInfiniteScrolling of DiagramSurface.ScrollViewer is still true. I see the source code of the diagram:

<f:DiagramScrollViewer Focusable="False" Name="sv" FocusVisualStyle="{StaticResource EmptyStyle}"
                             Zoom="{Binding Zoom, Mode=TwoWay, RelativeSource={RelativeSource AncestorType={x:Type ms:DiagramSurface}}}"
                             ZoomMode="{Binding ZoomMode, RelativeSource={RelativeSource AncestorType={x:Type ms:DiagramSurface}}}"
                             DiagramSurface="{Binding RelativeSource={RelativeSource AncestorType={x:Type ms:DiagramSurface}}}"
                             MinimumExtraSpace="20"
                             AllowInfiniteScrolling="{Binding AllowInfiniteScrolling, RelativeSource={RelativeSource AncestorType={x:Type ms:DiagramSurface}}}">
        <f:DiagramScrollViewer.Background>
          <MultiBinding Converter="{StaticResource SnapLineDrawingConverter}">
            <Binding Path="HorizontalSnapSpecifier" RelativeSource="{RelativeSource AncestorType={x:Type ms:DiagramSurface}}" />
            <Binding Path="VerticalSnapSpecifier" RelativeSource="{RelativeSource AncestorType={x:Type ms:DiagramSurface}}" />
            <Binding Path="ScrollViewer.EffectiveZoom" RelativeSource="{RelativeSource AncestorType={x:Type ms:DiagramSurface}}" />
            <Binding Path="ZoomMode" RelativeSource="{RelativeSource AncestorType={x:Type ms:DiagramSurface}}" />
            <Binding Path="ActualWidth" RelativeSource="{RelativeSource Self}" />
            <Binding Path="ActualHeight" RelativeSource="{RelativeSource Self}" />
            <Binding Path="HorizontalOffset" RelativeSource="{RelativeSource Self}" />
            <Binding Path="VerticalOffset" RelativeSource="{RelativeSource Self}" />
            <Binding Path="SnapLineDrawing" RelativeSource="{RelativeSource AncestorType={x:Type ms:DiagramSurface}}" />
            <Binding Path="Extent" RelativeSource="{RelativeSource Self}" />
          </MultiBinding>
        </f:DiagramScrollViewer.Background>
        <f:AutoSizeCanvas IsItemsHost="True" Name="Canvas" />
      </f:DiagramScrollViewer>

The AllowInfiniteScrolling is bound to the diagramsurface, I write a style for DiagramScrollViewer in my project, I don't know if this the reason why it does not work, should I bind the value in the style, how can I do it? Anything else I should pay attention if I have my own style for DiagramScrollViewer ?

Thanks

Hello Jzhou

Yes, you'll want to bind AllowInfiniteScrolling of the DiagramScrollViewer to the DiagramSurface in your custom style. You should be able to do this in the same way as the code you posted. As long as you are setting up any bindings in your custom style to be the same as the generic style for the features you want to use, you'll be fine. If you need any help, let me know along with your custom styling code.

-Jason Fauchelle