WPF Vault Addin - monitor DPI issue

[mateusz_baczewski]

Hi,

While developing an add-in for Vault, I encountered a scalability issue. The add-in has a WPF window. When the window is displayed on a monitor with DPI = 100%, everything works fine. However, if I move the window to a monitor with DPI > 100%, rendering issues occur—for example, with comboboxes. Has anyone experienced this problem before? Were you able to resolve it?

[Markus.Koechl]

You might need to apply the same setting that we recommend for VDS dialogs: Working with Vault with High DPI Settings

[mateusz_baczewski]

@Markus.Koechl 

Thanks for the reply. Do you happen to know if there’s a way to achieve a similar effect programmatically? I would go with your solution for a single machine, but I’d need to implement this change company-wide.

[mateusz_baczewski]

Has anyone had a similar issue?

[mateusz_baczewski · Accepted solution]

Hi,

I managed to solve this problem programmatically without the need to change any properties in the Vault startup file. The issue occurs when a WPF control, or part of it, has the property AllowsTransparency="True". In this case, you need to override the entire style of the control and change AllowsTransparency="False" wherever possible. In my case, the ComboBox's Popup had the property AllowsTransparency="True". After making these changes, the problem disappeared. I’m sending the style for the ComboBox that works.

<Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ComboBox">
                        <Grid>
                            <ToggleButton Name="ToggleButton"
                                  Grid.Column="2"
                                  Focusable="False"
                                  Background="{TemplateBinding Background}"
                                  BorderBrush="{TemplateBinding BorderBrush}"
                                  BorderThickness="{TemplateBinding BorderThickness}"
                                  IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
                                  ClickMode="Press">
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition />
                                        <ColumnDefinition Width="20"/>
                                    </Grid.ColumnDefinitions>


                                    <Border x:Name="ContentSite"
                                    Background="{TemplateBinding Background}"
                                    VerticalAlignment="Center"
                                    Padding="4,2">
                                        <ContentPresenter
                                    Content="{TemplateBinding SelectionBoxItem}"
                                    ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                                    ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"
                                    RecognizesAccessKey="True"
                                    IsHitTestVisible="False"/>
                                    </Border>

                                    <Path Grid.Column="1"
                                  Margin="0,0,4,0"
                                  VerticalAlignment="Center"
                                  Data="M 0 0 L 4 4 L 8 0 Z"
                                  Fill="Black"
                                  Width="8"
                                  Height="4"/>
                                </Grid>
                            </ToggleButton>

                            <Popup Name="Popup"
                           Placement="Bottom"
                           AllowsTransparency="False"
                           IsOpen="{TemplateBinding IsDropDownOpen}"
                           Focusable="False"
                           PopupAnimation="Slide">
                                <Grid MaxHeight="220"
                              MinWidth="{Binding ActualWidth, RelativeSource={RelativeSource TemplatedParent}}">
                                    <Border x:Name="DropDownBorder"
                                    Background="White"
                                    BorderBrush="Gray"
                                    BorderThickness="1" />
                                    <ScrollViewer Margin="4,6,4,6"
                                          SnapsToDevicePixels="True">
                                        <StackPanel IsItemsHost="True"
                                            KeyboardNavigation.DirectionalNavigation="Contained" />
                                    </ScrollViewer>
                                </Grid>
                            </Popup>
                        </Grid>


                        <ControlTemplate.Triggers>
                            <Trigger Property="HasItems" Value="False">
                                <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
                            </Trigger>

                            <Trigger Property="IsEnabled" Value="True">
                                <Setter TargetName="ToggleButton" Property="Background" Value="White"/>
                                <Setter TargetName="ContentSite" Property="Background" Value="White"/>
                                <Setter Property="Foreground" Value="Black"/>
                                <Setter Property="Opacity" Value="1"/>
                            </Trigger>

                            <Trigger Property="IsGrouping" Value="True">
                                <Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=DataGridCell}, Path=IsSelected}" Value="True">
                    <Setter Property="Background" Value="#CCE5FF"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>