Materialdesigninxamltoolkit: DialogHost on MetroWindow causes rendering artifacts

[Tokter]

As you move your mouse around, or tab between different controls. Horizontal and vertical lines appear:

You can recreate the issue by adding a DialogHost to the MahAppsDragablzDemo MainWindow.xaml

<controls:MetroWindow x:Class="MahMaterialDragablzMashUp.MainWindow"
                      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                      xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"
                      xmlns:dragablz="clr-namespace:Dragablz;assembly=Dragablz"
                      xmlns:mahMaterialDragablzMashUp="clr-namespace:MahMaterialDragablzMashUp"
                      xmlns:dockablz="clr-namespace:Dragablz.Dockablz;assembly=Dragablz"
                      xmlns:wpf="http://materialdesigninxaml.net/winfx/xaml/themes"                      
                      WindowTransitionsEnabled="False"
                      TextElement.Foreground="{DynamicResource MaterialDesignBody}"
                      Background="{DynamicResource MaterialDesignPaper}"                      
                      GlowBrush="{DynamicResource AccentColorBrush}"                      
                      FontFamily="{StaticResource DefaultFont}"
                      Title="Material-MahApps-Dragablz Mash Up" Height="640" Width="800">

    <controls:MetroWindow.Flyouts>
        <controls:FlyoutsControl>
            <controls:Flyout x:Name="LeftFlyout" Position="Left" Header="Settings" wpf:FlyoutAssist.HeaderColorMode="Accent">
                <mahMaterialDragablzMashUp:FlyoutContent />
            </controls:Flyout>
        </controls:FlyoutsControl>
    </controls:MetroWindow.Flyouts>
    <controls:MetroWindow.LeftWindowCommands>
        <controls:WindowCommands>
            <wpf:PopupBox Style="{StaticResource WindowCommandsPopupBoxStyle}">
                <StackPanel>
                    <Button Content="Hello World"/>
                    <Button Content="Nice Popup"/>
                    <Button Content="Goodbye"/>
                </StackPanel>
            </wpf:PopupBox>
        </controls:WindowCommands>
    </controls:MetroWindow.LeftWindowCommands>

    <wpf:DialogHost IsOpen="True">
        <wpf:DialogHost.DialogContent>
            <DockPanel VerticalAlignment="Center" HorizontalAlignment="Center" Margin="20" FocusManager.IsFocusScope="True">
                <StackPanel DockPanel.Dock="Bottom" Orientation="Horizontal" HorizontalAlignment="Right">
                    <Button x:Name="Cancel" Style="{StaticResource MaterialDesignFlatButton}">Cancel</Button>
                    <Button x:Name="Add" Style="{StaticResource MaterialDesignFlatButton}">Add</Button>
                </StackPanel>
                <StackPanel Orientation="Vertical">
                    <TextBlock Margin="8" DockPanel.Dock="Top" Text="Dialog Test" TextWrapping="Wrap" Style="{StaticResource MaterialDesignHeadlineTextBlock}" />
                    <TextBox Text="Line 1" Margin="8,8,8,0" wpf:HintAssist.Hint="Test" Style="{StaticResource MaterialDesignFloatingHintTextBox}" />
                    <TextBox Text="Line 2" Margin="8,8,8,0" wpf:HintAssist.Hint="Test" Style="{StaticResource MaterialDesignFloatingHintTextBox}" />
                    <TextBox Text="Line 3" Margin="8,8,8,0" wpf:HintAssist.Hint="Test" Style="{StaticResource MaterialDesignFloatingHintTextBox}" />
                </StackPanel>
            </DockPanel>
        </wpf:DialogHost.DialogContent>


        <dockablz:Layout>
            <dragablz:TabablzControl BorderThickness="0"
                                 Margin="0,-1,0,1">
                <dragablz:TabablzControl.InterTabController>
                    <dragablz:InterTabController />
                </dragablz:TabablzControl.InterTabController>
                <TabItem Header="DIALOGS">
                    <mahMaterialDragablzMashUp:Dialogs Margin="8">
                        <mahMaterialDragablzMashUp:Dialogs.DataContext>
                            <mahMaterialDragablzMashUp:DialogsViewModel />
                        </mahMaterialDragablzMashUp:Dialogs.DataContext>
                    </mahMaterialDragablzMashUp:Dialogs>
                </TabItem>
                <TabItem Header="MAHAPPS">
                    <mahMaterialDragablzMashUp:Mah Margin="16" />
                </TabItem>
                <TabItem Header="PALETTE">
                    <mahMaterialDragablzMashUp:PaletteSelector Margin="16">
                        <mahMaterialDragablzMashUp:PaletteSelector.DataContext>
                            <mahMaterialDragablzMashUp:PaletteSelectorViewModel />
                        </mahMaterialDragablzMashUp:PaletteSelector.DataContext>
                    </mahMaterialDragablzMashUp:PaletteSelector>
                </TabItem>
            </dragablz:TabablzControl>
        </dockablz:Layout>
    </wpf:DialogHost>
</controls:MetroWindow>

[AlbertAlonso]

I was going to create an issue with this exact Bug.
I have a simple repo that recreates the glitches when using MetroWindow and Material Dialog
Repo

[jespersh]

Duplicate of issue #1097
See comment https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/issues/1097#issuecomment-434996088

[Tokter]

Looks like it, but since that issue only started with one of the latest updates and multiple people seem to run into it. Maybe that should be fixed somewhere in the framework?

[Keboo]

@Tokter do you know a previous version where it worked?

[Tokter]

@Keboo Couldn't figure out in what version it changed yet. But I created a pull request that I think fixes the issue.