Fix colors in KBM UI and add support for light/dark theme (#2256)

* Fixed colors for Edit Keyboard

* Fixed colors for Edit Shortcuts
This commit is contained in:
Arjun Balgovind
2020-04-21 13:42:06 -07:00
committed by GitHub
parent 2f244bca85
commit 5828508218
7 changed files with 6 additions and 36 deletions

View File

@@ -153,8 +153,8 @@ void KeyboardManagerState::AddKeyToLayout(const StackPanel& panel, const hstring
border.Padding({ 20, 10, 20, 10 });
border.Margin({ 0, 0, 10, 0 });
border.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
remapKey.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
// Use the base low brush to be consistent with the theme
border.Background(Windows::UI::Xaml::Application::Current().Resources().Lookup(box_value(L"SystemControlBackgroundBaseLowBrush")).as<Windows::UI::Xaml::Media::SolidColorBrush>());
remapKey.FontSize(20);
border.HorizontalAlignment(HorizontalAlignment::Left);
border.Child(remapKey);

View File

@@ -75,7 +75,6 @@ void createEditKeyboardWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMan
// Creating the Xaml content. xamlContainer is the parent UI element
Windows::UI::Xaml::Controls::StackPanel xamlContainer;
xamlContainer.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
// Header for the window
Windows::UI::Xaml::Controls::StackPanel header;
@@ -86,14 +85,11 @@ void createEditKeyboardWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMan
// Header text
TextBlock headerText;
headerText.Text(winrt::to_hstring("Remap Keyboard"));
headerText.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
headerText.FontSize(30);
headerText.Margin({ 0, 0, 1000, 0 });
// Header Cancel button
Button cancelButton;
cancelButton.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
cancelButton.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
cancelButton.Content(winrt::box_value(winrt::to_hstring("Cancel")));
cancelButton.Click([&](winrt::Windows::Foundation::IInspectable const& sender, RoutedEventArgs const&) {
// Close the window since settings do not need to be saved
@@ -103,25 +99,21 @@ void createEditKeyboardWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMan
// Text block for information about remap key section.
TextBlock keyRemapInfoHeader;
keyRemapInfoHeader.Text(winrt::to_hstring("Select the key you want to remap, original key, and it's new output when pressed, the new key"));
keyRemapInfoHeader.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
keyRemapInfoHeader.Margin({ 10, 0, 0, 10 });
// Table to display the key remaps
Windows::UI::Xaml::Controls::StackPanel keyRemapTable;
keyRemapTable.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
keyRemapTable.Margin({ 10, 10, 10, 20 });
keyRemapTable.Spacing(10);
// Header row of the keys remap table
Windows::UI::Xaml::Controls::StackPanel tableHeaderRow;
tableHeaderRow.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
tableHeaderRow.Spacing(100);
tableHeaderRow.Orientation(Windows::UI::Xaml::Controls::Orientation::Horizontal);
// First header textblock in the header row of the keys remap table
TextBlock originalKeyRemapHeader;
originalKeyRemapHeader.Text(winrt::to_hstring("Original Key:"));
originalKeyRemapHeader.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
originalKeyRemapHeader.FontWeight(Text::FontWeights::Bold());
originalKeyRemapHeader.Margin({ 0, 0, 0, 10 });
tableHeaderRow.Children().Append(originalKeyRemapHeader);
@@ -129,7 +121,6 @@ void createEditKeyboardWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMan
// Second header textblock in the header row of the keys remap table
TextBlock newKeyRemapHeader;
newKeyRemapHeader.Text(winrt::to_hstring("New Key:"));
newKeyRemapHeader.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
newKeyRemapHeader.FontWeight(Text::FontWeights::Bold());
newKeyRemapHeader.Margin({ 0, 0, 0, 10 });
tableHeaderRow.Children().Append(newKeyRemapHeader);
@@ -195,8 +186,6 @@ void createEditKeyboardWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMan
// Main Header Apply button
Button applyButton;
applyButton.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
applyButton.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
applyButton.Content(winrt::box_value(winrt::to_hstring("Apply")));
applyButton.Flyout(applyFlyout);
applyButton.Click([&](winrt::Windows::Foundation::IInspectable const& sender, RoutedEventArgs const&) {
@@ -269,8 +258,6 @@ void createEditKeyboardWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMan
// Add remap key button
Windows::UI::Xaml::Controls::Button addRemapKey;
addRemapKey.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
addRemapKey.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
FontIcon plusSymbol;
plusSymbol.FontFamily(Xaml::Media::FontFamily(L"Segoe MDL2 Assets"));
plusSymbol.Glyph(L"\xE109");

View File

@@ -76,11 +76,9 @@ void createEditShortcutsWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMa
// Creating the Xaml content. xamlContainer is the parent UI element
Windows::UI::Xaml::Controls::StackPanel xamlContainer;
xamlContainer.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
// Header for the window
Windows::UI::Xaml::Controls::StackPanel header;
header.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
header.Orientation(Windows::UI::Xaml::Controls::Orientation::Horizontal);
header.Margin({ 10, 10, 10, 30 });
header.Spacing(10);
@@ -101,13 +99,11 @@ void createEditShortcutsWindow(HINSTANCE hInst, KeyboardManagerState& keyboardMa
// Table to display the shortcuts
Windows::UI::Xaml::Controls::StackPanel shortcutTable;
shortcutTable.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
shortcutTable.Margin({ 10, 10, 10, 20 });
shortcutTable.Spacing(10);
// Header row of the shortcut table
Windows::UI::Xaml::Controls::StackPanel tableHeaderRow;
tableHeaderRow.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
tableHeaderRow.Spacing(100);
tableHeaderRow.Orientation(Windows::UI::Xaml::Controls::Orientation::Horizontal);

View File

@@ -13,7 +13,6 @@ void ShortcutControl::AddNewShortcutControlRow(StackPanel& parent, std::vector<s
{
// Parent element for the row
Windows::UI::Xaml::Controls::StackPanel tableRow;
tableRow.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
tableRow.Spacing(100);
tableRow.Orientation(Windows::UI::Xaml::Controls::Orientation::Horizontal);
@@ -27,7 +26,6 @@ void ShortcutControl::AddNewShortcutControlRow(StackPanel& parent, std::vector<s
// ShortcutControl for the new shortcut
tableRow.Children().Append(keyboardRemapControlObjects[keyboardRemapControlObjects.size() - 1][1]->getShortcutControl());
// Delete row button
Windows::UI::Xaml::Controls::Button deleteShortcut;
FontIcon deleteSymbol;
@@ -61,7 +59,6 @@ void ShortcutControl::AddNewShortcutControlRow(StackPanel& parent, std::vector<s
// Initialize both shortcuts as empty shortcuts
shortcutRemapBuffer.push_back(std::vector<Shortcut>{ Shortcut(), Shortcut() });
}
}
// Function to add a shortcut to the shortcut control as combo boxes
@@ -106,8 +103,6 @@ void ShortcutControl::createDetectShortcutWindow(winrt::Windows::Foundation::IIn
// ContentDialog for detecting shortcuts. This is the parent UI element.
ContentDialog detectShortcutBox;
// TODO: Hardcoded light theme, since the app is not theme aware ATM.
detectShortcutBox.RequestedTheme(ElementTheme::Light);
// ContentDialog requires manually setting the XamlRoot (https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.contentdialog#contentdialog-in-appwindow-or-xaml-islands)
detectShortcutBox.XamlRoot(xamlRoot);
detectShortcutBox.Title(box_value(L"Press the keys in shortcut:"));
@@ -172,7 +167,8 @@ void ShortcutControl::createDetectShortcutWindow(winrt::Windows::Foundation::IIn
detectShortcutBox.Dispatcher().RunAsync(
Windows::UI::Core::CoreDispatcherPriority::Normal,
[primaryButton] {
primaryButton.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::DarkGray() });
// Use the base medium low brush to be consistent with the theme
primaryButton.Background(Windows::UI::Xaml::Application::Current().Resources().Lookup(box_value(L"SystemControlBackgroundBaseMediumLowBrush")).as<Windows::UI::Xaml::Media::SolidColorBrush>());
});
},
[onAccept, detectShortcutBox](DWORD) {

View File

@@ -31,7 +31,6 @@ public:
ShortcutControl(const size_t rowIndex, const size_t colIndex)
{
shortcutDropDownStackPanel.RequestedTheme(ElementTheme::Light);
shortcutDropDownStackPanel.Spacing(10);
shortcutDropDownStackPanel.Orientation(Windows::UI::Xaml::Controls::Orientation::Horizontal);
KeyDropDownControl::AddDropDown(shortcutDropDownStackPanel, rowIndex, colIndex, shortcutRemapBuffer, keyDropDownControlObjects);
@@ -43,7 +42,6 @@ public:
createDetectShortcutWindow(sender, sender.as<Button>().XamlRoot(), shortcutRemapBuffer, *keyboardManagerState, rowIndex, colIndex);
});
shortcutControlLayout.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
shortcutControlLayout.Margin({ 0, 0, 0, 10 });
shortcutControlLayout.Spacing(10);

View File

@@ -13,7 +13,6 @@ void SingleKeyRemapControl::AddNewControlKeyRemapRow(StackPanel& parent, std::ve
{
// Parent element for the row
Windows::UI::Xaml::Controls::StackPanel tableRow;
tableRow.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
tableRow.Spacing(100);
tableRow.Orientation(Windows::UI::Xaml::Controls::Orientation::Horizontal);
@@ -51,8 +50,6 @@ void SingleKeyRemapControl::AddNewControlKeyRemapRow(StackPanel& parent, std::ve
// Delete row button
Windows::UI::Xaml::Controls::Button deleteRemapKeys;
deleteRemapKeys.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
deleteRemapKeys.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
FontIcon deleteSymbol;
deleteSymbol.FontFamily(Xaml::Media::FontFamily(L"Segoe MDL2 Assets"));
deleteSymbol.Glyph(L"\xE74D");
@@ -83,8 +80,6 @@ void SingleKeyRemapControl::createDetectKeyWindow(winrt::Windows::Foundation::II
// ContentDialog for detecting remap key. This is the parent UI element.
ContentDialog detectRemapKeyBox;
// TODO: Hardcoded light theme, since the app is not theme aware ATM.
detectRemapKeyBox.RequestedTheme(ElementTheme::Light);
// ContentDialog requires manually setting the XamlRoot (https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.contentdialog#contentdialog-in-appwindow-or-xaml-islands)
detectRemapKeyBox.XamlRoot(xamlRoot);
detectRemapKeyBox.Title(box_value(L"Press a key on selected keyboard:"));
@@ -147,7 +142,8 @@ void SingleKeyRemapControl::createDetectKeyWindow(winrt::Windows::Foundation::II
detectRemapKeyBox.Dispatcher().RunAsync(
Windows::UI::Core::CoreDispatcherPriority::Normal,
[primaryButton] {
primaryButton.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::DarkGray() });
// Use the base medium low brush to be consistent with the theme
primaryButton.Background(Windows::UI::Xaml::Application::Current().Resources().Lookup(box_value(L"SystemControlBackgroundBaseMediumLowBrush")).as<Windows::UI::Xaml::Media::SolidColorBrush>());
});
},
[onAccept, detectRemapKeyBox](DWORD) {

View File

@@ -26,15 +26,12 @@ public:
singleKeyRemapDropDown(rowIndex, colIndex, singleKeyRemapBuffer)
{
typeKey.Content(winrt::box_value(winrt::to_hstring("Type Key")));
typeKey.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
typeKey.Foreground(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::Black() });
typeKey.Click([&, rowIndex, colIndex](winrt::Windows::Foundation::IInspectable const& sender, RoutedEventArgs const&) {
keyboardManagerState->SetUIState(KeyboardManagerUIState::DetectSingleKeyRemapWindowActivated, EditKeyboardWindowHandle);
// Using the XamlRoot of the typeKey to get the root of the XAML host
createDetectKeyWindow(sender, sender.as<Button>().XamlRoot(), singleKeyRemapBuffer, *keyboardManagerState, rowIndex, colIndex);
});
singleKeyRemapControlLayout.Background(Windows::UI::Xaml::Media::SolidColorBrush{ Windows::UI::Colors::LightGray() });
singleKeyRemapControlLayout.Margin({ 0, 0, 0, 10 });
singleKeyRemapControlLayout.Spacing(10);