Skip to content

Commit

Permalink
[DYN-6574] Group UI controls become invisible with certain group colo…
Browse files Browse the repository at this point in the history 
…rs (#15684)
  • Loading branch information
@ivaylo-matov
ivaylo-matov authored Nov 25, 2024
1 parent 9fcf24a commit f39eebc
Show file tree
Hide file tree
Showing 10 changed files with 119 additions and 43 deletions.
6 changes: 6 additions & 0 deletions src/DynamoCoreWpf/DynamoCoreWpf.csproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,8 @@
<None Remove="Packages\DynamoHome\build\index.bundle.js" />
<None Remove="Packages\DynamoHome\build\index.html" />
<None Remove="UI\Images\Canvas\canvas-button-geometry-scaling.png" />
<None Remove="UI\Images\caret_down_white_48px.png" />
<None Remove="UI\Images\caret_up_white_48px.png" />
<None Remove="UI\Images\checkmark_16px.png" />
<None Remove="UI\Images\close_16px.png" />
<None Remove="UI\Images\caret_drop_down.png" />
Expand All @@ -107,6 +109,7 @@
<None Remove="UI\Images\folder-generic-16px.png" />
<None Remove="UI\Images\help-16px.png" />
<None Remove="UI\Images\info_48px.png" />
<None Remove="UI\Images\menu_white_48px.png" />
<None Remove="UI\Images\NodeStates\package-64px.png" />
<None Remove="UI\Images\PackageManager\empty-state-first-use-light-gray.png" />
<None Remove="UI\Images\search_icon_20px.png" />
Expand Down Expand Up @@ -882,9 +885,11 @@
<Resource Include="UI\Images\Alignment\align_y_average.png" />
<Resource Include="UI\Images\Alignment\align_y_distribute.png" />
<Resource Include="UI\Images\Canvas\canvas-button-geometry-scaling.png" />
<Resource Include="UI\Images\caret_down_white_48px.png" />
<Resource Include="UI\Images\caret_drop_down.png" />
<Resource Include="UI\Images\caret_up.png" />
<EmbeddedResource Include="Views\GuidedTour\HtmlPages\Resources\ArtifaktElement-Regular.woff" />
<Resource Include="UI\Images\caret_up_white_48px.png" />
<Resource Include="UI\Images\checkmark_16px.png" />
<Resource Include="UI\Images\close_16px.png" />
<Resource Include="UI\Images\cursors.psd" />
Expand Down Expand Up @@ -1026,6 +1031,7 @@
<Resource Include="UI\Images\help-16px.png" />
<Resource Include="UI\Images\info_48px.png" />
<Resource Include="UI\Images\maximize_16px_blue.png" />
<Resource Include="UI\Images\menu_white_48px.png" />
<Resource Include="UI\Images\minimize_16px_blue.png" />
<Resource Include="UI\Images\minus_16px_blue.png" />
<Resource Include="UI\Images\NodeStates\alert-64px.png" />
Expand Down
4 changes: 4 additions & 0 deletions src/DynamoCoreWpf/PublicAPI.Unshipped.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,10 @@ Dynamo.Controls.AutoLacingToVisibilityConverter
Dynamo.Controls.AutoLacingToVisibilityConverter.AutoLacingToVisibilityConverter() -> void
Dynamo.Controls.AutoLacingToVisibilityConverter.Convert(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture) -> object
Dynamo.Controls.AutoLacingToVisibilityConverter.ConvertBack(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture) -> object
Dynamo.Controls.BackgroundConditionEvaluator
Dynamo.Controls.BackgroundConditionEvaluator.Convert(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture) -> object
Dynamo.Controls.BackgroundConditionEvaluator.ConvertBack(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture) -> object
Dynamo.Controls.BackgroundConditionEvaluator.BackgroundConditionEvaluator() -> void
Dynamo.Controls.Base64ToImageConverter
Dynamo.Controls.Base64ToImageConverter.Base64ToImageConverter() -> void
Dynamo.Controls.Base64ToImageConverter.Convert(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture) -> object
Expand Down
51 changes: 51 additions & 0 deletions src/DynamoCoreWpf/UI/Converters.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4054,4 +4054,55 @@ public object ConvertBack(object value, Type targetType, object parameter, Cultu
return value;
}
}

/// <summary>
/// Evaluates whether the contrast ratio of a background color against a predefined dark color is sufficient (>= 4.5).
/// Returns true if the contrast is below the threshold, otherwise false.
/// </summary>
public class BackgroundConditionEvaluator : IValueConverter
{
private const double ContrastRatioThreshold = 4.5;

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var darkColor = (System.Windows.Media.Color)SharedDictionaryManager.DynamoColorsAndBrushesDictionary["DarkerGrey"];

var backgroundColor = (System.Windows.Media.Color)value;

var contrastRatio = GetContrastRatio(darkColor, backgroundColor);

var c1 = contrastRatio;
var c2 = ContrastRatioThreshold;
var result = contrastRatio < ContrastRatioThreshold;

return contrastRatio < ContrastRatioThreshold;
}

public object ConvertBack(object value, Type targetType, object parameter,
CultureInfo culture)
{
return null;
}
private double GetContrastRatio(System.Windows.Media.Color foreground, System.Windows.Media.Color background)
{
double L1 = GetRelativeLuminance(foreground);
double L2 = GetRelativeLuminance(background);

return L1 > L2 ? (L1 + 0.05) / (L2 + 0.05) : (L2 + 0.05) / (L1 + 0.05);
}

