Hello.

Ive encountered an isssue with PdfExporter class. In my case i use custom WPF user control as a template for some of my diagram's nodes. Then using DiagramNodeAdapter i add those costrols into nodes collection of my diagram.

My template is quite simple - some corners rounded, StackPanel nested in Grid, some Buttons and a ComboBox.

On diagram everything looks nice, but when i try to export it into PDF file using Export method of PdfExporter class well... the result is not good

Controls such as Buttons etc... are placed one on each other and it seems that even container's properties such as Margin or CornerRadius are not working. Well its a big mess. Is this a know issue and will this be somehow fixed?

Thx for help.

Well my template WPF user control for diagram's node objects isn't much complicated and was made in testing purposes only. It looks like this:

<UserControl x:Class="MindfusionTesting.Templates.ObjectNodeTemplate"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" ;   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Border BorderBrush="#FF000000" BorderThickness="1,1,1,1" CornerRadius="8,8,8,8">
       <Grid>
           <Border Name="mask" Background="Yellow" CornerRadius="7" >
           </Border>
           <StackPanel Orientation="Vertical">
               <TextBlock HorizontalAlignment="Left" VerticalAlignment="Top" Text="{Binding Path=Name}" Margin="5,5,5,5"  />
               <ComboBox></ComboBox>
               <Button>test button</Button>
           </StackPanel>
       </Grid>
    </Border>
</UserControl>


Ok, now after creating proper instance of my control I'm doing something like this:

DiagramNodeAdapter dna = new DiagramNodeAdapter(diagram, myControl);
diagram.Nodes.Add(dna);

I think the problem in exporting mechanism may be caused by StackPanel but as ive wrote before CornerRadius or Margin properties are not considered in it as well.

Or am I doing something wrong? 

Thanks, our developer will debug this in the next few days.

Stoyan

Hi Stoyan,

the exported PDF file looks muuuuch better now and child controls are positioned correctly but i found something else isnt included in WPF-Visual-tree to PDF translation layer.

After ive started this topic, my custom node template got more complicated. Ive tried variuos visual upgrades onto it and its structure grown up a bit.

Heres the template:

<UserControl x:Class="MindfusionTesting.Templates.ObjectNodeTemplate"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
>
<Border VerticalAlignment="Top" HorizontalAlignment="Left" Name="brdMain" CornerRadius="8,8,8,8">
<Grid VerticalAlignment="Top" HorizontalAlignment="Left">
<Border Name="mask" Background="Black" CornerRadius="6">
</Border>
<Rectangle Name="rectBackground">
<Rectangle.OpacityMask>
<VisualBrush Visual="{Binding ElementName=mask}"/>
</Rectangle.OpacityMask>
</Rectangle>
<StackPanel Name="spMain" Orientation="Horizontal" VerticalAlignment="Top" HorizontalAlignment="Left">
<Grid Name="gImgMain" VerticalAlignment="Top" Margin="5,5,0,0">
<Border Name="maskImage" Background="White" CornerRadius="6" >
</Border>
<Rectangle>
<Rectangle.OpacityMask>
<VisualBrush Visual="{Binding ElementName=maskImage}"/>
</Rectangle.OpacityMask>
</Rectangle>
<Image MaxHeight="40" MaxWidth="40" Name="imgMain" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="5"></Image>
</Grid>
<StackPanel Orientation="Vertical" Margin="10" VerticalAlignment="Top">
<TextBlock Name="tbxName" Text="{Binding Path=Name}" TextWrapping="Wrap" Foreground="Orange" HorizontalAlignment="Center" FontWeight="Bold" FontSize="12"
VerticalAlignment="Top" Margin="10,0,10,10" MaxWidth="150"></TextBlock>
<Expander HorizontalAlignment="Left" VerticalAlignment="Top" Header="More info..." Cursor="Hand" Foreground="Orange" FontWeight="Bold" FontSize="8"
Name="expMain" ExpandDirection="Down" IsExpanded="False" >
<Grid VerticalAlignment="Top" Cursor="SizeAll">
<Border Name="maskExpander" Background="Orange" CornerRadius="0,0,6,6" >
</Border>
<Rectangle Name="rectMoreInfo">
<Rectangle.OpacityMask>
<VisualBrush Visual="{Binding ElementName=maskExpander}"/>
</Rectangle.OpacityMask>
</Rectangle>
<StackPanel Orientation="Vertical" Margin="5" >
<StackPanel Orientation="Horizontal">
<TextBlock Text="Type:" Foreground="Black" HorizontalAlignment="Left" FontWeight="Normal"
VerticalAlignment="Top" Margin="0,0,10,0"></TextBlock>
<TextBlock Text="{Binding Path=Type}" TextWrapping="Wrap" Foreground="Black" HorizontalAlignment="Left" FontWeight="Bold"
VerticalAlignment="Top"></TextBlock>
</StackPanel>
</StackPanel>
</Grid>
</Expander>
</StackPanel>

</StackPanel>
</Grid>
</Border>
</UserControl>


The main problem now is with Rectangle.OpacityMask ("rectBackground" i.e.) i suppose. Ill send You an email with how the diagram originally looks (exported into graphical file) and Exported PDF file to compare.

Besides when using LinearGradientBrush as Rectangle.Fill property when i use more than 2 gradient stops the gradient is wisible as 1 color in PDF file.

i.e. I use:

<LinearGradientBrush x:Key="lgbDefault" StartPoint="0,0" EndPoint="0,1" >
<GradientStop Color="Gray" Offset="0.2"/>
<GradientStop Color="Black" Offset="0.85"/>
<GradientStop Color="Gray" Offset="1"/>
</LinearGradientBrush>

as a brush for default nodes and assign it into Rectangle programmatically from resources
(this one dont work with PDF export), but for some nodes i use other brush like:

<LinearGradientBrush x:Key="lgbRoot" StartPoint="0,0" EndPoint="0,1" >
<GradientStop Color="Red" Offset="0.2"/>
<GradientStop Color="Black" Offset="0.85"/>
</LinearGradientBrush>

and this one is exported correctly

I appreciate work of all You guys

Btw, will this fix (meant all this PDF exporting stuff) be included in the new full release?

Best regards,
rafaello

Hi Stoyan,

Generally my point of using:

<Border Name="mask" Background="Black" CornerRadius="6">
</Border>
<Rectangle Name="rectBackground">
<Rectangle.OpacityMask>
      <VisualBrush Visual="{Binding ElementName=mask}"/>
</Rectangle.OpacityMask>
</Rectangle>

nested in grid was to get rounded corners by using Border's CornerRadius property. Then I use this Border as a Opacity mask for rectangle with gradient fill.

In TIF file ive sent You we can see that corners of node (defacto rectangle in grid) are rounded, and this situation doesnt took place in exported PDF that ive attached.

This is not caused by CornerRadius property because in exported PDF file some nodes have additional border around them with this property set, and the result is ok. Therefore my first thought was theres something wrong with OpacityMask.

Best regards,
rafaello

Hello Stoyan,

RadiusX and RadiusY properties fixes problem (PDF file looks exactly like it should) but this works only in case if i wanna all corners rounded

Thats why i used border as opacity mask - to have control over specific corner (i.e. I want to round only the lower corners of my rectangle instead of all of them).

Well... its not that important for me if fixing this would take much work, I can use RadiusX and RadiusY properties. More important for me would be fixing the gradients problem 

Best regards,
rafaello