Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Groups Context Menu Visual Refresh #12262

Merged
merged 4 commits into from
Nov 11, 2021
Merged

Groups Context Menu Visual Refresh #12262

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
b592a08
Updates groups context menu style
OliverEGreen Nov 8, 2021
93742f8
Update AnnotationView.xaml
OliverEGreen Nov 8, 2021
0d296d0
Update AnnotationView.xaml
OliverEGreen Nov 11, 2021
6e9e0b3
Update AnnotationView.xaml
OliverEGreen Nov 11, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/DynamoCoreWpf/Properties/Resources.Designer.cs
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion src/DynamoCoreWpf/Properties/Resources.en-US.resx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2514,7 +2514,7 @@ Uninstall the following packages: {0}?</value>
<value>&lt;Click here to edit the group title&gt;</value>
</data>
<data name="GroupContextMenuAddGroupToGroup" xml:space="preserve">
<value>Add group to group</value>
<value>Add Group to Group</value>
</data>
<data name="NodeInformationalStateDismiss" xml:space="preserve">
<value>Dismiss</value>
Expand Down
2 changes: 1 addition & 1 deletion src/DynamoCoreWpf/Properties/Resources.resx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2732,7 +2732,7 @@ Uninstall the following packages: {0}?</value>
<value>&lt;Double click here to edit group title&gt;</value>
</data>
<data name="GroupContextMenuAddGroupToGroup" xml:space="preserve">
<value>Add group to group</value>
<value>Add Group to Group</value>
</data>
<data name="ExitTourWindowContent" xml:space="preserve">
<value>You can return to this guide later from the Help menu.</value>
Expand Down
214 changes: 164 additions & 50 deletions src/DynamoCoreWpf/Views/Core/AnnotationView.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBox">
<Grid Margin="4,8,4,8">
<Grid Margin="0,9,4,8">
<ScrollViewer Margin="0"
Focusable="false">
<WrapPanel IsItemsHost="True" />
Expand All @@ -70,7 +70,7 @@
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Grid Margin="3,4,3,4"
<Grid Margin="0,0,4,5"
SnapsToDevicePixels="true">
<Grid.Background>
<SolidColorBrush Color="Transparent" />
Expand Down Expand Up @@ -250,74 +250,188 @@
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ContextMenu>
<ContextMenu>
<MenuItem Header="{x:Static p:Resources.GroupContextMenuDeleteGroup}"
Name="DeleteAnnotation"
Click="OnDeleteAnnotation" />
<MenuItem Header="{x:Static p:Resources.GroupContextMenuUngroup}"
Name="UngroupAnnotation"
Click="OnUngroupAnnotation" />
<MenuItem Header="{x:Static p:Resources.ContextUnGroupFromSelection}"
Name="unGroup_cm"
Command="{Binding Path=RemoveGroupFromGroupCommand}" />
<MenuItem Header="{x:Static p:Resources.GroupContextMenuAddGroupToGroup}"
Name="AddGroupToGroup"
Command="{Binding AddGroupToGroupCommand}" />
<MenuItem Header="{x:Static p:Resources.GroupContextMenuGraphLayout}"
Name="GraphLayoutAnnotation"
Click="OnGraphLayoutAnnotation" />
<MenuItem Header="{x:Static p:Resources.GroupContextMenuFont}"
Name="ChangeSize">
<MenuItem Header="14"
Name="FontSize0"
<ContextMenu Background="#666666" Style="{StaticResource ContextMenuStyle}">
<ContextMenu.Resources>
<ResourceDictionary>
<Style TargetType="{x:Type MenuItem}">
<Setter Property="IsChecked" Value="{DynamicResource IsChecked}" />
<!--<Setter Property="Height" Value="30" />-->
QilongTang marked this conversation as resolved.
Show resolved Hide resolved
<Setter Property="Width" Value="240" />
<Setter Property="Padding" Value="20,0,20,0" />
<Setter Property="Template">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

