Page 1 of 1

VisualState Pressed is not working on touch screen

Posted: 02 Jul 2021, 12:59
by pazzicz
Hello,

I want to change visual of the button when pressed. It works on mouse click but not on touch on touch screen.
    
    <ControlTemplate x:Key="testVisualStates" TargetType="{x:Type Button}">
        <Grid>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">

                    <VisualStateGroup.Transitions>
                        <VisualTransition GeneratedDuration="0" To="Pressed" />
                        <VisualTransition GeneratedDuration="0" From="Pressed" />
                    </VisualStateGroup.Transitions>

                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver" />
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="ButtonBrush" Storyboard.TargetProperty="Color">
                                <EasingColorKeyFrame KeyTime="0" Value="Yellow" />
                            </ColorAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

            <Grid.Background>
                <SolidColorBrush x:Name="ButtonBrush" Color="Green"/>
            </Grid.Background>
        </Grid>
    </ControlTemplate>
    
Any idea how to fix this? Is there any alternative approach?

Re: VisualState Pressed is not working on touch screen

Posted: 05 Jul 2021, 10:28
by sfernandez
Are those buttons under some element with manipulation enabled (like a ScrollViewer)?

In Noesis 3.0 (and WPF) manipulation captures touch events until finger is released. Then if manipulation was cancelled, the touch up event is promoted to a consecutive MouseDown and a MouseUp event, so no pressed state can be seen.

In Noesis 3.1 we have implemented manipulations like UWP, they are only started when the finger moves. So the initial TouchDown can promote and pressed states will be visible, even inside a manipulable element.

Re: VisualState Pressed is not working on touch screen

Posted: 07 Jul 2021, 12:58
by pazzicz
Oh, you are right. It was under ScrollViewer and works as it should when I move it out. I will try it in Noesis 3.1 later. Thank you

Re: VisualState Pressed is not working on touch screen

Posted: 07 Jul 2021, 17:57
by pazzicz
I tried Noesis 3.1.0b2 but the situation seems to be worse now. ScrollViewer has purple background, scrolling is not working and neither buttons outside of scrollviewer are not working now. Did I missed something?
noesis_3_1_scrollview.png

Re: VisualState Pressed is not working on touch screen

Posted: 08 Jul 2021, 00:36
by sfernandez
The purple background on the ScrollViewer indicates that no theme is active and it can't find a Style/Template for the ScrollViewer (so it ends using our internal debug templates).
Could you verify that the NoesisTheme.DarkBlue (or anyone you want) is set in NoesisSettings?

Would it be possible to attach here your Button template? I did a quick test enabling "Emulate Touch" in the NoesisView component with some buttons using our theme and I can see the pressed animation when touching. Even if I put the buttons inside a ScrollViewer.

Re: VisualState Pressed is not working on touch screen

Posted: 08 Jul 2021, 10:43
by pazzicz
I tried to investigate a little bit and this is what I found so far (after migration to Noesis 3.1.0b2):
1. Adding reference to the NoesisTheme.DarkBlue fixed the purple background and scrolling issues.
2. Touches not working when both (new and old) input system are used. I have to use only the old input system.
3. VisualState Pressed on buttons works inside ScrollerView now but it is not working inside Viewbox. (not sure if the issue is on me, WPF or Noesis).
(EDIT: Viewbox is not the problem so most probably it is something on my side and it will be caused by another combination)
4. I am having lots of Binding errors inside UserControls which I am not sure how to solve (it is working in WPF and Noesis 3.0.7). Can it be relevant?
5. Cannot confirm device build because of black screen. Probably caused by 4.

Ad 4.
[noesis] Binding failed: Path=Parent.DataContext.SelectedSection, Source=Project.ShopView(''), Target=NoesisApp.DataTrigger(''), TargetProperty=NoesisApp.PropertyChangedTrigger.Binding
[noesis] Binding failed: Path=PlayerProfile.Nickname, Source=Project.MainViewModel(''), Target=TextBlock(''), TargetProperty=TextBlock.Text
...

Re: VisualState Pressed is not working on touch screen

Posted: 09 Jul 2021, 12:03
by sfernandez
On which device are you trying the new 3.10b2 version? because that beta only works for Windows, doesn't have runtimes for Android or iOS.

Regarding the binding messages they are informative. Sometimes you have a binding that cannot be resolved until you set some data context, and initially it will report that. For example the first binding message could indicate that ShopView Parent still doesn't have a DataContext set. Second message on the other hand indicates that MainViewModel data context doesn't expose a PlayerProfile property, or that is returning null and cannot resolve the Nickname (we show that info as extra warnings).