Edi Wang

Automating Price Calculation from File Names Using PowerShell

2025-01-02T08:08:35Z

Problem

In many industries, files are named using conventions that embed useful metadata directly in the file name. For example, in e-commerce, logistics, or billing systems, file names might include prices, order numbers, or other key details.

In my case, I have a folder full of PDF files, each named with a format like Hotel-996.35.pdf, where the last part (996.35) represents the price of this invoice. Now, I want to calculate the total price of all transactions by summing up the prices embedded in these file names. Doing this manually for a large number of files is time-consuming and is easy to make errors.

By using PowerShell, you can quickly extract prices from file names and calculate the total. This blog post show you a PowerShell script that solves this problem efficiently.

Solution

The following PowerShell script below automates the process of extracting prices from file names and calculating their total.

$directory = Get-Location
$totalPrice = 0
$pdfFiles = Get-ChildItem -Path $directory

foreach ($file in $pdfFiles) {
    if ($file.BaseName -match "-([0-9]+(\.[0-9]{1,2})?)") {
		Write-Host "Found: " $file.Name		
		$unitPrice = [decimal]::Parse($matches[1], [Globalization.NumberStyles]::Float)
        $totalPrice += $unitPrice
    }
}

Write-Host "Total: $totalPrice"

Let’s break down how it works step by step.

1. Working Directory

Get the current working directory using the Get-Location cmdlet. This is the folder where the script will look for files.

$directory = Get-Location

2. Retrieve Files in the Directory

The Get-ChildItem cmdlet retrieves all files in the specified directory. By default, it fetches all file types, but you can filter it to only include PDF files by adding a -Filter parameter (e.g., -Filter *.pdf).

$pdfFiles = Get-ChildItem -Path $directory

3. Extract the Price Using Regex

The -match operator is used to apply a regular expression (regex) to the file's base name (the file name without extension). The regex pattern -([0-9]+(\.[0-9]{1,2})?) is designed to match a hyphen (-) followed by a number.

[0-9]+: Matches one or more digits (e.g., 996).
(\.[0-9]{1,2})?: Optionally matches a decimal point followed by 1 or 2 digits (e.g., .35).
The entire pattern is enclosed in parentheses to capture the matched number for later use.

If a match is found, the matched value is stored in the $matches automatic variable.

$file.BaseName -match "-([0-9]+(\.[0-9]{1,2})?)"

4. Convert the Price to Decimal

The matched price (stored in $matches[1]) is converted to a decimal number using the [decimal]::Parse() method.

$unitPrice = [decimal]::Parse($matches[1], [Globalization.NumberStyles]::Float)

5. Add Total Price

$totalPrice += $unitPrice

Conclusion

This PowerShell script provides a simple yet powerful solution to a common problem: extracting numeric data from file names and performing calculations. You can modify it to make it works for your scenarios!

How to Check If .NET Core Program is Running under Remote Desktop

2020-02-04T13:19:14Z

There are a few reasons that we need to know if our program is running under the Windows Remote Desktop (RDP) session. For example, if it is running under RDP, we may disable animation and other fancy graphics effects. But how can we detect if our program is currently under RDP? Let's see.

Windows Forms

If you are developing Windows Forms Apps using .NET Core 3.x, there's a built-in API that can return if the current program is under RDP: SystemInformation.TerminalServerSession

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();

        if (IsRDP)
        {
            MessageBox.Show("Under RDP");
        }
    }

    public static Boolean IsRDP => SystemInformation.TerminalServerSession;
}

Very straight forward.

Other .NET Core Programs

For other .NET Core program types that we can't use Windows Forms classes. We need to use the old school way: P/Invoke.

According to a Microsoft document, User32.dll got a method to return if the current invoker program is running under RDP: GetSystemMetrics( SM_REMOTESESSION )

Here, the SM_REMOTESESSION is actually an integer value, which can be presented as 0x1000 in C#. So the example code would be:

static void Main(string[] args)
{
    bool isRDP = GetSystemMetrics(SM_REMOTESESSION);
    Console.WriteLine($"Running under RDP: {isRDP}");

    Console.ReadKey();
}

const int SM_REMOTESESSION = 0x1000;

[DllImport("user32")]
static extern bool GetSystemMetrics(int index);

Tip: The ".dll" behind "user32" can actually be left out because .NET Core is smart enough to look for .dll on Windows systems and .so on Linux. But in this example, the code won't work on Linux since it neither has RDP nor user32 API :)

However, you should be very careful when using P/Invoke to call unmanaged code from managed code, in fact, you should avoid this trick as much as possible in .NET programming because it will make your code couple with a specific platform unless you write a whole bunch of platforms checking code. Anyway, it can get things complicated in seconds.

For more information on P/Invoke, please see Microsoft document: https://docs.microsoft.com/en-us/dotnet/standard/native-interop/pinvoke

Upgrade WinForms Apps from .NET Core 3.0 to 3.1

2019-12-06T05:37:51Z

I upgraded a WinForms App to .NET Core 3.1 these days. It's an open-source on-screen ruler created by Jeff Key in 2004, the original code was for .NET Framework 2.0, I've already upgraded it to .NET Core 3.0 in September this year, it was very smooth without any code change. But this time, .NET Core 3.1 does require some code changes.

The project is on my GitHub: https://github.com/EdiWang/Ruler

According to Microsoft .NET Blog, .NET Core 3.1 for Windows Forms has some breaking changes by removing some controls.

The following Windows Forms controls have been removed from .NET Core 3.1:

DataGrid

ToolBar

ContextMenu

Menu

MainMenu

MenuItem

These controls were replaced with more powerful controls in .NET Framework 2.0, back in 2005. They have not been available by default in the Visual Studio Designer Toolbox for many years. As a result, we decided to remove these controls and focus only on the new ones.

And they have recommended replacements for these controls:

Old Control (API)	Recommended Replacement	Other associated APIs removed
DataGrid	DataGridView	DataGridCell, DataGridRow, DataGridTableCollection, DataGridColumnCollection, DataGridTableStyle, DataGridColumnStyle, DataGridLineStyle, DataGridParentRowsLabel, DataGridParentRowsLabelStyle, DataGridBoolColumn, DataGridTextBox, GridColumnStylesCollection, GridTableStylesCollection, HitTestType
ToolBar	ToolStrip	ToolBarAppearance
ToolBarButton	ToolStripButton	ToolBarButtonClickEventArgs, ToolBarButtonClickEventHandler, ToolBarButtonStyle, ToolBarTextAlign
ContextMenu	ContextMenuStrip
Menu	ToolStripDropDown, ToolstripDropDownMenu	MenuItemCollection
MainMenu	MenuStrip
MenuItem	ToolstripMenuItem

In the Ruler project, I need to migrate just the menu controls besides retargeting the runtime version.

<TargetFramework>netcoreapp3.1</TargetFramework>

Type Replacement

Replace ContextMenu with ContextMenuStrip, and replace MenuItem with ToolStripMenuItem

For example, the old code:

private readonly ContextMenu _menu = new ContextMenu();
private MenuItem _verticalMenuItem;
private MenuItem _toolTipMenuItem;

Is replaced with

private readonly ContextMenuStrip _menu = new ContextMenuStrip();
private ToolStripMenuItem _verticalMenuItem;
private ToolStripMenuItem _toolTipMenuItem;

API Differences

Shortcut Enum that used by MenuItem isn't there anymore. Replace old code:

private MenuItem AddMenuItem(string text, Shortcut shortcut = Shortcut.None)
{
    MenuItem mi = new MenuItem(text);
    mi.Click += MenuHandler;
    mi.Shortcut = shortcut;
    _menu.MenuItems.Add(mi);

    return mi;
}

with new code

private ToolStripMenuItem AddMenuItem(string text, Keys shortcut = Keys.None)
{
    ToolStripMenuItem mi = new ToolStripMenuItem(text);
    mi.Click += MenuHandler;
    mi.ShortcutKeys = shortcut;
    _menu.Items.Add(mi);

    return mi;
}

In the old Menu control, the "-" string represented a separator, which is now replaced by ToolStripSeparator. So, old code:

AddMenuItem("-");

Is now

_menu.Items.Add(new ToolStripSeparator());

Finally, the new menu looks like this:

The project is very simple, so everything works after a few code changes in .NET Core 3.1. As you can see, to replace the old controls isn't too much difficult. Hope you can also get your old project running on the latest platform soon!

About Per Monitor-DPI aware for WinForms Applications

2019-07-23T05:47:55Z

WinForms is the traditional .NET desktop application workload running on Windows. For historical reasons, there are some problems with its support for high DPI and for different DPI screens, and this article explores the possible solutions.

Windows "96" PPI history

The default DPI for Windows systems (more precisely called PPI) is 96. PPI means pixel per inch, which means how many pixels are displayed per inch screen.

The higher this value, the more delicate the display capability of the screen. But it also means that to display the same picture as a low PPI screen, a high PPI screen needs more pixels to fill. For a non-vector graph, this problem is not easy to solve, because of the high pixel stretch, the picture will be "pulled blurred." Similar problems occur in Windows, especially in older programs, which are designed with only 96 PPI in mind. This historical reason can be found in Microsoft's blog:

https://blogs.msdn.microsoft.com/fontblog/2005/11/08/where-does-96-dpi-come-from-in-windows/