question: do we repeat a lot of the following style definitions?

Copy link
Contributor Author

@OliverEGreen OliverEGreen Nov 11, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You mean the MenuItem style?
We do; this is something I've struggled with.
Because our Menus contain MenuItems, but also Separators (and sometimes other things too, e.g. the Node Group Color ItemCollections), we get an exception when setting the ItemContainerStyle property.

The workaround is to have the styles passively sitting around in a ContextMenu.Resources scope, being applied when the correct Type is found. That's what we do currently. However, I have issues when trying to define a ContextMenu.Resources scope inside of a ResourceDictionary. So while we can set a global ContextMenu Style just fine, we can't do the same for ContextMenuItems. It would be great if we could - could clean up a lot of code!

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for the reasoning, glad this has been considered

<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<DockPanel x:Name="dockPanel"
HorizontalAlignment="Stretch"
Background="Transparent"
SnapsToDevicePixels="true">
<Label x:Name="checkBox"
Margin="2,0,-20,0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Content="✓"
DockPanel.Dock="Left"
FontSize="9px"
Foreground="White"
Visibility="Collapsed" />
<ContentPresenter x:Name="ContentPresenter"
Margin="{TemplateBinding Padding}"
VerticalAlignment="Center"
ContentSource="Header"
DockPanel.Dock="Left"
RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
TextBlock.Foreground="{StaticResource NodeContextMenuForeground}" />
<Label x:Name="subMenuArrow"
Margin="0,0,15,7"
Padding="0"
VerticalAlignment="Center"
Content="&gt;"
DockPanel.Dock="Right"
FontFamily="{StaticResource ArtifaktElementRegular}"
FontSize="13px"
Foreground="{StaticResource Blue300Brush}">
<Label.RenderTransform>
<ScaleTransform ScaleX="1" ScaleY="1.5" />
</Label.RenderTransform>
<Label.Style>
<Style TargetType="{x:Type Label}">
<Setter Property="Visibility" Value="Hidden" />
<Style.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type MenuItem}}, Path=HasItems}" Value="True">
<Setter Property="Visibility" Value="Visible" />
</DataTrigger>
</Style.Triggers>
</Style>
</Label.Style>
</Label>
<Popup x:Name="PART_Popup"
AllowsTransparency="true"
Focusable="false"
HorizontalOffset="0"
IsOpen="{Binding IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}"
Placement="Right"
VerticalOffset="-2">
<Border Background="{TemplateBinding Background}"
BorderBrush="Transparent"
BorderThickness="0">
<ScrollViewer x:Name="SubMenuScrollViewer"
CanContentScroll="true"
Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer,
TypeInTargetAssembly={x:Type FrameworkElement}}}">
<Grid RenderOptions.ClearTypeHint="Enabled">
<ItemsPresenter x:Name="ItemsPresenter"
Margin="2"
Grid.IsSharedSizeScope="true"
KeyboardNavigation.DirectionalNavigation="Cycle"
KeyboardNavigation.TabNavigation="Cycle"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
</Grid>
</ScrollViewer>
</Border>
</Popup>
</DockPanel>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="ContentPresenter" Property="TextBlock.Opacity" Value="0.5" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="ContentPresenter" Property="TextBlock.Foreground" Value="White" />
<Setter TargetName="dockPanel" Property="Background" Value="{StaticResource NodeContextMenuBackgroundHighlight}" />
</Trigger>
<Trigger Property="IsMouseOver" Value="False">
<Setter TargetName="dockPanel" Property="Background" Value="{StaticResource NodeContextMenuBackground}" />
</Trigger>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="checkBox" Property="Visibility" Value="Visible" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Static MenuItem.SeparatorStyleKey}" TargetType="Separator">
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Separator}">
<Border Height="1"
Margin="20,8,20,8"
Background="{StaticResource NodeContextMenuSeparatorColor}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
</ContextMenu.Resources>
<MenuItem Name="DeleteAnnotation"
Click="OnDeleteAnnotation"
Header="{x:Static p:Resources.GroupContextMenuDeleteGroup}" />
<MenuItem Name="UngroupAnnotation"
Click="OnUngroupAnnotation"
Header="{x:Static p:Resources.GroupContextMenuUngroup}" />
<MenuItem Name="unGroup_cm"
Command="{Binding Path=RemoveGroupFromGroupCommand}"
Header="{x:Static p:Resources.ContextUnGroupFromSelection}" />
<MenuItem Name="AddGroupToGroup"
Command="{Binding AddGroupToGroupCommand}"
Header="{x:Static p:Resources.GroupContextMenuAddGroupToGroup}" />
<MenuItem Name="GraphLayoutAnnotation"
Click="OnGraphLayoutAnnotation"
Header="{x:Static p:Resources.GroupContextMenuGraphLayout}" />
<MenuItem Name="ChangeSize" Header="{x:Static p:Resources.GroupContextMenuFont}">
<MenuItem Name="FontSize0"
Command="{Binding ChangeFontSize}"
CommandParameter="14"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=14}"></MenuItem>
<MenuItem Header="18"
Name="FontSize1"
Header="14"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=14}" />
<MenuItem Name="FontSize1"
Command="{Binding ChangeFontSize}"
CommandParameter="18"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=18}"></MenuItem>
<MenuItem Header="24"
Name="FontSize2"
Header="18"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=18}" />
<MenuItem Name="FontSize2"
Command="{Binding ChangeFontSize}"
CommandParameter="24"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=24}"></MenuItem>
<MenuItem Header="30"
Name="FontSize3"
Header="24"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=24}" />
<MenuItem Name="FontSize3"
Command="{Binding ChangeFontSize}"
CommandParameter="30"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=30}"></MenuItem>
<MenuItem Header="36"
Name="FontSize4"
Header="30"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=30}" />
<MenuItem Name="FontSize4"
Command="{Binding ChangeFontSize}"
CommandParameter="36"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=36}"></MenuItem>
<MenuItem Header="48"
Name="FontSize5"
Header="36"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=36}" />
<MenuItem Name="FontSize5"
Command="{Binding ChangeFontSize}"
CommandParameter="48"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=48}"></MenuItem>
<MenuItem Header="60"
Name="FontSize6"
Header="48"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=48}" />
<MenuItem Name="FontSize6"
Command="{Binding ChangeFontSize}"
CommandParameter="60"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=60}"></MenuItem>
<MenuItem Header="72"
Name="FontSize7"
Header="60"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=60}" />
<MenuItem Name="FontSize7"
Command="{Binding ChangeFontSize}"
CommandParameter="72"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=72}"></MenuItem>
<MenuItem Header="96"
Name="FontSize8"
Header="72"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=72}" />
<MenuItem Name="FontSize8"
Command="{Binding ChangeFontSize}"
CommandParameter="96"
IsChecked="{Binding Path=FontSize,Converter={StaticResource MenuItemCheckConverter},ConverterParameter=96}"></MenuItem>
Header="96"
IsChecked="{Binding Path=FontSize, Converter={StaticResource MenuItemCheckConverter}, ConverterParameter=96}" />

</MenuItem>
<ListBox Style="{StaticResource ColorSelectorListBox}"
ItemContainerStyle="{StaticResource ColorSelectorListBoxItem}"
SelectionChanged="OnNodeColorSelectionChanged">
<ListBox ItemContainerStyle="{StaticResource ColorSelectorListBoxItem}"
SelectionChanged="OnNodeColorSelectionChanged"
Style="{StaticResource ColorSelectorListBox}">
<ListBox.Items>
<Rectangle Fill="#d4b6db" />
<Rectangle Fill="#ffb8d8" />
Expand Down