RadDiagram ExportToImage gets focused state also in the image

7 posts, 0 answers
  1. Aakansha
    Aakansha avatar
    20 posts
    Member since:
    Sep 2014

    Posted 26 Sep 2014 Link to this post

    I am using Telerik Ui for wpf in which I am using Telerik RadDiagram.I am trying to create many shapes on the WPF and export that to the image. I am able to export that to the image. If on the WPF application, my one of the shapes is selected and I click on save, I get that text box as selected even in the image. The image shown in abcde.png is getting exported but I want the image to be like abcdef.png even if the user has the focus on the node before doing a click on save.

    I noticed that if i do a left-click on the screen of WPF where there are no diagrams, the selected element is no more selected and exporttoimage function gets me the correct image. But when I programatically generated a left mouse click on screen and then called ExportToImage function, this doesnt get me the correct image. Is there any way in which I am can enable ExportToImage function to do this??



  2. Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1183 posts

    Posted 29 Sep 2014 Link to this post

    Hi,

    The export to image feature actually captures the screen and exports everything that you can see. This is why exporting the selection of the shapes is expected. In order to export the image that you need, you should clear the selection of the RadDiagram.

    This can be done by binding the IsSelected item of the RadDiagramShape control to custom property exposed by your ViewModel. This way you will be able to control the selection of the RadDiagram through code.

    <Style TargetType="telerik:RadDiagramShape">
        <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}"/>
    </Style>

    Regards,
    Pavel R. Pavlov
    Telerik
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  3. UI for WPF is Visual Studio 2017 Ready
  4. Aakansha
    Aakansha avatar
    20 posts
    Member since:
    Sep 2014

    Posted 29 Sep 2014 in reply to Pavel R. Pavlov Link to this post

    Hello Pavel,

    I was not able to implement what you told me in the above post.

    I also found one more person having similar issue. The link is http://www.telerik.com/forums/wpf-diagram-exporttoimage-to-png-has-shape-connectors-visible-on-selected-shapes . I also implemented what ever is told in this blog post. My code still didnt work.

    So I tried another approach where I reload the XML produced using Save method again. In XML produced, its not stored what all nodes are selected. And once the reloading is done, I call my ExportToImage function but this is cutting my image by around 100px in x and y direction. I am not able to understand the reason for this. I am attaching images and code snippets for the above implemented method by me.                                                                                                                                                                                                                                     Code 1: Initial code and Image1 attached as the output -  
    File.WriteAllText("C:\Map1.xml, this.diagram.Save());
      
     using (var stream = File.Open("C:\Map1.png", FileMode.Create))
      {
              this.diagram.ExportToImage(stream);
      }


    After modifications to get the correct image, I modified the code as below and Image2 is the output
    File.WriteAllText("C:\Map1.xml, this.diagram.Save());
     
    var xml = this.diagram.Save();
    if (!string.IsNullOrEmpty(xml))
    {
             this.diagram.Load(xml);
     }
      using (var stream = File.Open("C:\Map1.png", FileMode.Create))
      {
              this.diagram.ExportToImage(stream);
      }





  5. Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1183 posts

    Posted 01 Oct 2014 Link to this post

    Hello,

    The approach that I previously suggested is demonstrated in the attached project. Please take a look at it and let me know if you need any further assistance.

    Regards,
    Pavel R. Pavlov
    Telerik
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  6. Aakansha
    Aakansha avatar
    20 posts
    Member since:
    Sep 2014

    Posted 26 Nov 2014 in reply to Pavel R. Pavlov Link to this post

    Hello Pavel, I used the method in the above project and used IsSelected as binding. Hence now my selected node are getting unselected. I noticed that if I dnt use Dispatcher for ExportToImage method, I will still get selected node. Hence, I am using Dispatcher.BeginInvoke. In the sample application above, using this we are getting image but in my project Image is not getting produced. I am not able to understand reason behind this.

    Any help on this??
  7. Aakansha
    Aakansha avatar
    20 posts
    Member since:
    Sep 2014

    Posted 26 Nov 2014 in reply to Pavel R. Pavlov Link to this post

    As I have to close the WPF application, I modified the project code as

    Dispatcher.BeginInvoke(new Action(() =>
    {
        using (var stream = File.Open(@"c:\tmp\xDiagram.png", FileMode.Create))
        {
            xDiagram.ExportToImage(stream, margin: new Thickness(10));
        }
    }),DispatcherPriority.Send);
    this.Close();


    Now, even the project attached...I dnt get the image
  8. Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1183 posts

    Posted 01 Dec 2014 Link to this post

    Hi Aakansha,

    The Dispatcher with priority set to ApplicationIdle or SystemIdle is required because you actually change the visual state of the shapes when you unselect them. In order to apply the new state the RadDiagram needs time. The Dispatcher ensures that the exporting will be done when the new visual change is already applied.

    I confirm that if the DispatcherPriority is set to Send the exporting is done before the visual states are applied. Are you saying that in your application the exporting is done before applying the unselected visual change even if you set the DispatcherPriority to ApplicationIdle?

    Regards,
    Pavel R. Pavlov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for WPF is Visual Studio 2017 Ready