Diagram selecting wrong connector or not at all (intermittent)

6 posts, 1 answers
  1. Chris
    Chris avatar
    10 posts
    Member since:
    Aug 2010

    Posted 21 Aug Link to this post

    Hi,

    I have an issue of when I click on a connector with text block content, the diagram control either selects the incorrect connector or does not select anything at all.  It appears a bit random but is quite repeatable.

    I have attached a video of the first scenario: https://www.dropbox.com/s/i7wwxon7iqy6hr1/Telerik%20Diagram%20selection%20issue.mp4?dl=0

    (Download video as the video may lose video quality)

    In this video the middle connector is already selected.  I then click the connector on the far left and you will see the connector on the far right is selected instead.

    Here is the sample code:

    <Window x:Class="TelerikWpfApp1.MainWindow"
                    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                    Title="MainWindow" Height="800" Width="800">
        <Grid>
            <telerik:RadDiagram>
                <telerik:RadDiagramConnection
                    StartPoint="100,100"
                    EndPoint="100, 500"
                    ConnectionType="Polyline"
                    SourceConnectorPosition="Auto"
                    StrokeThickness="2"  
                    ToolTipService.IsEnabled="True"
                    SourceCapType="Arrow1"
                    TargetCapType="Arrow2"
                    ZIndex="4">
                    <telerik:RadDiagramConnection.Content>
                        <TextBlock Text="AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"     
                                   Background="Yellow"
                               FontFamily="Arial"
                               FontSize="10"
                               Visibility="Visible"
                               FontWeight="Normal"                          
                               RenderTransformOrigin="0.5, 0.5"
                               Padding="0, 15, 0, 0">
                            <TextBlock.RenderTransform>
                                <RotateTransform Angle="90"/>
                            </TextBlock.RenderTransform>
                        </TextBlock>
                    </telerik:RadDiagramConnection.Content>
                </telerik:RadDiagramConnection>
                <telerik:RadDiagramConnection
                    StartPoint="140,100"
                    EndPoint="140, 500"
                    ConnectionType="Polyline"
                    SourceConnectorPosition="Auto"
                    StrokeThickness="2"  
                    ToolTipService.IsEnabled="True"
                    SourceCapType="Arrow1"
                    TargetCapType="Arrow2"
                    ZIndex="4">
                    <telerik:RadDiagramConnection.Content>
                        <TextBlock Text="BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB"                          
                               Background="Yellow"
                                   FontFamily="Arial"
                               FontSize="10"
                               Visibility="Visible"
                               FontWeight="Normal"                          
                               RenderTransformOrigin="0.5, 0.5"
                               Padding="0, 15, 0, 0">
                            <TextBlock.RenderTransform>
                                <RotateTransform Angle="90"/>
                            </TextBlock.RenderTransform>
                        </TextBlock>
                    </telerik:RadDiagramConnection.Content>
                </telerik:RadDiagramConnection>
                <telerik:RadDiagramConnection
                    StartPoint="180,100"
                    EndPoint="180, 500"
                    ConnectionType="Polyline"
                    SourceConnectorPosition="Auto"
                    StrokeThickness="2"  
                    ToolTipService.IsEnabled="True"
                    SourceCapType="Arrow1"
                    TargetCapType="Arrow2"
                    ZIndex="4">
                    <telerik:RadDiagramConnection.Content>
                        <TextBlock Text="CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC"                          
                               Background="Yellow"
                                   FontFamily="Arial"
                               FontSize="10"
                               Visibility="Visible"
                               FontWeight="Normal"                          
                               RenderTransformOrigin="0.5, 0.5"
                               Padding="0, 15, 0, 0">
                            <TextBlock.RenderTransform>
                                <RotateTransform Angle="90"/>
                            </TextBlock.RenderTransform>
                        </TextBlock>
                    </telerik:RadDiagramConnection.Content>
                </telerik:RadDiagramConnection>
            </telerik:RadDiagram>
        </Grid>
    </Window>

     

    Is there a workaround for this?

     

     


  2. Chris
    Chris avatar
    10 posts
    Member since:
    Aug 2010

    Posted 21 Aug in reply to Chris Link to this post

    Forgot to mention I am using Telerik WPF version 2016.2.613.45
  3. UI for WPF is Visual Studio 2017 Ready
  4. Chris
    Chris avatar
    10 posts
    Member since:
    Aug 2010

    Posted 21 Aug Link to this post

    Forgot to mention, I am using Telerik (WPF) 2016.2.613.45
  5. Answer
    Kiril Vandov
    Admin
    Kiril Vandov avatar
    324 posts

    Posted 22 Aug Link to this post

    Hello Chris,

    This is not an issue connected to the RadDiagram, let me explain why is that behavior happening. In the provided sample code you are applying RenderTransform to the Content of the RadDiagramConnections, when you apply RenderTransform, which is a transform that modifies the appearance of the element but is applied after the layout pass is complete. By using the RenderTransform property instead of the LayoutTransform property, you can obtain performance benefits. That is why the TextBlock is only visually dawned to a different slot but you can still interact with it on its original measured position.
    That is why you should use LayoutTransform in such situations instead of RenderTransform. You can find more detailed information on how to use the two transformation in this help article.

    I hope this information helps.

    Kind regards,
    Kiril Vandov
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  6. Chris
    Chris avatar
    10 posts
    Member since:
    Aug 2010

    Posted 22 Aug Link to this post

    Thankyou so much! Looks like I need a WPF refresher.
  7. Chris
    Chris avatar
    10 posts
    Member since:
    Aug 2010

    Posted 22 Aug in reply to Kiril Vandov Link to this post

    Thankyou so much! Looks like I need a WPF refresher.
Back to Top
UI for WPF is Visual Studio 2017 Ready