Accessibility Issues with WPF Overlay Frame

  • Article

Overlay Frames in WPF are sweet and present endless opportunity to innovate on the Application UI. I have seen some neat usage of it with great result. However there are some accessibility issues ( Wherein the ElementFromPoint returned is wrong )with Frame that renders Record and Play Unusable. However if the Frame is used in correct way then Record and Play will work just fine…

If the XAML structure is like

<Grid>
        <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="42,40,0,0" Name="button1" VerticalAlignment="Top" Width="75" />
        <Frame Height="100" HorizontalAlignment="Left" Margin="12,0,0,0" Name="frame1" VerticalAlignment="Top" Width="200" />
</Grid>

then  there is a accessibility issue with the application. If we look at the UI Tree using UISpy and Hover over the Button Control we will see that the element we get at that point is the Frame and not the button. This is clearly wrong as if you send a click it will goto the button.

Incorrect

However things are not bleak and black and there is a easy workaround to get this working. If instead of the XAML structure mentioned above the structure is

<Grid>
        <Frame Height="100" HorizontalAlignment="Left" Margin="12,0,0,0" Name="frame1" VerticalAlignment="Top" Width="200" />
        <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="42,40,0,0" Name="button1" VerticalAlignment="Top" Width="75" />
</Grid>

then the accessibility is absolutely correct. If we look at the UI Tree using UISpy now we get the following

Correct

 

In the above scenario if you try to click on the Button all you will get is click on the FRAME.  So if you encounter such issues in your application you should try and see if the above is the case.