Ruler Scrolling with the RadDiagram

2 posts, 0 answers
  1. Yogendra
    Yogendra avatar
    17 posts
    Member since:
    Aug 2013

    Posted 26 Sep 2013 Link to this post


    I am working on the diagram control. I have added the RadDiagramRuler control to it. Both of 
    these control are inside a scrollviewer.
    Th problem with this approach is, when the scrollviewer is scrolled vertically the top ruler hides 
    and when scrolled  horizontally the Left most ruler hides.
    What I want is to let all the rulers, top left right and bottom displays otherwise the scroll. 
    If I place the ruler outside of the scroll bar, the value to rulers don't updates on scrolling.

    Please suggest something. Thanks.

  2. Pavel R. Pavlov
    Pavel R. Pavlov avatar
    1165 posts

    Posted 01 Oct 2013 Link to this post


    The reported behavior is expected when you host both controls in a ScrollViewer component. You actually are scrolling both controls.

    Please note that there is straightforward way to achieve your requirement. You can use attached properties to visualize scroll bars inside the RadDiagram.
    Furthermore, the RadDiagramRuller component will properly handle the scrolling.

    Please try using this snippet and let us know if it works in your particular scenario:

    <Grid x:Name="LayoutRoot" Background="White">
            <RowDefinition Height="20" />
            <RowDefinition Height="*" />
            <ColumnDefinition Width="20"/>
            <ColumnDefinition Width="*"/>
        <telerik:RadDiagramRuler Diagram="{Binding ElementName=xDiagram}" Placement="Top" Grid.Column="1" />
        <telerik:RadDiagramRuler Diagram="{Binding ElementName=xDiagram}" Placement="Left" Grid.Row="1" />
        <telerik:RadDiagram x:Name="xDiagram"
            <telerik:RadDiagramShape x:Name="shape1"
                                     Content="Shape 1"
                                     Position="20,20" />
            <telerik:RadDiagramShape x:Name="shape2"
                                     Content="Shape 2"
                                     Position="520,520" />
            <telerik:RadDiagramConnection Source="{Binding ElementName=shape1}" Target="{Binding ElementName=shape2}" />
    I hope this clarifies your concerns.

    Pavel R. Pavlov
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. DevCraft R3 2016 release webinar banner
Back to Top