private double GetRelativeLuminance(System.Windows.Media.Color color)
{
var R = color.R / 255.0;
var G = color.G / 255.0;
var B = color.B / 255.0;

// Apply luminance formula
R = R < 0.03928 ? R / 12.92 : Math.Pow((R + 0.055) / 1.055, 2.4);
G = G < 0.03928 ? G / 12.92 : Math.Pow((G + 0.055) / 1.055, 2.4);
B = B < 0.03928 ? B / 12.92 : Math.Pow((B + 0.055) / 1.055, 2.4);

return 0.2126 * R + 0.7152 * G + 0.0722 * B;
}
}
}
Binary file modified src/DynamoCoreWpf/UI/Images/caret_down_grey_48px.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/DynamoCoreWpf/UI/Images/caret_down_white_48px.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/DynamoCoreWpf/UI/Images/caret_up_grey_48px.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/DynamoCoreWpf/UI/Images/caret_up_white_48px.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/DynamoCoreWpf/UI/Images/menu_grey_48px.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/DynamoCoreWpf/UI/Images/menu_white_48px.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
101 changes: 58 additions & 43 deletions src/DynamoCoreWpf/Views/Core/AnnotationView.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@
<utilities:GroupStyleItemSelector x:Key="GroupStyleItemSelector"/>
<controls:StringToBrushColorConverter x:Key="StringToBrushColorConverter"/>
<controls:TextForegroundSaturationColorConverter x:Key="TextForegroundSaturationColorConverter"/>
<controls:BackgroundConditionEvaluator x:Key="BackgroundConditionEvaluator"/>
<CornerRadius x:Key="ExpanderCornerRadius"
TopLeft="10"
TopRight="10" />
Expand Down Expand Up @@ -141,43 +142,54 @@
<ControlTemplate.Triggers>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="False"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False" />
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="False" />
<Condition Binding="{Binding Background, Converter={StaticResource BackgroundConditionEvaluator}}" Value="False" />
</MultiDataTrigger.Conditions>

<Setter Property="Source"
TargetName="sign"
Value="/DynamoCoreWpf;component/UI/Images/caret_down_grey_48px.png" />
<Setter Property="Source" TargetName="sign" Value="/DynamoCoreWpf;component/UI/Images/caret_down_grey_48px.png" />
</MultiDataTrigger>

<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="True"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="False"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False" />
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="False" />
<Condition Binding="{Binding Background, Converter={StaticResource BackgroundConditionEvaluator}}" Value="True" />
</MultiDataTrigger.Conditions>

<Setter Property="Source"
TargetName="sign"
Value="/DynamoCoreWpf;component/UI/Images/caret_down_hover_48px.png" />
<Setter Property="Source" TargetName="sign" Value="/DynamoCoreWpf;component/UI/Images/caret_down_white_48px.png" />
</MultiDataTrigger>

<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="True" />
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="False" />
</MultiDataTrigger.Conditions>

<Setter Property="Source"
TargetName="sign"
Value="/DynamoCoreWpf;component/UI/Images/caret_up_grey_48px.png" />
<Setter Property="Source" TargetName="sign" Value="/DynamoCoreWpf;component/UI/Images/caret_down_hover_48px.png" />
</MultiDataTrigger>

<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="True"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True"/>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False" />
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True" />
<Condition Binding="{Binding Background, Converter={StaticResource BackgroundConditionEvaluator}}" Value="False" />
</MultiDataTrigger.Conditions>

<Setter Property="Source"
TargetName="sign"
Value="/DynamoCoreWpf;component/UI/Images/caret_up_hover_48px.png" />
<Setter Property="Source" TargetName="sign" Value="/DynamoCoreWpf;component/UI/Images/caret_up_grey_48px.png" />
</MultiDataTrigger>

<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False" />
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True" />
<Condition Binding="{Binding Background, Converter={StaticResource BackgroundConditionEvaluator}}" Value="True" />
</MultiDataTrigger.Conditions>
<Setter Property="Source" TargetName="sign" Value="/DynamoCoreWpf;component/UI/Images/caret_up_white_48px.png" />
</MultiDataTrigger>

<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="True" />
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True" />
</MultiDataTrigger.Conditions>
<Setter Property="Source" TargetName="sign" Value="/DynamoCoreWpf;component/UI/Images/caret_up_hover_48px.png" />
</MultiDataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
Expand Down Expand Up @@ -267,33 +279,36 @@
Height="16"
VerticalAlignment="Bottom"
Click="contextMenu_Click">
<Button.Content>
<Image>
<Image.Style>
<Style TargetType="{x:Type Image}">
<Setter Property="Source" Value="/DynamoCoreWpf;component/UI/Images/menu_grey_48px.png"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Source" Value="/DynamoCoreWpf;component/UI/Images/menu_hover_48px.png"/>
</Trigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
</Button.Content>
<Button.Style>
<Style TargetType="{x:Type Button}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Name="border" BorderThickness="0" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
<Image x:Name="menuIcon" Width="16" Height="16" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="{StaticResource HighlightedBrush}"/>
</Trigger>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False" />
<Condition Binding="{Binding Background, Converter={StaticResource BackgroundConditionEvaluator}}" Value="False" />
</MultiDataTrigger.Conditions>
<Setter TargetName="menuIcon" Property="Source" Value="/DynamoCoreWpf;component/UI/Images/menu_grey_48px.png" />
</MultiDataTrigger>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="False" />
<Condition Binding="{Binding Background, Converter={StaticResource BackgroundConditionEvaluator}}" Value="True" />
</MultiDataTrigger.Conditions>
<Setter TargetName="menuIcon" Property="Source" Value="/DynamoCoreWpf;component/UI/Images/menu_white_48px.png" />
</MultiDataTrigger>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="True" />
</MultiDataTrigger.Conditions>
<Setter TargetName="menuIcon" Property="Source" Value="/DynamoCoreWpf;component/UI/Images/menu_hover_48px.png" />
</MultiDataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
Expand Down

0 comments on commit f39eebc

Please sign in to comment.