custom connector shape

4 posts, 0 answers
  1. al
    al avatar
    15 posts
    Member since:
    Feb 2016

    Posted 17 Aug Link to this post

    hi dear supporters,

    I need to change the shape of connectors of a shape to a custom shape that is a jpg or other image formats.

    how can I do that?

  2. Dinko
    Dinko avatar
    202 posts

    Posted 22 Aug Link to this post


    You can create a custom style with TargetType="telerik:RadDiagramConnector" and set it to the ConnectorStyle property of the RadDiagramShape. Then you can override the default template of the connector by creating custom ControlTemplate and set it to the Template property of the RadDiagramConnector. Take a look at the following code.
        <ControlTemplate x:Key="connectorTemplate" TargetType="telerik:RadDiagramConnector">
            <Image Source="/MyProject;component/Images/MyPictureName.jpg"  Stretch="UniformToFill"/>
        <Style x:Name="customImageConnector" TargetType="telerik:RadDiagramConnector">
            <Setter Property="Template" Value="{StaticResource connectorTemplate}"/>
            <telerik:RadDiagramShape x:Name="Shape1" Position="100,300" Content="Shape1" IsSelected="True" ConnectorStyle="{Binding customImageConnector}" />

    Hope this information is useful.

    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  3. UI for WPF is Visual Studio 2017 Ready
  4. al
    al avatar
    15 posts
    Member since:
    Feb 2016

    Posted 22 Aug in reply to Dinko Link to this post

    hi and thank you.

    i need to do all of it in the code behind not xaml and resources.

    can you provide me a sample code for that?

    Best regards,

  5. al
    al avatar
    15 posts
    Member since:
    Feb 2016

    Posted 22 Aug Link to this post

    thank you Dinko. it worked.

    i defined the rosourve in XAML (and changed the name to key in x:Name="customImageConnector") and then i get the resource by the below command:

    Style s=FindResources("customImageConnector") as Style;


    thank you,

Back to Top