microsoft
/
fluent-xaml-theme-editor
зеркало из https://github.com/microsoft/fluent-xaml-theme-editor.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Starting on exports

This commit is contained in:
Kiki Saintonge 2019-10-21 15:02:15 -07:00
Родитель 525fe21684
Коммит d1bc79fdf8
5 изменённых файлов: 206 добавлений и 54 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

155
FluentEditor/ControlPalette/ControlPaletteView.xaml
Просмотреть файл

@ -146,7 +146,8 @@
x:Uid="ControlPaletteInspectorHeader"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="SemiBold">
FontWeight="SemiBold"
Foreground="{ThemeResource SystemControlForegroundChromeGrayBrush}">
<HyperlinkButton.ContentTemplate>
<DataTemplate>
<FontIcon Glyph="&#xE790;" FontSize="25"/>
@ -318,10 +319,8 @@
VerticalAlignment="Stretch"
Background="{ThemeResource ButtonBackgroundThemeBrush}"
Margin="2"
Padding="2"
BorderBrush="{ThemeResource TextBoxButtonForegroundThemeBrush}"
BorderThickness="1"/>
<TextBlock Grid.Column="1" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Control" Foreground="Black"/>
Padding="2"/>
<TextBlock Grid.Column="1" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Control Preview" Foreground="Black"/>
</Grid>
<TextBlock
@ -333,40 +332,98 @@
<Slider x:Name="ControlRoundSliderOverlay"
ValueChanged="ControlRoundSliderOverlay_ValueChanged"
Maximum="20" Minimum="0" Value="4" HorizontalAlignment="Stretch"/>
<StackPanel Orientation="Horizontal" Spacing="9">
<StackPanel>
<Grid Height="150" x:Name="OverlayRadiusGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid Grid.Column="0" Grid.Row="0">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="TopLeftTBOverlay"
Text="{Binding Value, ElementName=ControlRoundSliderOverlay, Mode=OneWay}"
MaxLength="2"
Width="54"
GotFocus="TextBox_GotFocus"/>
</StackPanel>
<StackPanel>
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxOverlay_KeyDown"
TextChanged="CornerOverlay_TextChanged"/>
</Grid>
<Grid Grid.Column="2" Grid.Row="0">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="TopRightTBOverlay"
Text="{Binding Value, ElementName=ControlRoundSliderOverlay, Mode=OneWay}"
MaxLength="2"
Width="54"
GotFocus="TextBox_GotFocus"/>
</StackPanel>
<StackPanel>
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxOverlay_KeyDown"
TextChanged="CornerOverlay_TextChanged"/>
</Grid>
<Grid Grid.Column="0" Grid.Row="2">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="BottomRightTBOverlay"
Text="{Binding Value, ElementName=ControlRoundSliderOverlay, Mode=OneWay}"
MaxLength="2"
Width="54"
GotFocus="TextBox_GotFocus"/>
</StackPanel>
<StackPanel>
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxOverlay_KeyDown"
TextChanged="CornerOverlay_TextChanged"/>
</Grid>
<Grid Grid.Column="2" Grid.Row="2">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="BottomLeftTBOverlay"
Text="{Binding Value, ElementName=ControlRoundSliderOverlay, Mode=OneWay}"
MaxLength="2"
Width="54"
GotFocus="TextBox_GotFocus"/>
</StackPanel>
</StackPanel>
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxOverlay_KeyDown"
TextChanged="CornerOverlay_TextChanged"/>
</Grid>
<shared:Shadow
Grid.Column="1"
Grid.Row="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Margin="0, 2, 0, 0"
Elevation="32" />
<Grid x:Name="ExampleOverlayRoundness"
Grid.Column="1"
Grid.Row="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Background="{ThemeResource FlyoutBackgroundThemeBrush}"
Margin="2"
Padding="2"
BorderBrush="{ThemeResource ComboBoxDropDownBorderBrush}"
BorderThickness="1">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.ColumnSpan="2" Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Overlay Preview" Style="{ThemeResource CaptionTextBlockStyle}"/>
<Grid Grid.Column="0" Grid.Row="1" Background="{ThemeResource SystemControlBackgroundAccentBrush}"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch" RequestedTheme="Dark" Margin="3"
CornerRadius="{ThemeResource ControlCornerRadius}">
<TextBlock Text="OK" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{ThemeResource CaptionTextBlockStyle}"/>
</Grid>
<Grid Grid.Column="1" Grid.Row="1" Background="{ThemeResource ButtonBackgroundThemeBrush}"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="3"
CornerRadius="{ThemeResource ControlCornerRadius}">
<TextBlock Text="Cancel" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{ThemeResource CaptionTextBlockStyle}"/>
</Grid>
</Grid>
</Grid>
</StackPanel>
<!-- END -->
@ -384,49 +441,67 @@
CornerRadius="2"
Padding="5">
<Slider x:Name="ControlBorderThicknessSlider"
Maximum="5" Minimum="0" Value="1" HorizontalAlignment="Stretch"/>
<StackPanel Orientation="Horizontal" Spacing="9">
<StackPanel>
<FontIcon Glyph="&#xF5A5;" FontSize="28"/>
Maximum="5" Minimum="0" Value="1" HorizontalAlignment="Stretch" ValueChanged="ControlBorderThicknessSlider_ValueChanged"/>
<Grid Height="130" x:Name="BorderGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid Grid.Column="0" Grid.Row="1" VerticalAlignment="Center">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="LeftBorderTB"
Text="{Binding Value, ElementName=ControlBorderThicknessSlider, Mode=OneWay}"
MaxLength="2"
Width="54"
Width="54"
Height="34"
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxBorder_KeyDown"/>
</StackPanel>
<StackPanel>
<FontIcon Glyph="&#xF5A7;" FontSize="28"/>
KeyDown="TextBoxBorder_KeyDown"
TextChanged="BorderThickness_TextChanged"/>
</Grid>
<Grid Grid.Column="1" Grid.Row="0" Margin="5">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="TopBorderTB"
Text="{Binding Value, ElementName=ControlBorderThicknessSlider, Mode=OneWay}"
MaxLength="2"
Width="54"
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxBorder_KeyDown"/>
</StackPanel>
<StackPanel>
<FontIcon Glyph="&#xF5A6;" FontSize="28"/>
KeyDown="TextBoxBorder_KeyDown"
TextChanged="BorderThickness_TextChanged"/>
</Grid>
<Grid Grid.Column="2" Grid.Row="1" VerticalAlignment="Center">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="RightBorderTB"
Text="{Binding Value, ElementName=ControlBorderThicknessSlider, Mode=OneWay}"
MaxLength="2"
Width="54"
Height="34"
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxBorder_KeyDown"/>
</StackPanel>
<StackPanel>
<FontIcon Glyph="&#xF5A8;" FontSize="28"/>
KeyDown="TextBoxBorder_KeyDown"
TextChanged="BorderThickness_TextChanged"/>
</Grid>
<Grid Grid.Column="1" Grid.Row="2" Margin="5">
<TextBox CornerRadius="2" BorderThickness="1"
x:Name="BottomBorderTB"
Text="{Binding Value, ElementName=ControlBorderThicknessSlider, Mode=OneWay}"
MaxLength="2"
Width="54"
Width="54"
GotFocus="TextBox_GotFocus"
KeyDown="TextBoxBorder_KeyDown"/>
</StackPanel>
</StackPanel>
KeyDown="TextBoxBorder_KeyDown"
TextChanged="BorderThickness_TextChanged"/>
</Grid>
<Grid Grid.Column="1" Grid.Row="1" x:Name="BorderPreview"
BorderBrush="{ThemeResource ComboBoxBorderThemeBrush}"
BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Text="Border Preview" HorizontalAlignment="Center" VerticalAlignment="Center" Padding="5" Margin="3"/>
</Grid>
</Grid>
</StackPanel>
<Button Content="Apply" HorizontalAlignment="Stretch" Margin="0, 25, 0, 0" Click="Button_Click"/>

