The UWP Notepad Project (Redux): Text Zoom, App Name, App Icon (Premium)

This time, we’ll implement .NETpad’s text zooming capabilities, fix the application name, and add a new application icon.
Text zoom
Because the TextBox control in the Universal Windows Platform (UWP) doesn’t support zoom natively---the versions in Windows Forms or the Windows Presentation Foundation (WPF) didn’t either---we’ll need to employ the same workaround we used in previous versions of the app. That is, rather than mapping the font size chosen by the user to the textbox, we’ll instead map it to a global variable named MasterFontSize. Then, we can adjust the font size in the textbox according to the user’s zooming needs without impacting the font size that will be saved and reloaded during each app session.

While the way we implement zoom hasn’t changed under the covers, I am changing the way that the user interacts with the zoom commands (Zoom In, Zoom Out, and Restore Default Zoom) because the UWP version of this app has a more visual design. So instead of menu items for each, I’ve placed the zoom commands right in the lower command bar (status bar) for direct interaction.

That should be a straightforward change, as each of those buttons has a Click event handler and can have a keyboard shortcut, just as with the older menu-based designs.

To get started, though, we need to implement MasterFontSize, and that will require several small changes throughout the code in MainPage.xaml.cs.

First, declare two new global variables in the section below the comment // For the textbox. We’ll need ZoomValue later when we implement the zoom commands:
double MasterFontSize;
int ZoomValue = 100;
Next, locate ReadSettings(). Here, you will find a line of code below // Font Size that sets the value of TextBox1.FontSize to that of the user setting MyFontSize. Right below that, add this new line of code:
MasterFontSize = TextBox1.FontSize;
Then, scroll down to the bottom of ReadSettings(), where you’ll find an else clause in which we load the default font configuration and save to settings. Under the line that reads TextBox1.FontSize = 18; add the following line of code:
MasterFontSize = 18;
Now, locate SaveFontSettings(). In this method, there is a line of code that currently reads as:
settings.Values["MyFontSize"] = TextBox1.FontSize;
Change this to:
settings.Values["MyFontSize"] = MasterFontSize;
Now, locate FontSizesList_SelectionChanged(). Here, there are two lines of code. Open up a line between those and add the following new line of code:
MasterFontSize = TextBox1.FontSize;
OK, that should do it. Now, we need to implement the Click event handlers for ZoomOutButton, RestoreDefaultZoomButton, and ZoomInButton. So locate the tags for those three controls in MainPage.xaml and create the three empty Click event handlers.

The code I wrote for the previous (WPF) version of the app basically works the same here. So add the following code to ZoomOutButton_Click():
if (ZoomValue > 10)
{
    Zoo...

Gain unlimited access to Premium articles.

With technology shaping our everyday lives, how could we not dig deeper?

Thurrott Premium delivers an honest and thorough perspective about the technologies we use and rely on everyday. Discover deeper content as a Premium member.

Tagged with

Share post

Please check our Community Guidelines before commenting

Windows Intelligence In Your Inbox

Sign up for our new free newsletter to get three time-saving tips each Friday

"*" indicates required fields

This field is for validation purposes and should be left unchanged.

Thurrott © 2024 Thurrott LLC