AndreasEnscape
Topic Author
Posts: 22
Joined: 01 Aug 2017, 07:37

Rendering errors for nested objects

26 Oct 2017, 10:53

Aiming at implementing an overlay, I am comfronted with what like a rendering problem. I counterchecked with a WPF-Implementation where there are no such flaws, suggesting that it is not an xaml/code behind problem.

The following snippets however are copied here for reference.
Short idea and problem description: Within a grid, enable an help overlay (basically a button that stretches over the complete grid). When this overlay is visible (opacity > 0 and < 1 !), sporadically there are artifacts, see image renderingProblem02.png, th darker one. In our case, this is a listbox with elements in it. The problem can be rather easily reproduced by changing the window with. The artifacts are both the line and disturbances in the listbox. The reason for those artifacts seem to be, that the listbox, when turning overlay on with the top left button. is shifted to the right one pixel. Seems to be some rounding error, I guess. This shift produces the artifacts. renderingProblem01.png shows the situation where the overlay is off, no rendering issues here.

Snippet 1 shows overlay and listbox call in xaml.
<ViewExpander x:Name="viewExpander" DataContext="{Binding ViewExpanderViewModel}" 
                                       Grid.Column="2" Grid.Row="1" Grid.RowSpan="3" HorizontalAlignment="Right" Grid.ZIndex="1"/>
                                       
                                        <Button DataContext="{Binding ViewExpanderViewModel}" Command="{Binding Path=DeactivateHelpOverlayCommand}" Grid.ZIndex="0"
            Grid.RowSpan="4" Grid.ColumnSpan="3" Visibility="Hidden" Background="{StaticResource HelpOverlayBackgroundColor}">
        <Button.Style>
            <Style>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Path=HelpActive}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard FillBehavior="Stop">
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{x:Static Visibility.Visible}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0.6" Duration="0:0:0.3"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Path=HelpActive}" Value="False">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard FillBehavior="Stop">
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0.0" Duration="0:0:0.3"/>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0:0:0.3" Value="{x:Static Visibility.Hidden}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Button.Style>

    </Button>
Snippet 2 is the respective part of the listbox/expander itself (please ignore the not recommended Canvas implementation for now...):
 <Canvas x:Name="ViewExpanderMain" Width="{StaticResource ViewExpanderHelpWidth}" Height="{StaticResource ViewExpanderHelpHeight}" 
            Visibility="{Binding ElementName=ViewsListBox, Path=HasItems, Converter={StaticResource BoolToVisConv}}">
        <Canvas.RenderTransform>
            <TranslateTransform>
                <TranslateTransform.Y>-60</TranslateTransform.Y>
            </TranslateTransform>
        </Canvas.RenderTransform>

        <Canvas x:Name="ScrollCanvas" Background="Transparent" Canvas.ZIndex="50"
                Canvas.Top="90" Canvas.Right="0" Width="180" Height="530">
            <Canvas.RenderTransform>
                <TranslateTransform>
                    <TranslateTransform.X>160</TranslateTransform.X>
                </TranslateTransform>
            </Canvas.RenderTransform>
            <Path Opacity="0.8" Fill="AntiqueWhite" StrokeThickness="0" StrokeDashCap="Round" Data="m0,0 v120 l20,30 v380 h162 v-530"/>
            <ToggleButton x:Name="InfoButton" Canvas.Top="11" Canvas.Left="3" Width="16" Height="16" Background="Transparent"
                          IsChecked="{Binding Path=HelpActive, Mode=TwoWay}"/>
            <ToggleButton x:Name="PinButton" Canvas.Top="29" Canvas.Left="3" Width="16" Height="16"/>
            <StackPanel Canvas.Left="22" Canvas.Top="10" Width="160" Height="518">
                <Button x:Name="PageUpButton" Height="16" Style="{StaticResource ScrollButtonStyle}" Click="PageUpButton_OnClick">
                    <Path Data="M0,5 l10,-3 l10,3" StrokeThickness="1" Stroke="White"/>
                </Button>
                <ListBox x:Name="ViewsListBox" ScrollViewer.VerticalScrollBarVisibility="Hidden" Height="486" BorderThickness="0"
                         ItemsSource="{Binding Path=ViewListEntries, Mode=OneWay}" Background="Gray">
                    <ListBox.ItemContainerStyle>
                        <Style TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
                            <Setter Property="Padding" Value="0"/>
                            <Setter Property="BorderThickness" Value="0"/>
                            <Setter Property="Margin" Value="0,4,0,4"/>
                        </Style>
                    </ListBox.ItemContainerStyle>
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <Button Width="160" Height="90" Style="{StaticResource ViewImageButton}">
                                <Canvas>
                                    <Image Source="{Binding Path=ViewTexture}" Width="160" Height="90" />
                                    <Border Opacity="0.8" Background="Black" Canvas.Top="70" Canvas.Left="30" Width="130" Height="20" CornerRadius="10,0,0,0"/>
                                    <TextBlock Canvas.Top="73" Canvas.Left="40" Width="110" Height="25" Foreground="White" FontSize="13" FontWeight="ExtraLight" Text="{Binding ViewName}" TextTrimming="CharacterEllipsis"/>
                                </Canvas>
                            </Button>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
                <Button x:Name="PageDownButton" Height="16" Style="{StaticResource ScrollButtonStyle}" Click="PageDownButton_OnClick">
                    <Path Data="M0,0 l10,3 l10,-3" StrokeThickness="1" Stroke="White"/>
                </Button>
            </StackPanel>
        </Canvas>
    </Canvas>