57
FluentEditor/ControlPalette/ControlPaletteView.xaml.cs
Просмотреть файл

@ -67,7 +67,7 @@ namespace FluentEditor.ControlPalette
private void ShowTab(Grid tabGrid, Control tabButton, StackPanel tabPanel)
{
tabGrid.Background = (SolidColorBrush)App.Current.Resources["ApplicationPageBackgroundThemeBrush"];
tabButton.Foreground = (SolidColorBrush)App.Current.Resources["SystemControlBackgroundAccentBrush"];
tabButton.Foreground = (SolidColorBrush)App.Current.Resources["SystemControlForegroundChromeGrayBrush"];
tabButton.Opacity = 1.0;
tabPanel.Visibility = Visibility.Visible;
}
@ -89,6 +89,9 @@ namespace FluentEditor.ControlPalette
private void ControlRoundSliderOverlay_ValueChanged(object sender, Windows.UI.Xaml.Controls.Primitives.RangeBaseValueChangedEventArgs e)
{
App.Current.Resources["OverlayCornerRadius"] = new CornerRadius(ControlRoundSliderOverlay.Value);
if (ExampleOverlayRoundness != null)
ExampleOverlayRoundness.CornerRadius = new CornerRadius(ControlRoundSliderOverlay.Value);
}
private void RefreshControls()
@ -98,6 +101,14 @@ namespace FluentEditor.ControlPalette
DarkTestContent.RequestedTheme = ElementTheme.Light;
DarkTestContent.RequestedTheme = ElementTheme.Dark;
if(ViewModel != null)
{
ViewModel.ControlCornerRadiusValue = (CornerRadius)App.Current.Resources["ControlCornerRadius"];
ViewModel.OverlayCornerRadiusValue = (CornerRadius)App.Current.Resources["OverlayCornerRadius"];
ViewModel.ControlBorderThicknessValue = new Thickness(Double.Parse(LeftBorderTB.Text), Double.Parse(TopBorderTB.Text),
Double.Parse(RightBorderTB.Text), Double.Parse(BottomBorderTB.Text));
}
}
private void TextBox_GotFocus(object sender, RoutedEventArgs e)
@ -108,9 +119,8 @@ namespace FluentEditor.ControlPalette
private void UpdateCorners()
{
App.Current.Resources["ControlCornerRadius"] =
new CornerRadius(Double.Parse(TopLeftTB.Text), Double.Parse(TopRightTB.Text),
Double.Parse(BottomRightTB.Text), Double.Parse(BottomLeftTB.Text));
App.Current.Resources["ControlCornerRadius"] = new CornerRadius(Double.Parse(TopLeftTB.Text), Double.Parse(TopRightTB.Text),
Double.Parse(BottomLeftTB.Text), Double.Parse(BottomRightTB.Text));
RefreshControls();
}
@ -132,6 +142,9 @@ namespace FluentEditor.ControlPalette
App.Current.Resources["ToggleSwitchOuterBorderStrokeThickness"] = EqualizeThicknessValue(value);
App.Current.Resources["CheckBoxBorderThemeThickness"] = EqualizeThicknessValue(value);
App.Current.Resources["RadioButtonBorderThemeThickness"] = EqualizeThicknessValue(value);
if (BorderPreview != null)
BorderPreview.BorderThickness = value;
}
private Thickness EqualizeThicknessValue(Thickness before)
@ -147,9 +160,12 @@ namespace FluentEditor.ControlPalette
private void UpdateOverlayCorners()
{
App.Current.Resources["OverlayCornerRadius"] =
new CornerRadius(Double.Parse(TopLeftTBOverlay.Text), Double.Parse(TopRightTBOverlay.Text),
Double.Parse(BottomRightTBOverlay.Text), Double.Parse(BottomLeftTBOverlay.Text));
App.Current.Resources["OverlayCornerRadius"] = new CornerRadius(Double.Parse(TopLeftTBOverlay.Text), Double.Parse(TopRightTBOverlay.Text),
Double.Parse(BottomLeftTBOverlay.Text), Double.Parse(BottomRightTBOverlay.Text));
if (ExampleOverlayRoundness != null)
ExampleOverlayRoundness.CornerRadius = new CornerRadius(Double.Parse(TopLeftTBOverlay.Text), Double.Parse(TopRightTBOverlay.Text),
Double.Parse(BottomLeftTBOverlay.Text), Double.Parse(BottomRightTBOverlay.Text));
}
private void TextBoxOverlay_KeyDown(object sender, Windows.UI.Xaml.Input.KeyRoutedEventArgs e)
@ -212,7 +228,32 @@ namespace FluentEditor.ControlPalette
private void RoundedTextChanged_TextChanged(object sender, TextChangedEventArgs e)
{
ExampleRoundness.CornerRadius = new CornerRadius(Double.Parse(TopLeftTB.Text), Double.Parse(TopRightTB.Text),
Double.Parse(BottomRightTB.Text), Double.Parse(BottomLeftTB.Text));
Double.Parse(BottomLeftTB.Text), Double.Parse(BottomRightTB.Text));
}
private void CornerOverlay_TextChanged(object sender, TextChangedEventArgs e)
{
if (ExampleOverlayRoundness != null)
ExampleOverlayRoundness.CornerRadius = new CornerRadius(Double.Parse(TopLeftTBOverlay.Text), Double.Parse(TopRightTBOverlay.Text),
Double.Parse(BottomLeftTBOverlay.Text), Double.Parse(BottomRightTBOverlay.Text));
}
private void ControlBorderThicknessSlider_ValueChanged(object sender, Windows.UI.Xaml.Controls.Primitives.RangeBaseValueChangedEventArgs e)
{
if (LeftBorderTB == null)
return;
UpdateBorderThickness(new Thickness(Double.Parse(LeftBorderTB.Text), Double.Parse(TopBorderTB.Text),
Double.Parse(RightBorderTB.Text), Double.Parse(BottomBorderTB.Text)));
}
private void BorderThickness_TextChanged(object sender, TextChangedEventArgs e)
{
if (LeftBorderTB == null)
return;
UpdateBorderThickness(new Thickness(Double.Parse(LeftBorderTB.Text), Double.Parse(TopBorderTB.Text),
Double.Parse(RightBorderTB.Text), Double.Parse(BottomBorderTB.Text)));
}
}
}