Example: On a 150% DPI screen, the Windows Management Console (MMC) is blurred.

Windows 10 improvements

With more and more HDPI computers on the market today, Windows 10's semi-annual Feature Updates has been working to resolve DPI issues. We can fix many old programs with the settings shown in the following image. But it's hard to adapt across screens with different DPI.

The so-called Per Monitor-DPI aware means that when your computer has an external screen, Windows chooses a DPI that fits the screen to display an image of the external screen. This DPI is probably different from your computer's main screen. For example, with a 22-inch display with 1920x1080 attached to a Surface Pro, the Surface's home screen is typically more than 150% DPI, while the external display is 100%.

If the program doesn't support Per Monitor-DPI aware itself, you can try the compatibility mode that comes with Windows. You will find that although both screens have clear images, the app interface is magnified on a low DPI screen. It's not perfect. So the most authentic solution is to develop programs that support Per Monitor-DPI aware.

Microsoft's own applications have also improved regarding Per Monitor-DPI aware. For example, Visual Studio 2019 supports Per Monitor-DPI aware. (Windows 10 v1803 and .NET Framework 4.8)

What can we do about WinForms applications?

The three most native technologies for Windows desktop development are WinForms, WPF, and UWP. Because UWP was born in modern times, there is no DPI adaptation problem. WPF's XAML interface can also be easily adapted to DPI. But WinForms is way too old. Let's try to save it.

First of all, I use the 150% DPI main screen with VS2019, the designer view is not blurry, the control position is as follows:

Pay attention to the position of the red arrow. Everything's fine in VS. However, when it runs, the main screen at 150% DPI is blurry and the controls are misplaced.

Drag the window to the 100% DPI external screen, the UI is not blurry, but the controls are still misplaced.

According to Microsoft's documentation https://docs.microsoft.com/en-us/dotnet/framework/winforms/high-dpi-support-in-windows-forms, .NET Framework improves WinForms' DPI support starting at 4.7. So I changed the runtime of the program to 4.7.2 (Windows 10 1803 or more comes with it) Add an app.manifest file to the app root.

Uncomment Windows 10 GUID under assembly/compatibility/application.

<!-- Windows 10 -->
<supportedOS Id="{8e0f7a12-bfb3-4fe8-b9a5-48fd50a15a9a}" />

Add these into App.config

<System.Windows.Forms.ApplicationConfigurationSection>
  <add key="DpiAwareness" value="PerMonitorV2" />
</System.Windows.Forms.ApplicationConfigurationSection>

Now you find that the control position is displayed correctly on the home screen of 150% DPI, and the entire UI is not blurred.

But on a 100% DPI screen, although the UI is not blurry, the control position is still incorrect, and the TextBox control is huge.

There's no other way out of the Microsoft documentation. But I found that changing the runtime to .NET Framework 4.8 could fix the TextBox, with the control location still incorrect.

On closer inspection, it's not TextBox, Label, Checkbox that's causing the problem, but the MonthCalendar control is much wider on a 100% DPI screen than on a 150% DPI screen. And the combination of Panel, TableLayoutPanel and Dock won't solve the problem.

What about .NET Core 3.0

Net Core 3.0 is still in preview 6. From the results of my experiment, its DPI settings do not require App.config, but add this into program.cs:

Application.SetHighDpiMode(HighDpiMode.PerMonitorV2);

But unfortunately, the result is the same as above .NET Framework applications.

Conclusion

On Windows 10 v1903 (I haven't tried other versions), with .NET Framework 4.8, WinForms can get a certain level of Per Monitor-DPI aware, but some controls will be rendered in incorrect sizes, so you need to carefully test before publishing the application.

Read and Write Windows Registry in .NET Core

2019-03-04T07:42:19Z

Yes, you read it right! It's totally possible! Even .NET Core is designed to be cross platform, but it does not mean you can not use platform specific APIs. Take Windows Registry for example, although .NET Standard can not contain Windows API like this. But there's still a way to use Windows Regisitry in .NET Core Applications.

But first, you should be absolutely clear, that using platform specific APIs like Windows Regisitry will make your App or that part of code Windows only. Let's see how can we use read and write Windows Registry in .NET Core.

Microsoft.Win32.Registry

The API for Windows Registry is contained in package: Microsoft.Win32.Registry. It is a part of the Windows Compatibility Pack, which is designed to help developers to port their old .NET Framework applications to .NET Core piece by piece.

Add this package to your .NET Core Application:

dotnet add package Microsoft.Win32.Registry

This contains types as:

Microsoft.Win32.RegistryKey
Microsoft.Win32.Registry
Microsoft.Win32.RegistryValueKind
Microsoft.Win32.RegistryHive
Microsoft.Win32.RegistryView

and add the namespace into your code:

using Microsoft.Win32;

Write Registry

I choose HKEY_CURRENT_USER to do this demo, because it does not require administrator privilege to access.

using (RegistryKey key = Registry.CurrentUser.CreateSubKey(@"SOFTWARE\edi_wang"))
{
    key.SetValue("Title", $".NET Core Rocks! {DateTime.UtcNow:MM/dd/yyyy-HHmmss}");
}

This will create a key "edi_wang" under HKEY_CURRENT_USER\Software, and create a string named "Title" with value like ".NET Core Rocks! 03/04/2019-073320"

Read Registry

To read this value from registry:

using (RegistryKey key = Registry.CurrentUser.OpenSubKey(@"SOFTWARE\edi_wang"))
{
    if (key != null)
    {
        Object o = key.GetValue("Title");
        Console.WriteLine(o.ToString());
    }
}

And we can get:

Check Platform

We know these code only works on Windows. So in practice, when we have to access Registry in .NET Core Application. We need to check the current platform before executing the code.

if (System.Runtime.InteropServices.RuntimeInformation.IsOSPlatform(OSPlatform.Windows))
{
    // Registry Code
}

Finally, the example code is on my GitHub: https://github.com/EdiWang/DotNet-Samples/tree/master/NetCoreRegistry

How to Remove Default FDS Effects in UWP Apps

2018-12-31T13:02:55Z

The Fluent Design System introduced by Windows 10 from v1709 is very beautiful, the latest v1809 further refined FDS, many UWP built in controls got FDS effect by default while developers do not need to do anything. This is usually a good thing, but it can also cause performance problems for some apps. My Character Map UWP is one of the victimized apps, and let's take a look at how to remove the default FDS effect in a UWP app to avoid performance issues.

The Problem

The specific problem is that Character Map UWP has is that the same version, the same code, can run smoothly on Windows 1809 v1803, but and after upgrading to 1908, even scrolling a little bit on he page, select a few characters can immediately stuck the App.

A few days ago, I received an email from a user saying that just turning off the transparency in Windows 10 personalization settings, that is, turning off all FDS, would allow the app to resume responding.

The main performance impact is the GridViewItem and ListViewItem got the reveal effect, which is one of the effects of FDS. That is, when the mouse moves onto the element, the surrounding border is highlighted. In my Character Map UWP, this affects performance, mainly because GridView shows hundreds of or even tens of thousands of characters, this is way too much for the FDS to render.

Fixing the Problem

On Windows 10 v1809, the reveal effects of GridViewItem and ListViewItem are turned on by default, it do not require any designation from the developer, and do not require updating the code of the old app, it will appear automatically. However, it is not so straightforward to turn off.

The way to turn off the default reveal effect is to rewrite several brush key in the system, and for my application, I need to rewrite these keys:

<SolidColorBrush x:Key="SystemControlTransparentRevealBackgroundBrush" Color="Transparent" />
<SolidColorBrush x:Key="SystemControlTransparentRevealBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBorderBrush" Color="Transparent" />
<Thickness x:Key="ListViewItemRevealBorderThemeThickness">0</Thickness>
<Thickness x:Key="GridViewItemRevealBorderThemeThickness">0</Thickness>
<SolidColorBrush x:Key="ListViewItemRevealBackgroundSelectedPressed" Color="Transparent" />
<SolidColorBrush x:Key="ListViewItemRevealPlaceholderBackground" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackground" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundPointerOver" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundPressed" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundSelected" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundSelectedPointerOver" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundSelectedPressed" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealPlaceholderBackground" Color="Transparent" />

Now run the app and you'll find that the reveal effect is gone and the overall experience is very good.

How did I Find These Keys

As for how these keys were found, it's actually very simple, after you install the UWP SDK, all the system's brush and other style definitions of the controls are in this file:

C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\10.0.17763.0\Generic\generic.xaml

Open ths file and search for "Reveal", you can find everything:

Automate Windows 10 Developer Machine Setup

2018-12-21T13:12:23Z

One of the things programmers hate most is probably setup a computer. Because the programmer's computer environment configuration is very different from normal people. In general, it takes several hours to manually install a new development machine. Let this process automating, after all, the essence of programming is to let complex things simplify, find a way to be lazy!

In fact, automatic installation and configuration of Windows is nothing new, as early as more than 10 years ago that the folk in computer stores used packaging image to achieve a one-click installation system and software. There are many ways to do this, such as editing Windows installation image through Microsoft or a third-party tool, adding automatic answer files, and finally installing common software with silent parameters, as well as a lazier Ghost images, and so on. More than 10 years ago, I was passionate about packaging windows, scripting and installing software also.

The method I introduced today is different from what it was more than 10 years ago, comparing to 10 years ago, now we must face some new problems:

Software updates are becoming more frequent, and every time you install a computer, you want to use the latest version. Traditional way of packaging applications will be out of date in a few days.
Applications does not want to be distributed with operating system, Windows 10 is in semi-annual update, maintain the traditional way of OS image packaged with Applications is very laborious.
Normal people's computers are easy to install without the need to specifically design automatic tools. But programmers' environments are becoming more complex with more tools.

In response to these realities, I chose to use PowerShell and Choco to design a new automatic setup script. PowerShell is Responsible for configuring Windows while Choco can automatically download the latest software installation package from the Internet and install it silently. This way, you don't have to integrate the software installation package into the Windows image.

In my own case, I am an ASP.NET Programmers, but also do some UWP development. So, for me, the environmental requirements are:

Windows 10 Pro
Enable IIS + ASP.NET
Enable Developer Mode
Install Chrome, 7z, NotePad++, VSCode, LINQPad etc.

Let's see how PowerShell + Choco automate these tasks. The code for my entire setup script is open source, and there is a GitHub link in the end of this article, so this article only describes the key steps and code. For full script, you can see GitHub while free to modify and use. I welcome everyone to participate in the contribution, together we can complete a script for the benefit of a variety of programmers.

Rename Computer

The first step I like to rename the computer for easier management. In PowerShell, you can use the Rename-Computer command to do this.

To get the user input value, use command Read-Host. For output text, use Write-Host. To assign a value to a variable, use =.

The PowerShell code that requires the user to enter the computer name and rename it is as follows:

$computerName = Read-Host 'Enter New Computer Name'
Write-Host "Renaming this computer to: " $computerName  -ForegroundColor Yellow
Rename-Computer -NewName $computerName

Of course, this step requires restarting the computer to take effect, we will do it later.

Disable Auto Sleep

We don't want the computer to go to sleep in the middle of the automatic setup process. So we need to disable auto sleep when the AC power is plugin.

Use PowerCfg command to set the screen timeout to 20 minutes, and disable auto sleep in AC power.

Powercfg /Change monitor-timeout-ac 20
Powercfg /Change standby-timeout-ac 0

Desktop Icons

A newly installed Windows 10 machine does not have "This PC" icon by default on the desktop. However there is a short cut icon for Microsoft Edge, the browser which its only purpose is to download Chrome, and it is becoming Chromium anyway. So we don't need it. Lets take out Edge icon and add "This PC" to our desktop.

To add "This PC" icon, we just need to modify the Registry.

$thisPCIconRegPath = "HKCU:\Software\Microsoft\Windows\CurrentVersion\Explorer\HideDesktopIcons\NewStartPanel"
$thisPCRegValname = "{20D04FE0-3AEA-1069-A2D8-08002B30309D}"
$item = Get-ItemProperty -Path $thisPCIconRegPath -Name $thisPCRegValname -ErrorAction SilentlyContinue

if ($item) {
Set-ItemProperty  -Path $thisPCIconRegPath -name $thisPCRegValname -Value 0  
}

else {
New-ItemProperty -Path $thisPCIconRegPath -Name $thisPCRegValname -Value 0 -PropertyType DWORD  | Out-Null  
}

Removing Edge short cut is very simple, just delete the file directly. The way to use environment variables in PowerShell is to use $env keywords.

The current user's environment variable is userprofile, Edge is on the desktop.

$edgeLink = $env:USERPROFILE + "\Desktop\Microsoft Edge.lnk"
Remove-Item $edgeLink

Install IIS

IIS is used to maintain some old ASP.NET projects.

The command for enabling Windows features in PowerShell is Enable-WindowsOptionalFeature, with "-All" parameter, it can install dependencies automatically.

Enable-WindowsOptionalFeature -Online -FeatureName IIS-DefaultDocument -All
Enable-WindowsOptionalFeature -Online -FeatureName IIS-HttpCompressionDynamic -All
Enable-WindowsOptionalFeature -Online -FeatureName IIS-HttpCompressionStatic -All
Enable-WindowsOptionalFeature -Online -FeatureName IIS-WebSockets -All
Enable-WindowsOptionalFeature -Online -FeatureName IIS-ApplicationInit -All
Enable-WindowsOptionalFeature -Online -FeatureName IIS-ASPNET45 -All
Enable-WindowsOptionalFeature -Online -FeatureName IIS-ServerSideIncludes
Enable-WindowsOptionalFeature -Online -FeatureName IIS-BasicAuthentication
Enable-WindowsOptionalFeature -Online -FeatureName IIS-WindowsAuthentication

By the way, DISM command can also do this task.

Enable Windows 10 Developer Mode

The developer mode on Windows 10 is for UWP development. To enable it, just edit Registry.

reg add "HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\AppModelUnlock" /t REG_DWORD /f /v "AllowDevelopmentWithoutDevLicense" /d "1"

Enable Remote Desktop

Modify Registry and enable firewall.

Set-ItemProperty "HKLM:\SYSTEM\CurrentControlSet\Control\Terminal Server\" -Name "fDenyTSConnections" -Value 0
Set-ItemProperty "HKLM:\SYSTEM\CurrentControlSet\Control\Terminal Server\WinStations\RDP-Tcp\" -Name "UserAuthentication" -Value 1
Enable-NetFirewallRule -DisplayGroup "Remote Desktop"

Install Choco for Windows

Chocolatey is the tool we are about to use for automatically installing applications. It is just like apt/yum on Linux. We will use the official script to install:

Set-ExecutionPolicy Bypass -Scope Process -Force; iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))