Anyone with similar experiences? As WPF does not have this issues, I consider filing a bugreport. But I wanted to post the problem beforehand.

Best regards,
Andy
Attachments
renderingProblem02.PNG
renderingProblem01.PNG
 
nokola
Posts: 188
Joined: 10 Mar 2015, 05:29

Re: Rendering errors for nested objects

28 Oct 2017, 02:59

I see similar artifacts in my app, haven't been able to pinpoint them yet. Here's a sample with a gray rectangle (with the clock) rendered on top of another gray rectangle (the background.) I occasionally see a single-pixel artifact line, haven't been able to figure out a simple repro yet.
OnePixelRenderIssue.png
OnePixelRenderIssue.png (70.42 KiB) Viewed 1934 times
 
User avatar
sfernandez
Site Admin
Posts: 2991
Joined: 22 Dec 2011, 19:20

Re: Rendering errors for nested objects

30 Oct 2017, 13:05

It seems a bug in the rendering of opacity groups, parts of the UI tree using UIElement.Opacity.
Could you please report it in our bugtracker?

By the way, if you could use Brush.Opacity or color Alpha channel in any of these cases, apart from workaround this bug, it would be a lot more efficient.
 
AndreasEnscape
Topic Author
Posts: 22
Joined: 01 Aug 2017, 07:37

Re: Rendering errors for nested objects

02 Nov 2017, 08:20

Bugreport is filed.
 
User avatar
jsantos
Site Admin
Posts: 3918
Joined: 20 Jan 2012, 17:18
Contact:

Re: Rendering errors for nested objects

02 Nov 2017, 18:01

Thanks for the report! We will work on this soon. Anyway, remember the recommendation about trying to use Brush.Opacity or color Alpha channel whenever possible to avoid global opacity. Global opacity always requires an intermediate render to texture. Performance is always better if it can be avoided, not always possible though.
 
Jan
Posts: 5
Joined: 23 May 2017, 17:09

Re: Rendering errors for nested objects

17 Nov 2017, 10:20

To let you guys know, we could fix this issue simply by switching from half float UVs to 32bit UVs:
void GLRenderDevice::FillCaps()
{
    m_caps = {};
    ...
    //! @note we suppress half float uv usage due to precision issues!
    m_caps.halfFloatUV = false; // IsSupported(Extension::ARB_half_float_vertex) || IsSupported(Extension::OES_vertex_half_float), 
    ...
}
 
nokola
Posts: 188
Joined: 10 Mar 2015, 05:29

Re: Rendering errors for nested objects

17 Nov 2017, 17:30

That's good news and the right fix too! I looked for FillCaps() and couldn't find it in my Unity project. Is there a way to set noesis today (without waiting for next update) to 32-bit UV and try?
 
nokola
Posts: 188
Joined: 10 Mar 2015, 05:29

Re: Rendering errors for nested objects

17 Nov 2017, 17:31

Bugreport is filed.
Thanks AndreasEnscape - do you mind pasting the link to the report here for reference?
 
User avatar
jsantos
Site Admin
Posts: 3918
Joined: 20 Jan 2012, 17:18
Contact:

Re: Rendering errors for nested objects

17 Nov 2017, 17:53

To let you guys know, we could fix this issue simply by switching from half float UVs to 32bit UVs:
Wow, this is a great discovery! Thanks a lot for reporting. We had to disable half float in text rendering long time ago, and probably we need to do the same for offscreens, because screens are getting bigger and bigger...

Will be fixed in the next version.
 
User avatar
jsantos
Site Admin
Posts: 3918
Joined: 20 Jan 2012, 17:18
Contact:

Re: Rendering errors for nested objects

17 Nov 2017, 17:54

Thanks AndreasEnscape - do you mind pasting the link to the report here for reference?
Reports are still private. Could you please create a new ticket for you? We will try to send you a quick hot fix for evaluation.

Who is online

Users browsing this forum: Ahrefs [Bot], Google [Bot], Semrush [Bot] and 6 guests