Redesigned UI and small code refactoring

[ethanmsmith]

Redesigned the UI (to fit UWP design) and, as per #23, enlarged keyboard

UI Changes:

• Added navigation pane for different views
• Enlarged the keyboard
• Added a clearer colorpicker
• Enlarged multi selection buttons
• Moved profiles to dropdown

Code changes:

• Moved views to separate pages, pulled a small amount of logic out to the main page
  ** All the connection code is in the MainPage
  ** Left profile logic is in individual pages for possible future changes splitting lighting/layout profiles
• Added comparison methods in KeyboardProfileItem
• Cleaned up the keyboard code and a lot of the layout code

There is still more I would like to do in order to clean up and reuse the code more, but the UI is complete in this PR.

[kprinssu]

The changes are quite long and I will need to go through this PR. I currently do not have access to a Windows 10 machine. I will keep this PR open for the time being.

[kprinssu]

I have a pushed a new release based on your changes: https://github.com/kprinssu/anne-keyboard-windows/releases/tag/1.0.4

I will merge your changes into master after a code style check. If anyone else is currently using the 1.0.4 release, please report an issues in this PR.

[pikou1995]

It works fine on my PC 👍 .
Windows specifications:
Edition windows 10 pro
Version 1709
OS Build 16299.125

[Neptune-mk2]

Was asked to post bugs I found here from /r/Annepro , sorry if this is not the right section.

• Color selection area is not scrollable on both touch and regular devices
• Color customization does not allow manual RGB value input
• For some reason despite the profile indicating 1, the Anne Pro indicates the profile was saved in layout 4

The app works surprisingly in Windows 10 Mobile and even lets me sync the Anne Pro using the Lumia 950 XL but unfortunately the UI does not scale down to mobile sized windows.

Adding scaling so when the window is resized to a mobile sized window can fix this and add mobile support without even having to do anything else.

Other than that everything else seems fine so far.

Windows Specifications :
Edition - Windows 10 Pro
Version 1709
Build 16299.125
"Fall Creators Update"

[kprinssu]

I cannot add support for Windows 10 mobile due to lack of devices. I will look into the other mentioned bugs.

[Neptune-mk2]

You don't need to add support to Windows 10 Mobile, UWAs already work on Windows 10 Mobile natively without any modifications, I was able to install it on my phone just fine, the only problem I had was the UI not scaling down properly when in portrait mode or in small window sizes, the app already works on mobile just fine.

I was suggesting if you added ui scaling to the app so it would work like the Windows 10 Settings app when its resized down to portrait mode :

That would fix the problem with the UI being too big on some devices and when the window is resized, sorry if I worded it differently I probably ended up confusing you.

[ethanmsmith]

@NexuGX

• So for assigning custom color, I opted to not include that for reasons I don't remember...
  Its not hard to include, so that can be added.
• For the color picker not being scrollable, what do you mean? Do you mean when resizing it is off screen? Scrolling to refine color selection?
• I purposely didn't include relative sizing because I am not a C#/UWP dev, so I went the safe route and just kept the absolutely positioned UI.

It was my intention to use: https://docs.microsoft.com/en-us/windows/uwp/design/controls-and-patterns/color-picker for the color picker, but was not available when I made my PR (and would probably alleviate your problem). The picker I chose was the cleanest looking one I could find without building it myself, but it clearly has some short comings (like displaying the RGB values, but not letting you edit them).

If you give me more specifics about the scrolling problem, I can look into fixing it

[Neptune-mk2]

@ethanmsmith

What I meant by the color selection not being scrollable is the entire page is offscreen on small displays and there is no way to scroll to get to things like the rgb slider or the button next to it.

For the second one I understand, I'm not a UWP dev either, I only know the bare basics of it and very little C# so its understandable why you went with static positioning.