Hide ScrollBars

Hi,
I tried to force hide the scrollbars of the Diagram even if there is content outside the visible area.
I used the following code:

ScrollViewer.HorizontalScrollBarVisibility="Hidden"
ScrollViewer.VerticalScrollBarVisibility="Hidden"

but the horizontalbar still appears.

It might be best to specify the Diagram.Template, a ControlTemplate, to one without scrollbars. See the Generic.xaml file for the definition of the default ControlTemplate.

Can I do this on runtime via binding?

Yes, I don’t see why not.

I get this error:
Specified element is already the logical child of another element. Disconnect it first

Which, in my eyes, is clear cause the binding changes the DiagramPanel.

Do you have some code that works?

Why don’t you specify a Diagram.Template that includes the Binding(s) that you want?

I don’t know what you want, but here’s a ControlTemplate that doesn’t use ScrollViewer:

    <ControlTemplate x:Key="DiagramTemplate1">
      <Border Background="{TemplateBinding Background}"
              BorderBrush="{TemplateBinding BorderBrush}"
              BorderThickness="{TemplateBinding BorderThickness}">
        <go:DiagramPanel x:Name="Panel"
                         Padding="{TemplateBinding Padding}"
                         HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                         VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
      </Border>
    </ControlTemplate>

I don’t understand.
I thought I could do it like this:

<go:Diagram x:Name="MainDiagram"
            NodeTemplateDictionary="{StaticResource NodeTemplates}"
            GroupTemplateDictionary="{StaticResource NodeTemplates}"
            HorizontalContentAlignment="Stretch" 
            VerticalContentAlignment="Stretch"
            IsManipulationEnabled="True"
            InitialScale="1.0"
            InitialPosition="0 0"
            AllowClipboard="{Binding EditMode}"
            AllowCopy="{Binding EditMode}"
            AllowMove="{Binding EditMode}"
            AllowDrop="{Binding EditMode}"
            AllowEdit="{Binding EditMode}"
            AllowDelete="{Binding EditMode}"
            GridVisible="{Binding EditMode}"
            GridSnapEnabled="{Binding SnapMode}"
            GridSnapCellSize="5 5"
            Padding="0"
            Background="{Binding Path=BackgroundBrush}"
            ExternalObjectsDropped="Diagram_ExternalObjectsDropped">
    <go:Diagram.GridPattern>
        <go:GridPattern CellSize="10 10">
            <Path Stroke="LightGray" StrokeThickness="0.2" go:GridPattern.Figure="HorizontalLine" />
            <Path Stroke="LightGray" StrokeThickness="0.2" go:GridPattern.Figure="VerticalLine" />
            <Path Stroke="White" StrokeThickness="0.2" go:GridPattern.Figure="HorizontalLine" go:GridPattern.Interval="5" />
            <Path Stroke="White" StrokeThickness="0.2" go:GridPattern.Figure="VerticalLine" go:GridPattern.Interval="5" />
            <Path Stroke="Black" StrokeThickness="0.3" go:GridPattern.Figure="HorizontalLine" go:GridPattern.Interval="10" />
            <Path Stroke="Black" StrokeThickness="0.3" go:GridPattern.Figure="VerticalLine" go:GridPattern.Interval="10" />
        </go:GridPattern>
    </go:Diagram.GridPattern>
    <go:Node >
        <Line go:Node.Location="0 0" X1="-20" Y1="0" X2="100" Y2="0" Style="{StaticResource StyleLine}" />
    </go:Node>
    <go:Node>
        <Path go:Node.Location="100 -8" Data="M 0 16 L 16 8 L 0 0 Z" Style="{StaticResource StylePath}"/>
    </go:Node>
    <go:Node >
        <Line go:Node.Location="0 0" X1="0" Y1="-20" X2="0" Y2="100" Style="{StaticResource StyleLine}" />
    </go:Node>
    <go:Node >
        <Path go:Node.Location="-8 100" Data="M 0 16 L 16 8 L 0 0 Z" Style="{StaticResource StylePath}" >
            <Path.LayoutTransform>
                <dxci:RotateTransform Angle="90"></dxci:RotateTransform>
            </Path.LayoutTransform>
        </Path>
    </go:Node>
    <go:Diagram.Model>
        <classes:DiagramModel />
    </go:Diagram.Model>
    <go:Diagram.DraggingTool>
        <diagramHelper:CustomDraggingTool />
    </go:Diagram.DraggingTool>
    <!--<go:Diagram.DragSelectingTool>
        <diagramHelper:RealTimeDragSelectingTool />
    </go:Diagram.DragSelectingTool>-->
    <go:Diagram.DragSelectingTool>
        <diagramHelper:CustomDragSelectingTool />
    </go:Diagram.DragSelectingTool>
    <go:Diagram.ClickSelectingTool>
        <diagramHelper:CustomClickSelectingTool />
    </go:Diagram.ClickSelectingTool>
    <go:Diagram.CommandHandler>
        <diagramHelper:CustomCommandHandler />
    </go:Diagram.CommandHandler>
    <go:Diagram.ResizingTool>
        <diagramHelper:CustomResizingTool />
    </go:Diagram.ResizingTool>
    <go:Diagram.RotatingTool>
        <diagramHelper:CustomRotatingTool />
    </go:Diagram.RotatingTool>
    <dxmvvm:Interaction.Behaviors>
        <dxmvvm:EventToCommand EventName="Loaded" Command="{Binding LoadedCommand}" />
        <dxmvvm:EventToCommand EventName="PreviewMouseDown" Command="{Binding MouseDownCommand}"
                                PassEventArgsToCommand="True" />
        <dxmvvm:EventToCommand EventName="PreviewMouseUp" Command="{Binding MouseUpCommand}" PassEventArgsToCommand="True" />
        <dxmvvm:EventToCommand EventName="SelectionChanged" Command="{Binding SelectionChangedCommand}"
                                PassEventArgsToCommand="True" />
        <dxmvvm:EventToCommand EventName="PreviewKeyDown" Command="{Binding KeyDownCommand}" PassEventArgsToCommand="True" />
        <service:GetControlService />
    </dxmvvm:Interaction.Behaviors>
    <go:Diagram.Resources>
        <Style TargetType="ScrollViewer">
            <Setter Property="dx:ScrollBarExtensions.HandlesDefaultMouseScrolling" Value="False" />
        </Style>
    </go:Diagram.Resources>
    <go:Diagram.Style>
        <Style TargetType="go:Diagram">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Path=EditMode}" Value="True">
                    <Setter Property="ContextMenu" Value="{StaticResource DiagramContextMenu}"></Setter>
                </DataTrigger>
                <DataTrigger Binding="{Binding Path=EditMode}" Value="False">
                    <Setter Property="ContextMenu" Value="{x:Null}"></Setter>
                </DataTrigger>
                <!-- ----------------------  Here is the change of the template --------------------------------------------- -->
                <DataTrigger Binding="{Binding Scrollable}" Value="False">
                    <Setter Property="Template" Value="{StaticResource DiagramWithoutScrollBarsTemplate}" />
                </DataTrigger>
                <!-- --------------------------------------------------------------------------------------------------------- -->
            </Style.Triggers>
        </Style>
    </go:Diagram.Style>
