WinUIpad: Heading Into the Final Stretch ⭐

Thanks to Clairvoyance, all the hard work implementing multiple documents and tabs in WinUIpad is complete. There is still a lot of fit and finish work to do, but these are small issues, not major architectural problems. The goal that I’ve struggled to achieve for a year or more has been swept aside like it was nothing.

Last time, I discussed how I had started over with a new Visual Studio project, building out the basic UI and architecture and then fine-tuning the app user interface, building out the menu system and status bar, and implementing Add new tab, Close tab, and File open.

The progress since then has been breathtaking.

Thanks to Clairvoyance getting me past the biggest blocker I’ve experienced over the course of this project, I’m finally moving forward. In some cases, I’m reimplementing functionality I had previously completed, yes. But I’m comparing my code to Clairvoyance’s code at each step, and choosing the one I prefer each time. As noted below, Clairvoyance made some different design choices than I had, and some of them are pretty good. But because this is my codebase inherently, I understand it and can move quickly.

And so I have.

Here’s what’s happened over the past few days.

App settings build out

As per my previous work building out the menu system again, I took on the settings page buildout next. This is a lot of UI, all based on the code I wrote with the initial Windows App SDK version of the app (which was itself based on an earlier and similar WPF implementation), and so it was more tedious than difficult. Well, at least the XAML bits.

I may just change it. The current design is based on the settings page in Notepad, of course, because the original goal with this was to literally reproduce that app as closely as possible. But as I’ve worked on this app over the past year, I’ve come around to the idea of it having its own identity, too. And while I feel good about my ability to implement the settings UI from Notepad, that UI is also a weird outlier that bears no resemblance to any other Microsoft app settings UI. And I’m not sure if I like it.

We’ll get to that, and to related changes to the menu system but for now, I just want to put this behind me. And given that I’d already figured out settings, all I want mention here is a change I made to the Clairvoyance implementation.

One of the tricks with Windows App SDK and WPF is that changing the style of controls is hugely complicated. The most glaring example of this problem is how the TabItem control is styled incorrectly between the active and inactive states, at least if the goal is to match the look and feel of Notepad. I mostly figured that out myself earlier, and I the way I did it in WinUIpad this time around is simpler and not quite perfect. But the way Clairvoyance styled the settings page looked … off. To me.

The issue is that’s opaque, whereas the version I had made was transparent, as is the version in Notepad. Changing that was easy enough: I just changed the style of SettingsGrid from what Clairvoyance had chosen, ApplicationPageBackgroundThemeBrush, to Transparent. Of course, once I did, some of the controls from MainAppGrid, like the tabs, menu system, and status bar, leaked through.

This was easy to fix, and it was something I had been doing already in the previous version of the app: When the app is running normally, the SettingsGrid Visibility property is set to Collapsed so it doesn’t appear. When you navigate to settings, the MainAppGrid Visibility property changes to Collapsed and the SettingsGrid Visibility property changes to Visible. And then when you exit settings, you do the reverse. Simple.

And sure enough, once I made those changes, settings appeared correctly and worked on exit as before.

There is another style in here, with the toggle switches not correctly aligned to the right of each expander. I had started working on that when I decided not to worry about it as I will be changing the look and feel of settings soon.

More feature implementations

As I had done with the File Open functionality before, I started stepping through all the other basic app features one by one. New tab and New window “work,” though the app doesn’t correctly handle closing multiple windows yet, a bug brought forward from my previous design. The other file operations features, like Save and Save as, all work now.

I plowed through all the functions in the Edit menu, things like Undo, Cut, Copy, and Paste, which work mostly as before. When I got to the Find and Replace functionality, I was amused to see that Clairvoyance had implemented those as I had done in the WPF past, using a custom UI in which a Find/Replace bar appears between the menus and the TextBox.

This is interesting to me because there is no code like that in the codebase it used to create the app. But it is, of course, in GitHub. I left it mostly as-is for now, after fixing some style problems in XAML. There are further style problems, but I will almost certainly change that to native dialogs later, something I had implemented previously.

Also amusing, Clairvoyance added some useful features here I hadn’t considered: They’re a little hard to decipher without availing yourself of the tips that pop up on mouse-over, but there are now little button toggles for Match case, Whole word, and Regular expression in the Find/Replace bar. Nice.

Clairvoyance created classes for session state and settings management, which makes some sense, though I had been using the built-in Settings.settings interface in Visual Studio for the latter. But after looking through those files, SessionService.cs and SettingsService.cs, respectively, I decided to leave that design as-is.

All the bugs that remain

There are many small issues in the app as I write this. But these should all be fixable, and this feels a lot more manageable than the big bucket problem of correctly implementing multiple document/tab support. They include:

Multiple app window issues. When you open two or more instances of WinUIpad and close the app, all the app windows close. This was something I had noticed in the code before I started using Clairvoyance and I already needed to fix this.

Printing doesn’t work. This is incredibly difficult and Clairvoyance didn’t even try to add this functionality, which consists of both Page Setup and Print. I removed those menu items for now and while this is low priority, I will look at this again later.

Find/Replace needs to be reimplemented. As noted, this should be moved to a native implementation using ContentDialog as before.

Recent files is broken. Though Clairvoyance had added this earlier, in reimplementing it manually for this version of the app, it no longer works. So I must have missed something somewhere. I will figure that out.

Font updating is broken. You can change the font and related styles in settings, but the change doesn’t take place immediately, only landing after you restart the app. Here, too, I must have just missed something, so I will figure that out.

Unsaved changes indicator. When a document has a change that needs to be saved, the app displays a bullet to the left of the document name in the tab header, which is how Notepad used to work. I will look at fixing that, and I feel like I had done this correctly at one point, where the “x” Close tab button turns into a bullet to indicate the unsaved state.

Line ending and encoding support. Clairvoyance figured this out, I just haven’t added it yet to this version of the app.

Zoom isn’t implemented yet. No big deal here, but I have to just reimplement the zoom functionality. I’ll be using the Clairvoyance version because of a neat change it made, more on that later.

Other fit and finish issues. There are a few things I can think of, like the menu system work and settings page redesign noted previously, and more I am probably forgetting at the moment. This type of thing never ends, I guess.

GitHub. I will put this project on GitHub before I publish the next installment so anyone can access the code.

This is a reasonable to-do list to start on in the final stretch, but I’m sure there’s more. I’m also sure that whatever it is will be surmountable and that I will finally “finish” this app sometime this month.

More soon.