Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI Enhancement Proposal: Make use of the windows accent color in UI #6

Open
ShadowEO opened this issue May 27, 2019 · 12 comments
Open
Labels
enhancement New feature or request

Comments

@ShadowEO
Copy link
Contributor

ShadowEO commented May 27, 2019

I have code staged in a branch ready to be pushed and a pull request made if you like the sound of the idea.

How about giving it a little life through using the user's accent color? Currently I'm only proposing the Windows Logo button, as I'm not sure how tastefully it could be implemented otherwise at the moment. It's really as simple as a few extra lines in TaskbarWindow.xaml (adding the name parameter to the glyph) and TaskbarWindow.xaml.cs (adding some lines to set the coloring and then detect the changes in coloring).

I'm not entirely sure how to add a XAML animation similar to what Microsoft does with the hover animation on the start button so my current code simply colors the logo button at all times.

As stated, I have working code that can be merged in if you like the sound of the idea. As for adding the accent color to other elements, it's as simple as changing their fill property to equal SystemParameters.WindowGlassBrush.

Offtopic: not sure if you're eventually going to package this as an APPX/MSIX. But I also have some commits that have that completed as well, including a startup task, and an app execution alias. The icon of the package is intentionally left as the default "[X]" image since there's no icon for the project yet.

@ADeltaX ADeltaX added the enhancement New feature or request label May 28, 2019
@ADeltaX
Copy link
Owner

ADeltaX commented May 28, 2019

About the accent color and dark/light theme is planned (with acrylic, which is already implemented).
There will be a settings (it will be based on UWP) for MobileShell to handle/remember all of these.

These days I can't do much because of ongoing university exams, but ASAP I'll implement more.

@ShadowEO
Copy link
Contributor Author

ShadowEO commented Jun 3, 2019

Was playing around with your Acrylic code, and it works great. I'm not finding a good way to implement the dark/light themes without implementing the color schemes from scratch and simply applying it/replacing it depending on the AppsUseLightTheme registry key, then again, this is honestly the most I've ever done with WPF, so I might just be missing something.

I'd assume that once Microsoft/microsoft-ui-xaml reaches WinUI 3.0 with XAML Islands (and access to more of the UWP API space) this would become easier, but for now it looks like Light/Dark theme may need to be implemented and approximated from scratch.

That said, your acrylic code works fine with a transparent background for the Bar Window itself, and bottom layer grid object used for coloring and opacity.

@ShadowEO
Copy link
Contributor Author

ShadowEO commented Jun 10, 2019

To illustrate the acrylics, I pushed the changes to my "customized" branch and wanted to share this screenshot. It does require some changes to the TaskbarWindow xaml and source to facilitate, and since we don't have access to the WinUI toolkit, it's more of a dirty hack to enable acrylics.

mobileshell-acrylic taskbar

I think I approximated the opacity needed for the taskbar quite well, I might be slightly off. I tried to do the status bar too, but the changes to it's XAML wouldn't let me create the needed background object to achieve the same effect as the Taskbar, I had it working properly in earlier versions.

The changes are the following, for the function changes, you can see them in my 'customized' branch, it's mainly code to set up the acrylic coloring and an extra WM event to listen for DWM color changes:

TaskbarWindow.xaml Line 39:
 <Grid x:Name="gridAcrylicBackground" Background="Black" Opacity="1" PreviewTouchDown="Grid_PreviewTouchDown" />

TaskbarWindow.xaml Function Window_Loaded
TaskbarWindow.xaml Function WndProc (WM_DWMCOLORIZATIONCHANGED)

I had to create a new grid object behind the taskbar, made the taskbar itself transparent, and then use this new grid object to handle colorization events and the opacity changes needed to facilitate Acrylics.

This is a wonderful learning experience, I've never delved into the UWP side of Windows before this, but this is actually quite something!

I can perform a pull request from that branch if you want. 😁

EDIT: Do note that it's a very dirty hack, it has no idea how to handle Dark/Light coloring and is simply using a "0.24" opacity setting with the WindowGlassBrush coloring the Taskbar and Blurring enabled.

ADeltaX added a commit that referenced this issue Jun 12, 2019
Added ThemeEngine (which will handle dark/light theme) --> #6
Some XAML tweaks
Moved stuff
And more
@ADeltaX
Copy link
Owner

ADeltaX commented Jun 12, 2019

Dark/Light theme implemented.
Now looking further with Accents and Acrylic.

@ShadowEO
Copy link
Contributor Author

ShadowEO commented Sep 9, 2019

I've been tweaking this for my SO's tablet (yup, I've still been quietly hacking on it), he wanted tablet mode to feel more like a tablet but still feel personalized. So I ended up figuring out how to re-add my previous changes, if you're looking into it, about 65-75% opacity on the surface hosting the acrylic surface seems to provide the best Acrylic transparency.

Of course, as before, since WinUI 3.0 is still in preview and we don't yet have real XAML Island support for acrylics, it's a rather hacky implementation, but seemed to get the accent color quite nicely. I can check to see if that source is still here (I reset my machine since then), and if it is, push it to my repo so you can see what I changed!

@fisforfaheem
Copy link

dear devs please update the app!! tired of waiting for thingmuch long

@ShadowEO
Copy link
Contributor Author

Then fork it and continue it yourself. This is a project the developer does in his free time and does not get paid for this work. He's not our lackey.

@fisforfaheem
Copy link

fisforfaheem commented Sep 11, 2019 via email

@ShadowEO
Copy link
Contributor Author

Once again, NO ONE is being paid for this project, nor does ANYONE have the obligation to continue it. This isn't a constructive comment, nor is it something that should be done to ANY developer of the FOSS community at all! ETAs and asking for updates, or even acting as though you're entitled to an update to a free and open source project done in a developer's hobby time is absurd and rude.

And again, Either fork it and continue it yourself, or look for an alternative, or OR, sit back and wait for ADeltaX to have free time to work on it. Hobby devs aren't employees, and the dev may have a life, this work is done IN THEIR FREE TIME

@SuperJMN
Copy link

Is there any way to ban toxic people? Just wondering...

@ShadowEO
Copy link
Contributor Author

@SuperJMN Not that I'm aware of, then again, none of my own projects are big enough to warrant the type of ETA questions that this one is likely to get. Sadly it's the problem that comes with gaining project notoriety, Android ROM devs and Game Console Homebrewers deal with it everyday though I can't imagine how.

@fisforfaheem
Copy link

fisforfaheem commented Sep 15, 2019 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

4 participants