Restart Windows

We changed the computer name in the first step, it requires reboot of the system. We can let the user to trigger the reboot by asking the user to press enter key. In PowerShell, we use Restart-Computer to reboot the system. You can also do it with shutdown -r -t 0

Read-Host -Prompt "Configuration is done, restart is needed, press [ENTER] to restart computer."
Restart-Computer

Self Elevate

As you may have discovered, the steps above are almost all requiring administrator privileges to be performed. We can run PowerShell as administrator manually, but it is more convenient to run under normal permissions and elevate itself to administrator permissions. Put this in the header of the script file:

if (!([Security.Principal.WindowsPrincipal][Security.Principal.WindowsIdentity]::GetCurrent()).IsInRole([Security.Principal.WindowsBuiltInRole] "Administrator")) { Start-Process powershell.exe "-NoProfile -ExecutionPolicy Bypass -File `"$PSCommandPath`"" -Verb RunAs; exit }

In this way, the script detects whether it currently has administrative permissions, and if not, a UAC will pop up to request an administrator right to PowerShell and continue running the current script.

Use Choco to Automatically Install Applications

After restart Windows, we can use choco command to install applications under PowerShell or CMD with Administrator previlege. I choose CMD this time.

There are plenty of applications in chocolatey gallery. Many of them are developer tools. You can check online: https://chocolatey.org/packages

Install command is: choco install [packagename] -y, which the "-y" means automatically respond "yes" to any confirm message. This is how we can install applications unattended.

So, the batch script to install applications is like this:

@echo ------------------------------------
@echo Installing 7-Zip...
@echo ------------------------------------
choco install 7zip.install -y

@echo.
@echo ------------------------------------
@echo Installing Google Chrome...
@echo ------------------------------------
choco install googlechrome -y

I have included the following applications in my script:

7-Zip
Google Chrome
Pot Player
Microsoft Teams
SysInternals
Lightshot
FileZilla
TeamViewer
Notepad++
Visual Studio Code
- C-Sharp
- Icons
- MSSQL
DotPeek
LINQPad
Fiddler
Git
GitHub for Windows
FFMpeg
CURL
WGet
OpenSSL
Beyond Compare

Delete Pre-Installed UWP Apps

The newly installed Windows 10 will include a few UWP applications we don't want. We can also delete them in PowerShell.

First, we need to find the UWP applications' package name, run Get-AppxPackage command, it will return a long list like this:

To delete an UWP application, the official way is to use PackageFullName to delete it. For example, Bing News:

Remove-AppxPackage -Package Microsoft.BingNews_4.28.3242.0_x64__8wekyb3d8bbwe

However, this can make problem. If Windows 10 updates this application in background, the version number will change, which will make your script useless. So I use another trick to delete the UWP appliction by name instead of full name.

Get-AppxPackage -Name Microsoft.BingNews | Remove-AppxPackage

We have a lot of UWP to delete, and the programmer's thinking is, of course, writing a loop, not copy of the command everywhere. The way you do loops in PowerShell is very similar to C #, using foreach syntax. In this example, I put the UWP name I want to delete in an array of strings, and then use loop to remove them.

$uwpRubbishApps = @(
    "Microsoft.Messaging",
    "king.com.CandyCrushSaga",
    "Microsoft.BingNews",
    "Microsoft.MicrosoftSolitaireCollection",
    "Microsoft.People",
    "Microsoft.WindowsFeedbackHub",
    "Microsoft.YourPhone",
    "Microsoft.MicrosoftOfficeHub",
    "Fitbit.FitbitCoach",
    "4DF9E0F8.Netflix")

foreach ($uwp in $uwpRubbishApps) {
    Get-AppxPackage -Name $uwp | Remove-AppxPackage
}

Now, we are finished with our automated setup on a Windows 10 machine!

The GitHub repository for my scripts is here: https://github.com/EdiWang/EnvSetup/

Build a Pixel Ruler with UWP

2018-11-05T02:59:30Z

In certain applications, we may need an on-screen ruler that indicates pixels on the screen. However, the only built-in ruler in UWP is within the InkToolbar control, we are not able to use it elsewhere. So, I will teach you how to build a pixel ruler which can be used anywhere in your UWP applications.

The Demo App

Create a new blank UWP application called PixelRulerUwp with minimal runtime version as Windows 10, version 1803 (10.0; Build 17134)

Win2D

Official document describes Win2D as: Win2D is an easy-to-use Windows Runtime API for immediate mode 2D graphics rendering with GPU acceleration. It is available to C#, C++ and VB developers writing apps for the Windows Universal Platform (UWP). It utilizes the power of Direct2D, and integrates seamlessly with XAML and CoreWindow.

We will use Win2D to draw the ruler. To add Win2D to our application, install it from NuGet:

Install-Package Win2D.uwp

Create PixelRuler User Control

Add a new user control called “PixelRuler.xaml” into your application.

The Win2D can draw things on a CanvasControl, so we need to add a CanvasControl named “RulerCanvas” which we are going to draw the ruler UI onto it.

This will need a new namespace to be added into UserControl attributes.

xmlns:xaml="using:Microsoft.Graphics.Canvas.UI.Xaml"

and then add the CanvasControl

<xaml:CanvasControl x:Name="RulerCanvas" 
                    VerticalAlignment="Top" />

This is not the final XAML code, we will also complete it later.

Create Binding Properties

The ruler needs at least a width and a background color. So, we need to add them into the code behind PixelRuler.xaml.cs

By implementing the INotifyPropertyChanged interface, we can enable bindings.

using System.ComponentModel;

and then:

public sealed partial class PixelRuler : UserControl, INotifyPropertyChanged

and implement it:

public event PropertyChangedEventHandler PropertyChanged;

[NotifyPropertyChangedInvocator]
private void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
    PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

Then, create the RulerWidth property:

public static readonly DependencyProperty RulerWidthProperty = DependencyProperty.Register(
    nameof(RulerWidth),
    typeof(int),
    typeof(PixelRuler),
    new PropertyMetadata(null)
);

public int RulerWidth
{
    get => (int)GetValue(RulerWidthProperty);
    set => SetValue(RulerWidthProperty, value);
}

The DependencyProperty type is usually used in UserControl so that the user can set values to it when using your UserControl.

Similarly, add the BackgroundColor property:

Include namespace

using Windows.UI;

And add:

public static readonly DependencyProperty BackgroundColorProperty = DependencyProperty.Register(
    nameof(BackgroundColor),
    typeof(Color),
    typeof(PixelRuler),
    new PropertyMetadata(null)
);

public Color BackgroundColor
{
    get => (Color)GetValue(BackgroundColorProperty);
    set { SetValue(BackgroundColorProperty, value); OnPropertyChanged(); }
}

Give them default values in the constructor:

public PixelRuler()
{
    this.InitializeComponent();
    RulerWidth = 50;
    BackgroundColor = Color.FromArgb(128, 238, 238, 238);
}

Now modify the PixelRuler.xaml and bind these properties.

<xaml:CanvasControl x:Name="RulerCanvas" 
                    Height="{x:Bind RulerWidth, Mode=OneWay}"
                    ClearColor="{x:Bind BackgroundColor, Mode=OneWay}"
                    VerticalAlignment="Top" />

Add the PixelRuler UserControl into your MainPage.xaml:

<local:PixelRuler HorizontalAlignment="Stretch"
                  VerticalAlignment="Top" />

Draw Ruler

To draw graphics onto the CanvasControl, use the “Draw” event, name the event handler as “RulerCanvas_OnDraw”.

<xaml:CanvasControl x:Name="RulerCanvas" 
                    VerticalAlignment="Top" 
                    Height="{x:Bind RulerWidth, Mode=OneWay}"
                    ClearColor="{x:Bind BackgroundColor, Mode=OneWay}"
                    Draw="RulerCanvas_OnDraw" />

For tutorial purpose, I will use hard coded values for now:

private void RulerCanvas_OnDraw(CanvasControl sender, CanvasDrawEventArgs args)
{
    var session = args.DrawingSession;
    session.DrawLine(0, 0, 1920, 0, Colors.Black, 1);
    session.DrawLine(0, RulerWidth, 1920, RulerWidth, Colors.Black, 1);
}

As the API signature:

public void DrawLine(float x0, float y0, float x1, float y1, Color color, float strokeWidth);

Here, 1920 means your screen width, (x0, y0) is the start point for the line, (x1, y1) is the end point, 0 is the top left corner of the App screen.

Run the project, you will get an empty ruler with a top line and a bottom line.

Now you understand the basic concept of how to use Win2D to draw things on a CanvasControl and use it in an application page. Let’s dig in to more details to complete the ruler.

Draw Steps

A ruler has large steps and small steps, we can allow user to customize them.

To represent those two things, add two properties:

public static readonly DependencyProperty LargeStepsProperty = DependencyProperty.Register(
    nameof(LargeSteps),
    typeof(int),
    typeof(PixelRuler),
    new PropertyMetadata(null)
);

public int LargeSteps
{
    get => (int)GetValue(LargeStepsProperty);
    set => SetValue(LargeStepsProperty, value);
}

public static readonly DependencyProperty SmallStepsProperty = DependencyProperty.Register(
    nameof(SmallSteps),
    typeof(int),
    typeof(PixelRuler),
    new PropertyMetadata(null)
);

public int SmallSteps
{
    get => (int)GetValue(SmallStepsProperty);
    set => SetValue(SmallStepsProperty, value);
}

Also add default values for them in the constructor:

public PixelRuler()
{
    // …
    LargeSteps = 50;
    SmallSteps = 10;
}

For tutorial purpose, I also use hard code here, now the RulerCanvas_OnDraw event handler is:

private void RulerCanvas_OnDraw(CanvasControl sender, CanvasDrawEventArgs args)
{
    var session = args.DrawingSession;
    session.DrawLine(0, 0, 1920, 0, Colors.Black, 1);
    session.DrawLine(0, RulerWidth, 1920, RulerWidth, Colors.Black, 1);

    for (int x = 0; x < 1920; x += LargeSteps)
    {
        for (int x1 = x + SmallSteps; x1 < x + LargeSteps; x1 += SmallSteps)
        {
            session.DrawLine(x1, 0, x1, 10, Colors.Black, 1);
        }
        session.DrawLine(x, 0, x, 20, Colors.Black, 1);
    }
}

Here, 10 means small step mark length, 20 means large step mark length.

Run the project, you will get a ruler with large and small steps.

Draw Text

A ruler needs text on large step. Add this code to RulerCanvas_OnDraw event handler.

for (int x = 0; x < 1920; x += LargeSteps)
{
    session.DrawText(x.ToString(), x, 30, Colors.Black, new CanvasTextFormat()
    {
        FontSize = (float)FontSize,
        FontFamily = FontFamily.Source,
        HorizontalAlignment = CanvasHorizontalAlignment.Center,
        VerticalAlignment = CanvasVerticalAlignment.Center
    });
}

Here, 30 means the margin from ruler top to the text, it equals the large step mark length added by 10px.

The FontSize and FontFamily don’t need to add another two properties, they are inherited from UserControl type itself, which makes them already can be controlled by the user, e.g. from MainPage.xaml:

<local:PixelRuler HorizontalAlignment="Stretch" 
                   VerticalAlignment="Top" FontSize="12" FontFamily="Consolas" />

Run the project, you will get a ruler with steps and text:

Now you have a ruler with a basic functionality. Let’s make it more awesome.

More Complete Functions

Our UserControl need to be used in different scenarios and allow user to customize based on their needs. So, we can’t use hard coded values. Let’s make it more flexible to use.

For example, about the screen width, I hard coded it to 1920. Let’s set it to the large side of the user’s device screen resolution. To get the screen resolution, you can install my UWP helper library:

Install-Package Edi.UWP.Helpers

Now you can change every “1920” to largePixel like this:

var pixelW = Edi.UWP.Helpers.UI.GetScreenWidth();
var pixelH = Edi.UWP.Helpers.UI.GetScreenHeight();
var largePixel = pixelW > pixelH ? pixelW : pixelH;

session.DrawLine(0, 0, (int)largePixel, 0, Colors.Black, 1);
session.DrawLine(0, RulerWidth, (int)largePixel, RulerWidth, Colors.Black, 1);

I’ve also added these properties for customization:

DrawBorder
ScaleMarkPosition
ScaleMarkLength
ScaleMarkColor
TextColor
TextMargin

You can have deep control of the ruler:

<local:PixelRuler HorizontalAlignment="Stretch"
                  VerticalAlignment="Top"
                  RulerWidth="80"
                  LargeSteps="50"
                  SmallSteps="10"
                  ScaleMarkLength="20"
                  FontSize="12"
                  ScaleMarkPosition="Both"
                  ScaleMarkColor="#CCC"
                  TextColor="#CCC"
                  FontFamily="Segoe UI"
                  TextMargin="10"
                  BackgroundColor="#333" 
                  DrawBorder="True"
                  Height="80" />

A complete code sample is on my GitHub: https://github.com/EdiWang/PixelRulerUwp

You can also check the demo App on Microsoft Store: https://www.microsoft.com/en-us/p/pixelruleruwp-demo/9nblggh5fjhn

Fix AcrylicBrush Missing on NavigationView in Windows 10 SDK 17763

2018-10-09T13:53:14Z

Microsoft released a new version of Windows 10 UWP SDK Build 17763, you can check the What's New document for more details. But when I retarget my App to version 17763, something unexpected happens, the AcrylicBrush gone missing if I change my App runtime to version 17763.

I am not sure if this is by design on 17763 or it is a bug, I am trying to contact Microsoft product group on this problem. For now, I can address a workaround for this problem.

If you don't understand the problem I am talking about, here's a simple test.

Create a new blank App, use 17134 for both Min and Target runtime.

Add a basic NavigationView control into MainPage.

<NavigationView IsSettingsVisible="True">
    <NavigationView.MenuItems>
        <NavigationViewItem Content="Main" Icon="Document" />
    </NavigationView.MenuItems>
</NavigationView>

Run the App, you should get a fine NavigationView control with correct AcrylicBrush:

Now, change the target version to 17763

Run the App again, the AcrylicBrush is gone:

To fix this, I have to use a workaround by overriding the pane's background. Add this code in App.xaml

<ResourceDictionary>
    <AcrylicBrush x:Key="NavigationViewDefaultPaneBackground"
                  BackgroundSource="Backdrop" TintColor="{ThemeResource SystemChromeMediumColor}" TintOpacity=".5"/>
    <AcrylicBrush x:Key="NavigationViewTopPaneBackground"
                  BackgroundSource="Backdrop" TintColor="{ThemeResource SystemChromeMediumColor}" TintOpacity=".5"/>
    <AcrylicBrush x:Key="NavigationViewExpandedPaneBackground"
                  BackgroundSource="HostBackdrop" TintColor="{ThemeResource SystemChromeMediumColor}" TintOpacity=".7"/>
</ResourceDictionary>

Now you should get an AcrylicBrush similar to the origin one on runtime version 17763.

Note: the same problem happens to the NavigationView control in WinUI (https://docs.microsoft.com/en-us/uwp/toolkits/winui/) also, even targeting version is 17134.

How to Fix Extended TitleBar Overlapping NavigationView PaneToggleButton

2018-07-31T05:33:00Z

In UWP Apps, we some times extend our main view into title bar to get rid of Windows 10 default title bar. However if you are using NavigationView under extended title bar, you will find your PaneToggleButton overlapped by the title bar. And the user won't be able to click on the upper part of the button because it is where the title bar need to respond to window drag actions.

This image shows the common problem in this scenario. The problem also exists even in Microsoft's official "XAML Control Gallery" App for it's back button. Let's see how can we fix it by a workaround.

First, the code I used to hide the Windows default title bar is very common as Microsoft official sample:

//draw into the title bar
CoreApplication.GetCurrentView().TitleBar.ExtendViewIntoTitleBar = true;

//remove the solid-colored backgrounds behind the caption controls and system back button
var viewTitleBar = ApplicationView.GetForCurrentView().TitleBar;
viewTitleBar.ButtonBackgroundColor = Colors.Transparent;
viewTitleBar.ButtonInactiveBackgroundColor = Colors.Transparent;
viewTitleBar.ButtonForegroundColor = (Color)Resources["SystemBaseHighColor"];

And my App does not need a back button, so I hided it in NavigationView:

<NavigationView IsBackEnabled="False" IsBackButtonVisible="Collapsed">
    <NavigationView.MenuItems>
        <NavigationViewItem Content="Item1">
            <NavigationViewItem.Icon>
                <FontIcon Glyph="&#xE81E;"/>
            </NavigationViewItem.Icon>
        </NavigationViewItem>
    </NavigationView.MenuItems>
</NavigationView>

Now we need to customize the style of the PaneToggleButton. You can get a copy of the style and template of any built-in UWP controls by right click on the Blend for Visual Studio designer and choose Edit Template, Edit a Copy and name it ExtTitleBarNavigationViewStyle

Find PaneToggleButtonGrid and change the Margin value to 0,32,0,8, which 32 is the height of Windows 10 title bar.

<Grid x:Name="PaneToggleButtonGrid" HorizontalAlignment="Left" Margin="0,32,0,8" VerticalAlignment="Top" Canvas.ZIndex="100">

Now the hamburger button is moved to lower space, however it will overlap the SplitView pane.

So we have to do another change. Find PaneContentGrid and add a margin of 0,32,0,0.

<Grid x:Name="PaneContentGrid" Margin="0,32,0,0">

You will get a space with the height of the title bar above the PaneToggleButton now, which makes the button fully clickable!

Windows Community Toolkit: Use CameraPreview to Take Photos

2018-07-22T08:33:49Z

In UWP Apps, if we want to use the device's camera to take photos and save to a file, it is used to be some how complicated, the developer need to know about quite a lot things and also write quite a few code to get it down (As you can find the Camera examples from Microsoft offical sample code). In fact, in many cases, we just want to take a photo by the most easy and default options via the camera. In those cases, our focus is on the business logic of the App instead of spending a few hours just to get the camera code working.

Now, you can get this easily done by Windows Community Toolkit. The CameraPreview control provides a straight forward way for us to use the camera and take photos without knowing the details.

1. Install via NuGet

PM> Install-Package Microsoft.Toolkit.Uwp.UI.Controls

2. Allow WebCam capability in your UWP App

You can do it from Visual Studio UI by opening Package.appxmanifest file:

Or edit the file via code and add the DeviceCapability node:

<Capabilities>
  <Capability Name="internetClient" />
  <uap:Capability Name="picturesLibrary" />
  <DeviceCapability Name="webcam" />
</Capabilities>

3. Create the App UI

First, add the namespace into your Page or UserControl

xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"

Then, add the CameraPreview control, it is just one line of XAML

<controls:CameraPreview x:Name="CameraPreviewControl" PreviewFailed="CameraPreviewControl_OnPreviewFailed" />

The PreviewFailed event handler is optional but suggestted in order to provide better user experience and also useful for debug.

For demo purpose, I also add 3 buttons here

<StackPanel Grid.Column="1" VerticalAlignment="Center" Margin="20,0,0,0">
    <Button Content="Start" x:Name="BtnStart" Margin="0,0,0,10" Click="BtnStart_Click" />
    <Button Content="Stop" x:Name="Stop" Margin="0,0,0,10" Click="Stop_Click"/>
    <Button Content="Capture" x:Name="BtnCapture" Click="BtnCapture_Click" />
</StackPanel>

4. Code

First, let's cover the PreviewFailed event handler. I like to show a message dialog to the user about the failure detail:

private async void CameraPreviewControl_OnPreviewFailed(object sender, PreviewFailedEventArgs e)
{
    await new MessageDialog(e.Error, "ERROR").ShowAsync();
}

Note, the async void is only for event handlers like this, use async Task elsewhere.

Now let's start the camera

private async void BtnStart_Click(object sender, RoutedEventArgs e)
{
    await CameraPreviewControl.StartAsync();
}

till this step, you will get the UI working and see the real time camera frame in your app.

To stop the camera, just call Stop()

private void Stop_Click(object sender, RoutedEventArgs e)
{
    CameraPreviewControl.Stop();
}

So how can we take photo and save to local file system? We will need another event handler: CameraPreviewControl.CameraHelper.FrameArrived

In this example, I add the event handler in Start button's code:

private async void BtnStart_Click(object sender, RoutedEventArgs e)
{
    await CameraPreviewControl.StartAsync();
    CameraPreviewControl.CameraHelper.FrameArrived += CameraPreviewControl_FrameArrived;
}

In the event handler, I wan to set the current video frame into a private field:

private VideoFrame _currentVideoFrame;

private void CameraPreviewControl_FrameArrived(object sender, FrameEventArgs e)
{
    _currentVideoFrame = e.VideoFrame;
}

Now when we click the Capture button, we need to save the current frame as picture into local file system. The picture is presented as SoftwareBitmap object which we can access via _currentVideoFrame?.SoftwareBitmap

To let the user pick a file save location, we will use the FileSavePicker, it will return a StorageFile object which represents the file we need to save the photo to. You can also choose file format, here I will use JPG because this is the most common format for photos.

private async void BtnCapture_Click(object sender, RoutedEventArgs e)
{
    var softwareBitmap = _currentVideoFrame?.SoftwareBitmap;

    if (softwareBitmap != null)
    {
        if (softwareBitmap.BitmapPixelFormat != BitmapPixelFormat.Bgra8 || softwareBitmap.BitmapAlphaMode == BitmapAlphaMode.Straight)
        {
            softwareBitmap = SoftwareBitmap.Convert(softwareBitmap, BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied);
        }

        var savePicker = new FileSavePicker
        {
            SuggestedStartLocation = PickerLocationId.Desktop
        };
        savePicker.FileTypeChoices.Add("Jpg Image", new[] { ".jpg" });
        savePicker.SuggestedFileName = "example.jpg";
        StorageFile sFile = await savePicker.PickSaveFileAsync();

        await WriteToStorageFile(softwareBitmap, sFile);
    }
}

Last step, code for save the SoftwareBitmap object into StorageFile:

private static async Task<FileUpdateStatus> WriteToStorageFile(SoftwareBitmap bitmap, StorageFile file)
{
    StorageFile sFile = file;
    if (sFile != null)
    {
        CachedFileManager.DeferUpdates(sFile);

        using (var fileStream = await sFile.OpenAsync(FileAccessMode.ReadWrite))
        {
            BitmapEncoder encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.JpegEncoderId, fileStream);
            encoder.SetSoftwareBitmap(bitmap);
            await encoder.FlushAsync();
        }

        FileUpdateStatus status = await CachedFileManager.CompleteUpdatesAsync(sFile);
        return status;
    }
    return FileUpdateStatus.Failed;
}

If you want to see some more details about the CameraPreivew control, please check the official GitHub: https://github.com/Microsoft/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Controls/CameraPreview

Read System Certificates in UWP

2018-07-02T04:42:16Z

In Windows, we can view and manage the certificates using certmgr.msc, which is a system management console included in Windows itself.

However, what if we want to view the certificates information in an UWP app? Here is the answer.

First thing first, the method I use does not apply to UWP only. In fact it is from a WPF app I wrote. As Microsoft released .NET Standard 2.0, which allows me to reuse the core library shared between WPF and UWP, that is how I finally come up with an UWP demo app.

For reference, please see the sample app on my GitHub: https://github.com/EdiWang/Cert-Scanner

Let's dig in into the code. The core piece of this demo is the following code.

The namespace we use is "System.Security.Cryptography.X509Certificates" so make sure you add the using statement if you want to try the code yourself.

public class SystemStorageCertificationScanner : CertificationScanner
{
    public override IEnumerable<CertInfo> ScanCertificates()
    {
        foreach (StoreLocation loc in Enum.GetValues(typeof(StoreLocation)))
        {
            foreach (StoreName n in Enum.GetValues(typeof(StoreName)))
            {
                X509Store store = new X509Store(n, loc);
                store.Open(OpenFlags.ReadOnly);
                foreach (var storeCertificate in store.Certificates)
                {
                    var certInfo = new CertInfo()
                    {
                        Subject = storeCertificate.Subject,
                        FriendlyName = storeCertificate.FriendlyName,
                        Issuer = storeCertificate.Issuer,
                        Version = storeCertificate.Version,
                        Thumbprint = storeCertificate.Thumbprint,
                        StoreLocation = loc.ToString(),
                        ExpDate = DateTime.Parse(storeCertificate.GetExpirationDateString()),
                        Abstract = storeCertificate.ToString()
                    };
                    yield return certInfo;
                }
                store.Close();
            }
        }
    }
}

In this example, StoreLocation is an enum which only contains 2 members: CurrentUser, LocalMachine

StoreName is another enum which stands for different type names for the installed certificates. It's members are:

public enum StoreName
{
  AddressBook = 1,
  AuthRoot = 2,
  CertificateAuthority = 3,
  Disallowed = 4,
  My = 5,
  Root = 6,
  TrustedPeople = 7,
  TrustedPublisher = 8,
}

And then we can get all the certificates by enumerate every X509Store object and the certificates inside it. But please notice, we will have to open and close the X509Store everytime we do an operation on it.

CertInfo is a custom type I wrote just to make things easier to read and use.

public class CertInfo
{
    public string Subject { get; set; }

    public string FriendlyName { get; set; }

    public string Issuer { get; set; }

    public string Thumbprint { get; set; }

    public int Version { get; set; }

    public string StoreLocation { get; set; }

    public DateTime ExpDate { get; set; }

    public bool IsExpired => ExpDate < DateTime.Now;

    public string Abstract { get; set; }
}

To polish the design, I added couple of interface and abstract class. They are just for design reference, in fact if you just want a straight forward method to read certificates, you won't need any of these.

public interface ICertificationScanner
{
    IEnumerable<CertInfo> ScanCertificates();
}

public abstract class CertificationScanner : ICertificationScanner
{
    public abstract IEnumerable<CertInfo> ScanCertificates();
}

The UWP app I created is using Windows Template Studio, it provides me the Telerik Data Grid, which makes it easy to display the certificates list. I am also using MvvmLight as design pattern. I won't repeat the steps for creating Apps in WTS because it is irrelevant to this topic.

Let's say you already have Telerik Data Grid in your app. Then, to display the result, the most simple way is add one line of XAML on the UI:

<tg:RadDataGrid ColumnDataOperationsMode="Flyout" x:Name="grid" ItemsSource="{x:Bind ViewModel.Source}" />

and retrieve the data in ViewModel

public class SystemCertsViewModel : ViewModelBase
{
    public SystemStorageCertificationScanner SysCertificationScanner { get; set; }

    public SystemCertsViewModel()
    {
        SysCertificationScanner = new SystemStorageCertificationScanner();
    }

    public ObservableCollection<CertInfo> Source => SysCertificationScanner.ScanCertificates().ToObservableCollection();
}

Here in this example, the ToObservableCollection extension is provided my UWP Helper library. You can install it from NuGet.

PM> Install-Package Edi.Uwp.Helpers

Now, the result screen is:

Finally, to get the full example, please see my GitHub: https://github.com/EdiWang/Cert-Scanner

Send Feedback in UWP Apps by Windows 10 Feedback Hub

2018-04-19T06:35:50Z

After our app has been put on Microsoft Store, there are a lot of ways to get users to send feedback, such as email, store reviews, or even write our own API collect feedback. But in fact, Windows 10 Feedback Hub can also be used to send feedbacks for our own Apps.

Those who are familiar with Windows Insider know that when Windows 10 is installed, the system has a Feedback Hub, which is usually used for the user's feedback on the product of Windows itself. In fact, the feedback hub can also be used by developers to collect users ' opinions.

So, how do you call this feedback hub in UWP? First, you need to install the Microsoft Official engagement SDK as follows:

1. Install this package in NuGet：Microsoft.Services.Store.Engagement

PM> Install-Package Microsoft.Services.Store.Engagement

2. If the "Microsoft Engagement SDK" does not show up in the project' Reference, like this, it means you will need some manual steps to get it working. This is important and it is missing in the official document.

The way is to edit your project file (csproj) and add an SDKReference below the ItemGroup of the PackageReference, which is:

<SDKReference Include="Microsoft.Services.Store.Engagement, Version=10.0">
  <Name>Microsoft Engagement Framework</Name>
</SDKReference>

Save the project file and restart VS, you should be good to go.

3. Add a feedback link to your App

Take MVVM pattern as example, just add a HyperLinkButton in your XAML:

<HyperlinkButton Content="Feedback" Command="{Binding CommandFeedback}" />

And create the corresponding RelayCommand:

public RelayCommand CommandFeedback { get; set; }

The implement of this Command will be:

CommandFeedback = new RelayCommand(async () =>
{
    var launcher = Microsoft.Services.Store.Engagement.StoreServicesFeedbackLauncher.GetDefault();
    await launcher.LaunchAsync();
});

If your App needs to target Windows 10 below build 14271, you have to check if the SDK supports it first, by this method:

Microsoft.Services.Store.Engagement.StoreServicesFeedbackLauncher.IsSupported()

Because my App is targeting system build 16299, so I don't have to check the SDK support, it can run directly now:

This is how the Feedback Hub is invoked:

Customize Acrylic Brush in UWP Applications

2018-03-29T12:43:11Z

Windows 10 Fall Creators Update (Build 16299) added acrylic brush, this is a UI brush that similar to Windows 7 Aero effect.

A lot in box Windows Apps, such as Calculator are updated with the acrylic brush. However, the built in brushes will not always meet our own requirments. Especially when Windows automatically disable render of acrylic, such as low power mode, or with an inactive window, it will make our App look very ugly.

For example, this is where normal arcylic will look like:

This is how it looks when the window is inactive:

In this kind of scenario, we will have to build a customize arcylic brush, and set fall back color. As I did with my "Character Map UWP" App, it is one good example.

Showing customized black acrylic in normal modes:

When App goes full screen or inactive, show the system accent color:

It is done by creating a customized AcrylicBrush. Add this code in your XAML resource:

<AcrylicBrush x:Key="CMapUwpAcrylicBrush"
              BackgroundSource="HostBackdrop"
              TintColor="Black"
              TintOpacity="0.4"
              FallbackColor="{StaticResource SystemAccentColor}"/>

In this example, TintColor is for the normal acrylic color you want, I set it to black. TintOpacity stands for opactiy 0.4 means 40%. FallbackColor is the color when acrylic is not able to render, which I use system accent color.

The complete XAML resource file is:

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <ResourceDictionary.ThemeDictionaries>
        <ResourceDictionary x:Key="Default">
            <AcrylicBrush x:Key="CMapUwpAcrylicBrush"
                          BackgroundSource="HostBackdrop"
                          TintColor="Black"
                          TintOpacity="0.4"
                          FallbackColor="{StaticResource SystemAccentColor}"/>
        </ResourceDictionary>

        <ResourceDictionary x:Key="HighContrast">
            <SolidColorBrush x:Key="CMapUwpAcrylicBrush"
                             Color="{ThemeResource SystemColorWindowColor}"/>
        </ResourceDictionary>

        <ResourceDictionary x:Key="Light">
            <AcrylicBrush x:Key="CMapUwpAcrylicBrush"
                          BackgroundSource="HostBackdrop"
                          TintColor="Black"
                          TintOpacity="0.4"
                          FallbackColor="{StaticResource SystemAccentColor}"/>
        </ResourceDictionary>
    </ResourceDictionary.ThemeDictionaries>
</ResourceDictionary>

And then you will be able to use this acrylic brush wherever you need:

<Grid Background="{ThemeResource CMapUwpAcrylicBrush}">

Apply Keyboard Short Cuts in UWP

2018-01-24T05:11:02Z

A greate Windows App requires not only mouse and touch screen friendly, but also need to think about keyboards. Especially for some common short cuts, like Undo (CTRL + Z). So that the App can provide better user experience.

So how can we define short cut keys in UWP? Take my App Tracing as example, I need to implement short cuts for Undo (CTRL + Z). First, we need to consider which Control is being focused by the user currently. If we want the whole UI to respond to that short cut, then the Control will be the UI Control placed at the most outter node of the XAML page, usually it is the Grid.

First, let's find the first Grid element under Page, define 2 events on it: KeyDown and KeyUp

<Grid Background="{ThemeResource TracingAcrylicBrush}" KeyDown="LayoutRoot_KeyDown" KeyUp="LayoutRoot_KeyUp">

Because the short cut we want to use is a combined key (CTRL + Z), so we need to know if the user has pressed Ctrl key already. So we need to define a bool variable to check if Ctrl key is being pressed.

private bool _isCtrlKeyPressed;

And then define the event handler:

private void LayoutRoot_KeyUp(object sender, KeyRoutedEventArgs e)

And

private async void LayoutRoot_KeyDown(object sender, KeyRoutedEventArgs e)

The parameter KeyRoutedEventArgs e describes the information about which key the user is pressing, it is type of Windows.System.VirtualKey enum. So to check if Ctrl key is pressed, just see if e.Key == VirtualKey.Control . Now the logic to remember Ctrl key status is to set _isCtrlKeyPressed to true when Ctrl key is pressed, and restore to false when user release the key

private void LayoutRoot_KeyUp(object sender, KeyRoutedEventArgs e)
{
    if (e.Key == VirtualKey.Control) _isCtrlKeyPressed = false;
}

private async void LayoutRoot_KeyDown(object sender, KeyRoutedEventArgs e)
{
    if (e.Key == VirtualKey.Control) _isCtrlKeyPressed = true;
}

Then, we need to check if Z key is pressed to finish the combined key. It is also handed in the LayoutRoot_KeyDown event handler, after check if Ctrl key is pressed, then check e.Key is Z or not, like this:

private async void LayoutRoot_KeyDown(object sender, KeyRoutedEventArgs e)
{
    if (e.Key == VirtualKey.Control) _isCtrlKeyPressed = true;
    else if (_isCtrlKeyPressed)
    {
        switch (e.Key)
        {
            case VirtualKey.Z: ViewModel.CommandUndo.Execute(null); break;
        }
    }
}

Now, your application UI should be able to respond to CTRL+Z combined key short cut.

Simply, if you have other keys that can combined with Ctrl, just put them into swtich case statements like this:

case VirtualKey.V: await PasteInkOrImageFromClipboard(); break;
case VirtualKey.Z: ViewModel.CommandUndo.Execute(null); break;
case VirtualKey.Y: ViewModel.CommandRedo.Execute(null); break;
case VirtualKey.S: ViewModel.CommandSaveCurrent.Execute(null); break;

Show Confirm Dialog When User Close UWP App

2017-12-29T04:09:16Z

When our UWP Application deal with user data in it, e.g. like drawings or documents, we usually want to make sure user won't close the App by accident and lose their work. Just like what you see in a Office application, it will ask you if you want to save your document before close the App.

For a long time, UWP could not do that in a normal way. Because it is not a general public API and it is still not well documented today. But there are some UWP Apps with this capibility like Microsoft's own "Paint 3D" App:

I did some research today and finally find a way to do this. Let me share with you.

1. Add Restricted API Capability

Open your Package.appxmanifest file.

Add a namespace into Package node:

xmlns:rescap="http://schemas.microsoft.com/appx/manifest/foundation/windows10/restrictedcapabilities"

In order to create App Package without error, we also need to ignore the rescap namespace by adding it into IgnorableNamespaces property in the Package node:

IgnorableNamespaces="uap mp rescap genTemplate"

The Package node will look like this:

<Package xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10" 
         xmlns:mp="http://schemas.microsoft.com/appx/2014/phone/manifest" 
         xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10" 
 
xmlns:rescap="http://schemas.microsoft.com/appx/manifest/foundation/windows10/restrictedcapabilities"
         IgnorableNamespaces="uap mp rescap">

Then, in Capabilities node, add:

<rescap:Capability Name="confirmAppClose"/>

The Capabilities will look like this:

<Capabilities>
...
  <rescap:Capability Name="confirmAppClose"/>
...
</Capabilities>

2. Handling Close App Action

The close app action can now be handled by a preview API:

Windows.UI.Core.Preview.SystemNavigationManagerPreview.GetForCurrentView().CloseRequested

For example, in your code, like MainPage.xaml.cs, you can now use this API to detect if the user clicked "X" button and pop up the dialog like this:

public MainPage()
{
    this.InitializeComponent();

    Windows.UI.Core.Preview.SystemNavigationManagerPreview.GetForCurrentView().CloseRequested +=
        async (sender, args) =>
        {
            args.Handled = true;

            var result = await SaveConfirm.ShowAsync();
            if (result == ContentDialogResult.Primary)
            {
                // Save work;
            }
            else
            {
                App.Current.Exit();    
            }
        };
}

One thing to notice is that, args.Handeled must be set to true, or your App will still close on clicking the "X" button.

Automatically Set Text Color on Accent Background in UWP

2017-10-17T09:15:30Z

Windows 10 allows users to set accent color for the system, and in UWP apps, we usually honor those settings by using XAML pre-defined resource keys like {ThemeResource SystemControlBackgroundAccentBrush}.

But regardless of how the user set default app mode to dark or light, when we apply text on accent colors, it may have some problems.

For example, when the App is in light mode, the default text color is black, when the accent color is a light color like light yellow, black text looks fine on it. However, if the user's accent color is set to dark blue, applying black text on to a dark blue background will make the text difficult to see. Same thing happens to a dark mode app, the text will be white by default, and it is hard to see on light accent colors.

So we need a way to check which type of accent color the user is selecting, and dynamically change the text color based on the accent color type. And we should not hard code against Windows pre-defined colors, because Windows allow user to create custom colors. So here is how to do it:

private bool IsAccentColorDark()
{
    var uiSettings = new UISettings();
    var c = uiSettings.GetColorValue(UIColorType.Accent);
    bool isDark = (5 * c.G + 2 * c.R + c.B) <= 8 * 128;
    return isDark;
}

Then we can set our text color based on the result:

TestText.Foreground = new SolidColorBrush(IsAccentColorDark() ? Colors.White : Colors.Black);

Dark Accent Color	Light Accent Color

But this still have some problem, because we are hard coding the color values. A better solution is to use RequestedTheme to let the system manage the text color automatically, it can covers high contract scenarios:

TestText.RequestedTheme = IsAccentColorDark() ? ElementTheme.Dark : ElementTheme.Light;

Still, one problem remain. When the App is running, and the user changes accent color settings. The text color will not be automatically updated. To solve that, we need to write a converter:

public class SmartTextColorBasedOnAccentTypeConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        return (bool)value ? ElementTheme.Dark : ElementTheme.Light;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

Add it on to the page

<local:SmartTextColorBasedOnAccentTypeConverter x:Key="SmartTextColorBasedOnAccentTypeConverter" />

And make a property in your xaml.cs file:

private bool _isDarkAccent;

public bool IsDarkAccent
{
    get => IsAccentColorDark();
    set { _isDarkAccent = value; OnPropertyChanged(); }
}

And bind to it

<TextBlock x:Name="TestText"  Text="Some Text" 
           RequestedTheme="{x:Bind IsDarkAccent, 
           Converter={StaticResource SmartTextColorBasedOnAccentTypeConverter},
           Mode=OneWay}" />

Now, when the App is running, and the user changes accent color settings. The text color will be automatically updated to fit the current accent color type.

Configure VSTS Build for UWP Apps

2017-10-06T02:41:23Z

UWP Apps usually require a lot of time to compile a "release" package for submitting to Windows Store, and if you are working in a team, TFS/VSTS can help your team ensure that each check-in has a success build, and make it easier for deployment and testing. Let's see a basic example of how to setup a CI build for a UWP App on VSTS.

Important Pre-condition

Before you do that, please ensure that your App is already build and running on your local machine.

If you want the package can be used to upload to the Windows Store, you need to manually associate the App to the store and create App packages and validate the release on your machine for the first time.

VSTS build on host agents can not automatically increase the build number in your App's manifest, you will need to do it manully in each check-in, or you can create a custom agent to do that (not discussed in this article)

Example App

My example App "QRCodeCreator" is under project "Universal-Windows", and there are many other Apps under the same parent directory. Usually in an enterprise, you won't put every App under a same Team Project. But if you do, there will be some different from the default build teamplate, which in this case, you can follow my steps.

Step 1

Go to "Build and Release" under "Universal-Windows", click "+New" button.

Step 2

Choose "Universal Windows Platform" and click "Apply"

Step 3

Set a Name, change Agent queue to "Hosted VS2017", and select the "sln" path for this particular App. This is very important, otherwise VSTS will build every "sln" under "Universal-Windows".

Step 4

In "Get sources", change Server path to this particular App source folder (QRCodeCreator), this is also very important, otherwise VSTS will get all content under "Universal-Windows" even it is only building "QRCodeCreator" solution.

Step 5

Click "Save & queue" button, and test the build definition.

Double check if the environment configuration is correct. In this case, I want the build artifacts can be used to upload to the Windows Store, so I need to use "release" mode on x86, x64 and ARM. You can change this in the build definition settings according to your demands.

Step 6

After the build is queued, click the build number on the message will open the build watcher window.

If everything is correct, you should see the build success after 10-20 minutes depending on your project size. I ususally takes more time to build on VSTS comparing to your local machine.

Step 7

Now, we have validated the build works. Let's configure the CI trigger.

Back to the build definition, click "Triggers", and enable "Continuous Integration" trigger. We also need to change the Path specification to this particular App folder, or every check-in under "Universal Windows" will trigger this build, which is not our intention.

Step 8

The build number by VSTS will not automatically increase like you do it with Visual Studio manully. If you want to upload to the store, the build number must be higher than the old one already in the store. Now we need to go back to Visual Studio, open your project's manifest file, and manully increase the build number.

Step 9

Now when you check-in the App source, a build will be triggered.

After it is done, go to "Artifacts", now you can download or browse the App packages.

Step 10

Upload your wonderful App to Windows Store and change the world!!! You can see the "appxupload" file is successfully recognized by Windows Dev Center.

NOTE FOR CHINESE DEVELOPERS

Downloading artifacts from VSTS is very highly result in broken packages sometimes even with a VPN connection, for example, a 27 MB package will stop at 790 KB / 11 MB or others. Advise to RDP into a oversea VM to download the artifacts. Or you can setup a FTP and configure add build task to upload the artifacts to the FTP server and manually download it.

Appendix

If you have problem when generating App packages for Windows Store, please check the build configuration according to this table:

MSBuild Argument	Value	Description
AppxPackageDir	$(Build.ArtifactStagingDirectory)\AppxPackages	Defines the folder to store the generated artifacts.
AppxBundlePlatforms	$(Build.BuildPlatform)	Allows you to define the platforms to include in the bundle.
AppxBundle	Always	Creates an appxbundle with the appx files for the platform specified.
UapAppxPackageBuildMode	StoreUpload	Defines the kind of appx package to generate. (Not included by default)

Reference: https://docs.microsoft.com/en-us/windows/uwp/packaging/auto-build-package-uwp-apps

Windows 10 UWP: Switching Languages in Your App

2017-09-09T03:17:47Z

By default, a UWP App's UI language is automatically fits the system current language settings. However, what if the user need the ability to set a particular UI language just for your App without having to change system language?

In my App, I supports Simplified Chinese and English. The user can override the system language in App's settings page:

So how to do it?

First, you need to have resource files as usual for multi-language Apps like this:

Put resw files into "Strings\LanguageCode" folder is a conventsion by UWP Apps, it does not require any code to achieve the ablity to show different UI language according to system language.

Then, adding a new class file for matching the language code and display name in order to show it in settings language dropdown list:

public class Language
{
    public string DisplayName { get; set; }

    public string LanguageCode { get; set; }
}

Create a property for UI binding

private ObservableCollection<Language> _languages;

public ObservableCollection<Language> Languages
{
    get => _languages;
    set { _languages = value; RaisePropertyChanged(); }
}

Set values (usually in ViewModel's constructor)

Languages = new ObservableCollection<Language>
{
    new Language { DisplayName = "English", LanguageCode = "en-US" },
    new Language { DisplayName = "简体中文", LanguageCode = "zh-CN" }
};

To let user decide if they want override UI language or just follow system settings, we also need to add a new settings key to store the option. In my App's design, settings are managed by an AppSettings class. You can read my previous post for how to do it.

So, adding a new settings key in AppSettings:

public bool UsePrimaryLanguageOverride
{
    get => ReadSettings(nameof(UsePrimaryLanguageOverride), false);
    set
    {
        SaveSettings(nameof(UsePrimaryLanguageOverride), value);
        NotifyPropertyChanged();
    }
}

And we need another key to store what languages did the user select, by default, it is en-US to match the App's default language.

public string PrimaryLanguageOverride
{
    get => ReadSettings(nameof(PrimaryLanguageOverride), "en-US");
    set
    {
        SaveSettings(nameof(PrimaryLanguageOverride), value);
        NotifyPropertyChanged();
    }
}

Also, add a UI binding property for that

public Language SelectedLanguage
{
    get => _selectedLanguage;
    set
    {
        _selectedLanguage = value;
        AppSettings.PrimaryLanguageOverride = value.LanguageCode;
        RaisePropertyChanged();
    }
}

Now, making the UI:

<ToggleSwitch x:Name="UsePrimaryLanguageOverride" 
              x:Uid="UsePrimaryLanguageOverride" 
              IsOn="{Binding Source={StaticResource AppSettings}, Path=UsePrimaryLanguageOverride, Mode=TwoWay}"
              OnContent="#UsePrimaryLanguageOverride" 
              OffContent="#UsePrimaryLanguageOverride" />

<ComboBox x:Name="CmbLanguage" 
          ItemsSource="{Binding Languages}" 
          DisplayMemberPath="DisplayName" 
          SelectedValuePath="LanguageCode" 
          SelectedItem="{Binding SelectedLanguage, Mode=TwoWay}" 
          IsEnabled="{Binding Source={StaticResource AppSettings}, Path=UsePrimaryLanguageOverride}" />

On the UI, it still need to remember what language did the user previously selected, and set the selected item on the ComboBox according to that value. To do that, add code in your ViewModel:

var selectedLanguage = AppSettings.PrimaryLanguageOverride;
if (!string.IsNullOrEmpty(selectedLanguage))
{
    var f = Languages.FirstOrDefault(l => l.LanguageCode == selectedLanguage);
    if (null != f)
    {
        SelectedLanguage = f;
    }
}
else
{
    SelectedLanguage = Languages.FirstOrDefault();
}

Now, the UI part is complete. How to let the App know what language to apply to the UI?

It is very easy. Set the ApplicationLanguages.PrimaryLanguageOverride when App starts. To do that, modify App.xaml, and in the OnLaunched event handler, add the following code

protected override async void OnLaunched(LaunchActivatedEventArgs e)
{
    var settings = new AppSettings();
    ApplicationLanguages.PrimaryLanguageOverride =
        settings.UsePrimaryLanguageOverride ?
            settings.PrimaryLanguageOverride :
            Windows.System.UserProfile.GlobalizationPreferences.Languages[0];

   ...
}

Now your app will have the ablity to let user switch custom languages!

Windows 10 UWP: How to Read and Save Settings Easily

2017-09-08T02:33:12Z

In the UWP Application model, reading and saving settings are very similar to WinRT API. The class we are using is ApplicationData.Current.LocalSettings It is using key-value-pair to store settings.

LocalSettings will stay on the user's current computer, and not being synced with thier Microsoft account.

The API to save settings is:

LocalSettings.Values[key] = value;

To read settings:

if (LocalSettings.Values.ContainsKey(key))
{
    return LocalSettings.Values[key];
}

Please notice, we should first check if the key is already present.

In order to use it in an easy way, we can write a class to manage those settings:

public class AppSettings : INotifyPropertyChanged
{
    public bool ShowTimeSheetSetting
    {
        get
        {
            return ReadSettings(nameof(ShowTimeSheetSetting), true);
        }
        set
        {
            SaveSettings(nameof(ShowTimeSheetSetting), value);
            NotifyPropertyChanged();
        }
    }

    public ApplicationDataContainer LocalSettings { get; set; }

    public AppSettings()
    {
        LocalSettings = ApplicationData.Current.LocalSettings;
    }

    private void SaveSettings(string key, object value)
    {
        LocalSettings.Values[key] = value;
    }

    private T ReadSettings<T>(string key, T defaultValue)
    {
        if (LocalSettings.Values.ContainsKey(key))
        {
            return (T)LocalSettings.Values[key];
        }
        if (null != defaultValue)
        {
            return defaultValue;
        }
        return default(T);
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void NotifyPropertyChanged([CallerMemberName]string propName = "")
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));
    }
}

Key Points:

1. By taking advantage of C#6, the key is a type of string, we can use nameof to retrieve it's name. When we invoke event handlers, we can also use ?. for null check.

2. Using generics to do the type convertion. If the property got a default value, return it. Because in our App, default values are ususally needed. In this example, I only added one settings of a bool type: ShowTimeSheetSetting

3. The operation that the AppSettings class is exposing is just the getter and setter on the property. Reading and Saving settings are automatically done internally. The user of this class don't have to know about how this is done, which means, if some day, the implementation for how to read and save settings changes, we just need to modify one place not everywhere in the code.

4. Because we implemented INotifyPropertyChanged we can do two way bindings on XAML:

<Page.Resources>
    <core:AppSettings x:Key="AppSettings" />
</Page.Resources>

<ToggleSwitch OnContent="On" OffContent="Off" IsOn="{Binding Source={StaticResource AppSettings}, Path=ShowTimeSheetSetting, Mode=TwoWay}" />

For other types of settings, such as string, int, enum, we can of course added them as properties, and use them in xaml just like this!