V0.1.215-beta unable to get button to focused state

MarekHolly · 16 Apr 2025, 09:18

Check Video

I wanted to edit buttons created in v0.1.208 (not completely sure about the version, but old one) .
I am unable to reproduce behavior from old version. Check video"

https://youtu.be/1exWVeJcQlY

Top button is newly created, but I am unable to get it to Focused state.
Buttons below this one are created in 208 version. They perfectly stay in focused state. Although, If I try to edit them, functionality breaks, and they no more stay in focused state. Is this some new feature, or bug?

Thanks

Marek

22 Apr 2025, 13:53

Hello, I've tried to reproduce your problem but it seems to be working as expected with latest version of Studio. This is the template that I tried and Studio generated:

    <ControlTemplate x:Key="ButtonTemplate" TargetType="Button">
        <Border x:Name="BackgroundBorder" Background="#FF2F3F4F" CornerRadius="2,2,2,2" Padding="{TemplateBinding Padding}">
          <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
              <VisualState x:Name="Normal">
                <Storyboard>
                  <StringAnimationUsingKeyFrames Storyboard.TargetName="TextBlock0" Storyboard.TargetProperty="(TextBlock.Text)">
                    <DiscreteStringKeyFrame KeyTime="00:00:00" Value="NORMAL"/>
                  </StringAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
              <VisualState x:Name="MouseOver">
                <Storyboard>
                  <StringAnimationUsingKeyFrames Storyboard.TargetName="TextBlock0" Storyboard.TargetProperty="(TextBlock.Text)">
                    <DiscreteStringKeyFrame KeyTime="00:00:00" Value="OVER"/>
                  </StringAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
              <VisualState x:Name="Pressed">
                <Storyboard>
                  <StringAnimationUsingKeyFrames Storyboard.TargetName="TextBlock0" Storyboard.TargetProperty="(TextBlock.Text)">
                    <DiscreteStringKeyFrame KeyTime="00:00:00" Value="PRESS"/>
                  </StringAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
              <VisualState x:Name="Disabled">
                <Storyboard>
                  <StringAnimationUsingKeyFrames Storyboard.TargetName="TextBlock0" Storyboard.TargetProperty="(TextBlock.Text)">
                    <DiscreteStringKeyFrame KeyTime="00:00:00" Value="DISABLED"/>
                  </StringAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="FocusStates">
              <VisualState x:Name="Unfocused">
                <Storyboard>
                  <StringAnimationUsingKeyFrames Storyboard.TargetName="TextBlock1" Storyboard.TargetProperty="(TextBlock.Text)">
                    <DiscreteStringKeyFrame KeyTime="00:00:00" Value="UNFOCUSED"/>
                  </StringAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
              <VisualState x:Name="Focused">
                <Storyboard>
                  <StringAnimationUsingKeyFrames Storyboard.TargetName="TextBlock1" Storyboard.TargetProperty="(TextBlock.Text)">
                    <DiscreteStringKeyFrame KeyTime="00:00:00" Value="FOCUSED"/>
                  </StringAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
          </VisualStateManager.VisualStateGroups>
          <Grid>
            <TextBlock x:Name="TextBlock0" Text="TextBlock" TextWrapping="Wrap" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="10"/>
            <TextBlock x:Name="TextBlock1" Text="TextBlock" TextWrapping="Wrap" HorizontalAlignment="Right" VerticalAlignment="Top" FontSize="10"/>
            <ContentPresenter x:Name="ContentPresenter0" HorizontalAlignment="Center" VerticalAlignment="Center"/>
          </Grid>
        </Border>
      </ControlTemplate>

One thing to take into account is that visual states from different state groups shouldn't animate the same property, otherwise the behavior is undertermined (depending on which animation is executed first). I don't know if it is what is happening in your video but looking at your template hierarchy it might be the case, as the only element being animated is always that "ContentPresenter0".

Please let me know if that was the issue.

MarekHolly · 02 May 2025, 14:04

Somehow it started to work. I do not know why. I did not changed anything, just updated to newest version..

05 May 2025, 18:46

Thanks for the info.

Anyway, please check what I mentioned about animating same property in different visual state groups, because that is usually the source of problems related to visual states.

V0.1.215-beta unable to get button to focused state

V0.1.215-beta unable to get button to focused state

Re: V0.1.215-beta unable to get button to focused state

Re: V0.1.215-beta unable to get button to focused state

Re: V0.1.215-beta unable to get button to focused state

Who is online