Gamer-Style Keys and Red background with opacity

Author: GetGet99

ContextSwitch/ContextSwitch.csproj

@@ -13,6 +13,9 @@
 		<EnableMsixTooling>true</EnableMsixTooling>
 		<WindowsSDKPackageVersion>10.0.26100.38</WindowsSDKPackageVersion>
 	</PropertyGroup>
+	<PropertyGroup>
+		<!--<WindowsPackageType>None</WindowsPackageType>-->
+	</PropertyGroup>
 	<ItemGroup>
 	  <None Remove="Assets\ContextSwitchIcon.png" />
 	</ItemGroup>

ContextSwitch/Controls.cs

@@ -0,0 +1,54 @@
+using Microsoft.UI;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using Microsoft.UI.Xaml.Media;
+using System;
+
+namespace ContextSwitch;
+
+static class Controls
+{
+    public static Border Key(string key, Thickness? margin = null)
+        => new()
+        {
+            Margin = margin ?? new(4),
+            Padding = new(4),
+            CornerRadius = new(4),
+            BorderThickness = new(1),
+            BorderBrush = new SolidColorBrush(Colors.White),
+            Child = new TextBlock { Text = key, FontSize = 10, TextLineBounds = TextLineBounds.Tight }
+        };
+    public static TextBlock Text(string txt, TextLineBounds lineBounds = TextLineBounds.Full)
+        => new()
+        {
+            Text = txt,
+            TextLineBounds = lineBounds
+        };
+    public static StackPanel HStack(bool center = false, params UIElement[] uIElements)
+    {
+        var sp = new StackPanel { Orientation = Orientation.Horizontal };
+        foreach (var element in uIElements)
+        {
+            if (center && element is FrameworkElement fe)
+                fe.VerticalAlignment = VerticalAlignment.Center;
+            sp.Children.Add(element);
+        }
+        return sp;
+    }
+    public static StackPanel VStack(bool center = false, params UIElement[] uIElements)
+    {
+        var sp = new StackPanel { Orientation = Orientation.Vertical };
+        foreach (var element in uIElements)
+        {
+            if (center && element is FrameworkElement fe)
+                fe.HorizontalAlignment = HorizontalAlignment.Center;
+            sp.Children.Add(element);
+        }
+        return sp;
+    }
+    public static T WithCustomCode<T>(this T input, Action<T> act)
+    {
+        act(input);
+        return input;
+    }
+}

ContextSwitch/FloatingTimer.cs

@@ -14,7 +14,7 @@
 using Microsoft.UI.Xaml.Hosting;
 using System.Numerics;
 using Microsoft.UI.Composition;
-
+using static ContextSwitch.Controls;
 
 namespace ContextSwitch;
 
@@ -180,12 +180,8 @@ void TimerCallback()
             lockHide = true;
             Content.Opacity = 1;
             keyReset = true;
-            ((StackPanel)Content).Children.Add(new TextBlock {
-                FontSize = 11,
-                Text = "Press R-CTRL to reset",
-                TextLineBounds = TextLineBounds.Tight,
-                VerticalAlignment = VerticalAlignment.Center
-            });
+            ((StackPanel)Content).Children.Add(
+                HStack(center: true, Key("R-CTRL", new(0, 0, right: 5, 0)), Text("Reset Timer", TextLineBounds.Tight)));
             UpdateSize();
         }
     }
@@ -198,7 +194,9 @@ void ToggleRingState()
             ElementSoundPlayer.State = ElementSoundPlayerState.Off;
         } else
         {
-            background.Color = Colors.Red;
+            Color c = Colors.Red;
+            c.A = 255 / 2;
+            background.Color = c;
             ElementSoundPlayer.Play(ElementSoundKind.Invoke);
         }
         ringTimerAbnormalState = !ringTimerAbnormalState;

ContextSwitch/MainWindow.cs

@@ -10,6 +10,7 @@
 using Windows.Globalization;
 using WinUIEx;
 using WindowApi = WinWrapper.Windowing.Window;
+using static ContextSwitch.Controls;
 namespace ContextSwitch;
 
 class MainWindow : Window
@@ -44,24 +45,24 @@ void InitMain()
             Children =
             {
                 (titlebar = new()),
-                (main = new StackPanel
+                (main = VStack(
+                    center: true,
+                    ContextSwitchLogo(new(0, 0, 0, 50)),
+                    Text("How long should we do work before switching tasks?"),
+                    tp = new TimePicker {
+                        MinuteIncrement = 5,
+                        ClockIdentifier = ClockIdentifiers.TwentyFourHour,
+                        SelectedTime = TimeSpan.FromMinutes(25),
+                    },
+                    btn = new Button() { Content = "Start Timer" },
+                    HStack(center: true, Text("Tip: Hold"), Key("R-CTRL"), Text("to show timer"))
+                )
+                .WithCustomCode(x =>
                 {
-                    VerticalAlignment = VerticalAlignment.Center,
-                    HorizontalAlignment = HorizontalAlignment.Center,
-                    Spacing = 16,
-                    Children = {
-                        ContextSwitchLogo(new(0, 0, 0, 50)),
-                        new TextBlock { Text = "How long should we do work before switching tasks?", HorizontalAlignment = HorizontalAlignment.Center },
-                        (tp = new TimePicker {
-                            MinuteIncrement = 5,
-                            ClockIdentifier = ClockIdentifiers.TwentyFourHour,
-                            SelectedTime = TimeSpan.FromMinutes(25),
-                            HorizontalAlignment = HorizontalAlignment.Center,
-                        }),
-                        (btn = new Button() { Content = "Start Timer" , HorizontalAlignment = HorizontalAlignment.Center }),
-                        new TextBlock { Text = "Tip: Hold R-CTRL to show timer", HorizontalAlignment = HorizontalAlignment.Center }
-                    }
-                })
+                    x.VerticalAlignment = VerticalAlignment.Center;
+                    x.HorizontalAlignment = HorizontalAlignment.Center;
+                    x.Spacing = 16;
+                }))
             }
         };
         Grid.SetRow(main, 1);

ContextSwitch/Properties/launchSettings.json

@@ -4,7 +4,10 @@
       "commandName": "MsixPackage"
     },
     "ContextSwitch (Unpackaged)": {
-      "commandName": "Project"
+      "commandName": "Project",
+      "environmentVariables": {
+        "UNPKG": "true"
+      }
     }
   }
 }