[ColorPicker] Order colors with up/down buttons. (#10392)

This commit is contained in:
Seraphima Zykova
2021-03-24 19:36:25 +03:00
committed by GitHub
parent 3ae5135f67
commit fd55026fba
5 changed files with 148 additions and 6 deletions

View File

@@ -12,6 +12,8 @@ namespace Microsoft.PowerToys.Settings.UI.Library
private string _name;
private string _example;
private bool _isShown;
private bool _canMoveUp = true;
private bool _canMoveDown = true;
public ColorFormatModel(string name, string example, bool isShown)
{
@@ -62,6 +64,34 @@ namespace Microsoft.PowerToys.Settings.UI.Library
}
}
public bool CanMoveUp
{
get
{
return _canMoveUp;
}
set
{
_canMoveUp = value;
OnPropertyChanged();
}
}
public bool CanMoveDown
{
get
{
return _canMoveDown;
}
set
{
_canMoveDown = value;
OnPropertyChanged();
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged([CallerMemberName] string propertyName = null)

View File

@@ -247,11 +247,28 @@ namespace Microsoft.PowerToys.Settings.UI.Library.ViewModels
ColorFormats.Add(remainingColorFormat);
}
// Reordering colors with buttons: disable first and last buttons
ColorFormats[0].CanMoveUp = false;
ColorFormats[ColorFormats.Count - 1].CanMoveDown = false;
ColorFormats.CollectionChanged += ColorFormats_CollectionChanged;
}
private void ColorFormats_CollectionChanged(object sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
{
// Reordering colors with buttons: update buttons availability depending on order
if (ColorFormats.Count > 0)
{
foreach (var color in ColorFormats)
{
color.CanMoveUp = true;
color.CanMoveDown = true;
}
ColorFormats[0].CanMoveUp = false;
ColorFormats[ColorFormats.Count - 1].CanMoveDown = false;
}
UpdateColorFormats();
ScheduleSavingOfSettings();
}

View File

@@ -868,7 +868,7 @@
<value>Open directly into the editor mode</value>
</data>
<data name="ColorPicker_ColorFormatsDescription.Text" xml:space="preserve">
<value>Editor color formats (Change the order by dragging)</value>
<value>Editor color formats</value>
</data>
<data name="ColorPicker_ShowColorName.Content" xml:space="preserve">
<value>Show color name</value>
@@ -1170,4 +1170,10 @@ Win + Shift + O to toggle your video</value>
<data name="Run_PluginsLoading.Text" xml:space="preserve">
<value>Plugins are loading...</value>
</data>
<data name="ColorPicker_ButtonDown.AutomationProperties.Name" xml:space="preserve">
<value>Move the color down</value>
</data>
<data name="ColorPicker_ButtonUp.AutomationProperties.Name" xml:space="preserve">
<value>Move the color up</value>
</data>
</root>

View File

@@ -1,4 +1,4 @@
<Page
<Page
x:Class="Microsoft.PowerToys.Settings.UI.Views.ColorPickerPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
@@ -147,17 +147,22 @@
Foreground="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled, Converter={StaticResource ModuleEnabledToForegroundConverter}}"
Margin="{StaticResource SmallTopMargin}"/>
<!-- Disabled reordering by dragging -->
<!-- CanReorderItems="True" AllowDrop="True" -->
<ListView ItemsSource="{Binding ColorFormats, Mode=TwoWay}"
AllowDrop="True"
MaxWidth="466"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}"
AutomationProperties.LabeledBy="{Binding ElementName=ColorFormatsListViewLabel}"
CanReorderItems="True"
HorizontalAlignment="Left"
Margin="-12,6,0,0">
<ItemsControl.ItemContainerTransitions>
<TransitionCollection/>
</ItemsControl.ItemContainerTransitions>
<ListView.ItemTemplate>
<DataTemplate>
<Grid Width="466" Background="Transparent">
<!-- Disabled reordering by dragging
<Interactivity:Interaction.Behaviors>
<Core:EventTriggerBehavior EventName="PointerEntered">
<Core:ChangePropertyAction TargetObject="{Binding ElementName=GripperIcon}" PropertyName="Visibility" Value="Visible" />
@@ -165,7 +170,19 @@
<Core:EventTriggerBehavior EventName="PointerExited">
<Core:ChangePropertyAction TargetObject="{Binding ElementName=GripperIcon}" PropertyName="Visibility" Value="Collapsed" />
</Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors> -->
<Interactivity:Interaction.Behaviors>
<Core:EventTriggerBehavior EventName="PointerEntered">
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonUp}" PropertyName="Visibility" Value="Visible" />
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonDown}" PropertyName="Visibility" Value="Visible" />
</Core:EventTriggerBehavior>
<Core:EventTriggerBehavior EventName="PointerExited">
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonUp}" PropertyName="Visibility" Value="Collapsed" />
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonDown}" PropertyName="Visibility" Value="Collapsed" />
</Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
@@ -179,8 +196,13 @@
Grid.Row="1"
Margin="0,0,0,8"/>
<ToggleSwitch IsOn="{Binding IsShown, Mode=TwoWay}"
OnContent=""
OffContent=""
Grid.RowSpan="2"
HorizontalAlignment="Right" />
HorizontalAlignment="Right"
Margin="0,0,-36,0"/>
<!-- Disabled reordering by dragging
<TextBlock Text="&#xE76F;"
Visibility="Collapsed"
x:Name="GripperIcon"
@@ -189,7 +211,44 @@
FontSize="16"
HorizontalAlignment="Right"
Margin="0,0,36,0"
FontFamily="Segoe MDL2 Assets" />
FontFamily="Segoe MDL2 Assets" /> -->
<Button x:Uid="ColorPicker_ButtonUp"
x:Name="ButtonUp"
Content="&#xE74A;"
IsEnabled="{Binding CanMoveUp}"
Grid.Row="0"
HorizontalAlignment="Right"
Margin="0,0,24,0"
Background="Transparent"
Visibility="Collapsed"
FontFamily="Segoe MDL2 Assets"
Click="ReorderButtonUp_Click">
<Interactivity:Interaction.Behaviors>
<Core:EventTriggerBehavior EventName="Click">
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonUp}" PropertyName="Visibility" Value="Collapsed" />
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonDown}" PropertyName="Visibility" Value="Collapsed" />
</Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</Button>
<Button x:Uid="ColorPicker_ButtonDown"
x:Name="ButtonDown"
Content="&#xE74B;"
IsEnabled="{Binding CanMoveDown}"
Grid.Row="1"
HorizontalAlignment="Right"
Margin="0,0,24,0"
Background="Transparent"
Visibility="Collapsed"
FontFamily="Segoe MDL2 Assets"
Click="ReorderButtonDown_Click" >
<Interactivity:Interaction.Behaviors>
<Core:EventTriggerBehavior EventName="Click">
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonUp}" PropertyName="Visibility" Value="Collapsed" />
<Core:ChangePropertyAction TargetObject="{Binding ElementName=ButtonDown}" PropertyName="Visibility" Value="Collapsed" />
</Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</Button>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>

View File

@@ -47,5 +47,35 @@ namespace Microsoft.PowerToys.Settings.UI.Views
ColorPicker_ComboBox.SelectedIndex = index;
}
private void ReorderButtonUp_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
ColorFormatModel color = ((Button)sender).DataContext as ColorFormatModel;
if (color == null)
{
return;
}
var index = ViewModel.ColorFormats.IndexOf(color);
if (index > 0)
{
ViewModel.ColorFormats.Move(index, index - 1);
}
}
private void ReorderButtonDown_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
ColorFormatModel color = ((Button)sender).DataContext as ColorFormatModel;
if (color == null)
{
return;
}
var index = ViewModel.ColorFormats.IndexOf(color);
if (index < ViewModel.ColorFormats.Count - 1)
{
ViewModel.ColorFormats.Move(index, index + 1);
}
}
}
}