The UWP Files: Find Your Way Back (Premium)

For the Universal Windows Platform (UWP) version of .NETpad, I’m trying to rethink the user experience in way that respects the strengths of this platform. And while I certainly have issues with UWP, I will say that I really enjoy some of the modern UIs it provides. And in trying to implement the Find/Replace functionality, I had the opportunity to experiment with some of them.

As you may recall, I implemented a basic OneNote-like Settings pane in .NETpad (UWP) where I can hide infrequently-accessed commands that the real Notepad places in menus (and sometimes in non-sensical places, in my opinion). This slide-in panel still needs some work---a shadow would be nice---but I think it looks great, and it feels like a native UWP-type interface.

As I noted last time, I struggled a bit with the underlying user settings that this Settings pane requires, but once that was out of the way, I moved on to some of the app’s other crucial functionality, like file save operations. But eventually I had to turn my attention to what I think of as Find/Replace, which is really a slew of related commands that includes, Find, Find Previous, Find Next, Replace, and Replace All. And implementing all that will require some new UI.

In Notepad, Microsoft uses two custom dialogs, Find and Replace to implement three of those commands. Find is handled by the Find Dialog, of course. And Replace and Replace All are handled by the Replace dialog. This is what they look like (in a composite image in which you can see both together, which is not actually possible, of course):

I’m not sure how Microsoft implemented those dialogs, exactly. They look like they might be the same dialog, but with extra commands (and a few missing commands) in the second version. But they’re different sizes, and I wouldn’t be surprised if Microsoft implemented them as two different things.

Maybe it doesn’t matter, but in the original Windows Forms versions of .NETpad, I had to implement Find, Replace, and Replace All using a Input Boxes because creating one or two custom dialogs was simply too difficult to bother. Input Boxes aren’t elegant, but they get the job done.

For the Windows Presentation Foundation (WPF) version of the app, I took a half-step forward by creating my own version of an Input Box using XAML. This allowed me to port .NETpad to WPF more easily, but looking back on this now, I feel like what I should have done is created custom Find and Replace dialogs instead, to make the app look and work more like the real thing.

For the UWP version, of course, I want to make something that looks and feels native to UWP. And I tried a few permutations using various UWP UIs too see if I could, ahem, find something that made sense. One idea was a panel, similar to the Settings panel, but horizontally fixed under the command bar.

And ... it’s OK, I guess. I like that it can stay there so that the user can continue finding and replacing. And that ...