</go:Diagram>

Why not just set the Template to a ControlTemplate that includes the Binding on your Scrollable property?

If I change the template to one which has no scrollviewer I don’t need this scrollable property.
I think I don’t understand what you mean…

And I know I don’t understand what you want.

Your original post in this topic seemed to imply that you never wanted any scrollbars, so a ControlTemplate that didn’t include a ScrollViewer seemed to be the sensible answer.

But then you asked about deciding this at runtime. Apparently it doesn’t work to change the Template dynamically – and even if it did, it would be terribly inefficient to have to recreate everything. So I was suggesting using a ControlTemplate whose ScrollViewer had HorizontalScrollBarVisibility and VerticalScrollBarVisibility bound to some property or expression of yours.

  <ControlTemplate x:Key="..." TargetType="go:Diagram">
    <Border x:Name="Border"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}">
      <ScrollViewer HorizontalScrollBarVisibility="{Binding ... }"
                    VerticalScrollBarVisibility="{Binding ... }"
                    CanContentScroll="True">
        <go:DiagramPanel x:Name="Panel"
                         Stretch="{TemplateBinding Stretch}"
                         Padding="{TemplateBinding Padding}"
                         HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                         VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
      </ScrollViewer>
    </Border>
  </ControlTemplate>

Now I got you…

I’m sure it is the different language. I thought you suggest to make a template without ScrollViewer.

This sounds good - I will try this.

It working!
Thank you, and excuse me for my stupidity.