27
FluentEditor/ControlPalette/ControlPaletteViewModel.cs
Просмотреть файл

@ -37,6 +37,10 @@ namespace FluentEditor.ControlPalette
_paletteModel = paletteModel;
_exportProvider = exportProvider;
_controlBorderThickness = new Thickness(1);
_controlCornerRadius = new CornerRadius(2);
_overlayCornerRadius = new CornerRadius(4);
_lightRegionBrush = new SolidColorBrush(_paletteModel.LightRegion.ActiveColor);
_darkRegionBrush = new SolidColorBrush(_paletteModel.DarkRegion.ActiveColor);
@ -208,6 +212,27 @@ namespace FluentEditor.ControlPalette
get { return _lightRegionBrush; }
}
private CornerRadius _controlCornerRadius;
public CornerRadius ControlCornerRadiusValue
{
set { _controlCornerRadius = value; }
get { return _controlCornerRadius; }
}
private CornerRadius _overlayCornerRadius;
public CornerRadius OverlayCornerRadiusValue
{
set { _overlayCornerRadius = value; }
get { return _overlayCornerRadius; }
}
private Thickness _controlBorderThickness;
public Thickness ControlBorderThicknessValue
{
set { _controlBorderThickness = value; }
get { return _controlBorderThickness; }
}
public ColorPaletteEntry DarkRegion
{
get { return _paletteModel.DarkRegion; }
@ -256,7 +281,7 @@ namespace FluentEditor.ControlPalette
public void OnExportRequested(object sender, RoutedEventArgs e)
{
_exportProvider.ShowExportView(_exportProvider.GenerateExportData(_paletteModel));
_exportProvider.ShowExportView(_exportProvider.GenerateExportData(_paletteModel, this));
}
#region INotifyPropertyChanged

10
FluentEditor/ControlPalette/Model/ControlPaletteExportProvider.cs
Просмотреть файл

@ -14,7 +14,7 @@ namespace FluentEditor.ControlPalette.Model
public interface IControlPaletteExportProvider
{
Task ShowExportView(string exportData);
string GenerateExportData(IControlPaletteModel model, bool showAllColors = false);
string GenerateExportData(IControlPaletteModel model, ControlPaletteViewModel viewModel, bool showAllColors = false);
}
public class ControlPaletteExportProvider : IControlPaletteExportProvider
@ -27,7 +27,7 @@ namespace FluentEditor.ControlPalette.Model
// This is owned by the UI thread for the _exportWindow
private ExportViewModel _exportViewModel;
public string GenerateExportData(IControlPaletteModel model, bool showAllColors = false)
public string GenerateExportData(IControlPaletteModel model, ControlPaletteViewModel viewModel, bool showAllColors = false)
{
StringBuilder sb = new StringBuilder();
sb.AppendLine("<!-- Free Public License 1.0.0 Permission to use, copy, modify, and/or distribute this code for any purpose with or without fee is hereby granted. -->");
@ -73,6 +73,12 @@ namespace FluentEditor.ControlPalette.Model
sb.AppendLine(string.Format(" <Color x:Key=\"SystemRevealListMediumColor\">{0}</Color>", model.DarkBase.Palette[5].ActiveColor.ToString()));
sb.AppendLine(" <AcrylicBrush x:Key=\"SystemControlAcrylicWindowBrush\" BackgroundSource=\"HostBackdrop\" TintColor=\"{ThemeResource SystemChromeAltHighColor}\" TintOpacity=\"0.8\" FallbackColor=\"{ThemeResource SystemChromeMediumColor}\" />");
sb.AppendLine(" <!-- Override system shape defaults -->");
sb.AppendLine(string.Format(" <CornerRadius x:Key=\"ControlCornerRadius\">{0},{1},{2},{3}</Color>", viewModel.ControlCornerRadiusValue.TopLeft,
viewModel.ControlCornerRadiusValue.TopRight, viewModel.ControlCornerRadiusValue.BottomLeft, viewModel.ControlCornerRadiusValue.BottomRight));
sb.AppendLine(string.Format(" <CornerRadius x:Key=\"OverlayCornerRadius\">{0},{1},{2},{3}</Color>", viewModel.OverlayCornerRadiusValue.TopLeft,
viewModel.OverlayCornerRadiusValue.TopRight, viewModel.OverlayCornerRadiusValue.BottomLeft, viewModel.OverlayCornerRadiusValue.BottomRight));
sb.AppendLine(" <!-- Override system generated accent colors -->");
sb.AppendLine(string.Format(" <Color x:Key=\"SystemAccentColorDark1\">{0}</Color>", model.DarkPrimary.Palette[4].ActiveColor.ToString()));
sb.AppendLine(string.Format(" <Color x:Key=\"SystemAccentColorDark2\">{0}</Color>", model.DarkPrimary.Palette[3].ActiveColor.ToString()));

11
FluentEditorShared/FluentEditorSharedResources.xaml
Просмотреть файл

@ -14,7 +14,10 @@
<SolidColorBrush x:Key="PaletteEditorDividerBrush" Color="#FF424242" />
<SolidColorBrush x:Key="PaletteEntryEditorBorderBrush" Color="Transparent" />
<Thickness x:Key="PaletteEntryEditorBorderThickness">0 0 0 0</Thickness>
<Color x:Key="SystemChromeAltHighColor">#FF1C1C1C</Color>
<Color x:Key="SystemChromeMediumColor">#FF1C1C1C</Color>
<AcrylicBrush x:Key="SystemControlAcrylicWindowBrush" BackgroundSource="HostBackdrop" TintColor="{ThemeResource SystemChromeAltHighColor_Dark}" TintOpacity="0.8" FallbackColor="{ThemeResource SystemChromeMediumColor_Dark}" />
</ResourceDictionary>
<ResourceDictionary x:Key="Light">
@ -22,6 +25,9 @@
<SolidColorBrush x:Key="PaletteEntryEditorBorderBrush" Color="Transparent" />
<Thickness x:Key="PaletteEntryEditorBorderThickness">0 0 0 0</Thickness>
<Color x:Key="SystemChromeAltHighColor">#FFFFFFFF</Color>
<Color x:Key="SystemChromeMediumColor">#FFFFFFFF</Color>
<AcrylicBrush x:Key="SystemControlAcrylicWindowBrush" BackgroundSource="HostBackdrop" TintColor="{ThemeResource SystemChromeAltHighColor}" TintOpacity="0.8" FallbackColor="{ThemeResource SystemChromeMediumColor}" />
</ResourceDictionary>
<ResourceDictionary x:Key="HighContrast">
@ -35,8 +41,7 @@
<local:NullableColorToStringConverter x:Key="NullableColorToStringConverter" />
<Color x:Key="SystemAccentColor">#ff0073CF</Color>
<Color x:Key="SystemChromeAltHighColor">#FF32a852</Color>
<Color x:Key="SystemChromeMediumColor">#FF32a852</Color>
<Color x:Key="SystemChromeAltHighColor_Dark">#FF2B2B2B</Color>
<Color x:Key="SystemChromeMediumColor_Dark">#FF2B2B2B</Color>