benruehl / adonis-ui

Lightweight UI toolkit for WPF applications offering classic but enhanced windows visuals
https://benruehl.github.io/adonis-ui/
MIT License
1.7k stars 143 forks source link

How to disable Cursor Spotlight? #113

Closed ledshok closed 3 years ago

ledshok commented 3 years ago

I'm using a third party control which doesn't interact well with the cursor spotlight effect.

Is it possible to disable the cursor spotlight effect for a specific control (or even the entire app)?

Thanks!

thenige commented 3 years ago

I was just going to ask a similar question. I'm using the xceed expanded toolkit and the ColorPicker and some of the other controls don't like the Adonis UI dark theme. Some of the text and other controls are not styled properly - how can we turn off the styling for one of these 3rd party controls and all of its children?

benruehl commented 3 years ago

@ledshok Yes, the cursor spotlight can be disabled for a control and all of its children.

<Window adonisExtensions:CursorSpotlightExtension.RelativeSpotlightSize="0" />

This disables the effect for all controls in the window, but it can be set for individual controls or panels as well. Although this does not really disable it but rather makes the effect invisible.


@thenige What you ask for is a bit different. I don't think there is a way you can exclude a section from being styled. Adonis UI contains default styles for many controls that are applied automatically. If Xceed's controls are built on top of those basic controls, these parts get styled there as well. I don't know of any way in WPF to include resources in a parent control and stop resource inheritance at some child control. There might be a way that I don't know of though.

I see 2 options to resolve this.

Option 1 Instead of including Adonis UI in your App.xaml you could include it just for a part of your app, like a single window or panel. You would then have only this part styled and you could use Xceed in the remaining app parts where Adonis UI is not included.

Option 2 Style Xceed's controls yourself. You could take the styles of their controls (only the ones you need) and create your own version of them. You could add setters applying Adonis UI's brushes and add elements like the cursor spotlight and ripple host yourself. You could copy those parts from Adonis UI's styles and merge them. This might be a lot of work though, depending on how many controls you want to style and how complex they are.

ledshok commented 3 years ago

Thanks for the response @benruehl.

I had tried setting the spotlight size to zero but it didn't seem to have any noticeable effect on the 3rd party control (Syncfusion GridControl in this case). It's definitely changed the effect on, say, the buttons, just not the GridControl: https://streamable.com/5q6iry

Any idea why that might be?

Thanks!

benruehl commented 3 years ago

Ok I see what you mean. Thanks for the video.

Hard to tell though. I don't even know why the effect shows up in their control. Seems like the Syncfusion control is not open source either, so I don't know how to find out what they are doing.

Maybe you can create a Style for their cell control and disable the cursor spotlight in there. But honestly, that doesn't sound really promising to me because it shouldn't matter where you set the property.

Alternatively, you can try to set adonisExtensions:CursorSpotlightExtension.BackgroundBrush="Transparent" instead. But I expect it to have the same effect as adonisExtensions:CursorSpotlightExtension.RelativeSpotlightSize="0".

ledshok commented 3 years ago

Yeah, I'd already given the transparent brushes a try - no effect unfortunately. Thanks for taking a look though.

I may have to dig through the Adonis code and see if I can come up with a quick hack that'll disable the spotlight feature entirely in my own fork. Any suggestions on where to start?

benruehl commented 3 years ago

You could disable it by removing the respective element from the control template. In your case it might be enough to modify the default TextBox style and remove the SpotlightLayer.

https://github.com/benruehl/adonis-ui/blob/dfa6a86f17e175984f4ca1e88d0554cd663e7132/src/AdonisUI.ClassicTheme/DefaultStyles/TextBox.xaml#L95-L103

You don't even need to fork the project. Just copy the style into your own file, remove the section and include the style somewhere after including Adonis UI. This should disable the effect for all TextBoxes in your app. You could also try to include the style in your grid's resources instead of the app's resources. So that all TextBoxes of your app keep the original style and only the Syncfusion grid makes use of your modified version.

ledshok commented 3 years ago

Thanks @benruehl - I'll give that a go. 👍

josephnarai commented 2 years ago

Hi @benruehl I am still seeing the spotlight effect in a normal TextBox:

image

My window is defined:

<adonisControls:AdonisWindow x:Class="DMeter.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:adonisUi="clr-namespace:AdonisUI;assembly=AdonisUI" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:adonisControls="clr-namespace:AdonisUI.Controls;assembly=AdonisUI" xmlns:adonisExtensions="clr-namespace:AdonisUI.Extensions;assembly=AdonisUI" xmlns:local="clr-namespace:DMeter" mc:Ignorable="d" PlaceTitleBarOverContent="True" TitleBarBackground="{DynamicResource {x:Static adonisUi:Brushes.Layer0BackgroundBrush}}" WindowButtonHighlightBrush="Gray" TitleVisibility ="Collapsed" adonisExtensions:CursorSpotlightExtension.RelativeSpotlightSize="0" Title="DMeter" Height="450" Width="800">

Any idea why it would still be appearing and what I can do to prevent it?

Kind Regards,

Joseph