When to use ARIA role attribute - wai-aria

I'm attempting to make my website compliant with WCAG. Is a custom radiobutton that overlays the native HTML control with a styled div the proper use case for the role="radio" attribute?

It depends which element will receive the keyboard focus. If focus goes to the native element (<input type="radio">), then the screen reader will announce it properly and you're good. If it goes to your custom element, then you'd need an ARIA role (and a role for the container too, role="radiogroup").
Note that if focus goes to the native radio, then make sure you custom element is hidden (aria-hidden="true") from the screen reader. It would be confusing to be able to put the screen reader focus on both radios.

Related

Setting focus to an Image in WinRT

Is it possible to set focus to an Image control (Windows.UI.Xaml.Controls.Image) in WinRT? I'd like to be able to set focus to it programmatically and detect key presses when the image has focus.
No, but you can put it in another control - e.g. a Button or ContentControl and handle key presses on that, show focus indicators etc.
According to the MSDN Documentation on the Image Control the answer is no.
The Image class and accessibility
The Image class is not a true control class in that it is not a descendant class of Control. You can't call focus to an Image element, or place an Image element in a tab sequence. For more info on the accessibility aspects of using images and the Image element in your UI, see Exposing basic information about UI elements.

Scroll management for LongListMultiSelector

In my WP8 application I use LongListMultiSelector and I would like to save it's scroll position when application is closed or tombstoned and then restore it when application is opened again. I will also need to scroll it programmatically to a specified item or specified position with animation when application is active.
The problem is that so far I can't find any methods on LongListMultiSelector that will allow me to scroll it with or without animation to a specified item or position. I also can't find methods that will allow me to get a list of all current items so I could choose of them to which one to scroll.
It can't be that scrolling is unmanageable on LongListMultiSelector so I'd like to get your advice on how I can get to this scroll functionality.
LongListSelector is kind of a "smart" controls. It means it has very complex behaviour but if you need to change it - better you shouldn't...
You have two options:
Write your own behavior on top of the content of the LongListMultiSelector. It contains primitives:ScrollBox control inside it.
Use standard LongListSelector and implement native ScrollTo method and your own multiselection. Multiselection is a simple task, ScrollTo is quite tricky since you basically can't scroll to position, only to item.

How i Scroll web browser control in wp7

i want to swipe webbrowser Control which is on pivot item ,each pivot item
has a web control .i want to swipe with web browser control .
but i don't have any idea.but swiping is necessary in my project .is there any method to doing this if yes then please send me sample code for this ..
This is a bind if you have some different sections of HTML you want to display in a Pivot. If you are targetting WP7 Mango it might be possible for you to convert your HTML to RTF and then use a RichTextBox instead of a WebBrowser. However if your HTML is fairly complex, this probably isn't going to work for you.
Alternatively you could place your WebBrowser in a pivot item with a transparent Rectangle above it in the Z-order. Make sure that Rectangle swallows any gestures and doesn't pass them through to the WebBrowser control - that way you will be able to swipe left and right on the WebBrowser to get the pivot to move.
Next you can use the GestureService on this transparent rectangle to recognize vertical pans/swipes and taps to take you to a full page view of your WebBrowser content. In this full page view you would have a fully interactive WebBrowser control.
You have an issue with competing gestures. Try setting the WebBrowser control to IsHitTestVisible to false. This will mean that you'll be unable to manipulate or scroll the content of the WebBrowser control though.
shanu: if you still need it, check my recent answer at: WP7 Pivot control and a WebBrowser control
There's a bit of info on how to "hack into" the webbrowser and what to do, to (almost) prevent it from stealing your swipes. If you are insane/masochistic enough to try that approach I described there, then in addition to that eventhandling and other configuration/detection, you will have to drive your pivot manually via relevant pivot.selectedindex++/-- on H-swipes detected with your handlers (or you can separate blocking and observing with gesture listener, that may sometimes result in the code being a bit cleaner). I also think you will have to be careful with the selectedindex near to the page ranges. I dont know how pivot behaves if you order it to go further than you page count, and I dont know either if it will animate correctly, if being on the last page you order it to go "wrap around" and go to page 0 via selectedindex=0. It may get "crazy" and rewind back instead of going forward in a circular fashion.. you will have to experiment with that

Which is better, some grids collapsed or some user controls?

I'm developing a Windows Phone 7 application that uses some Transient content.
To avoid to go back to that transient content I've decided to use a phew page with several grids on the same page.
When I have to show another "page" I set to collapsed current grid and then I set to visible desired grid.
I know this can be done using user control, but I'm not sure if using user controls can be slowest that using Grids. Any advice?
And another question is if I use grids, how can I use page transitions?
Another option for when you want to show transient content is to use a Popup control. This won't appear in the navigation stack, so when a user goes back (<-) they won't see this content.
However, Popup content isnt GPU accelerated, so you only want to display simple content, no animations etc...
If you want page transitions etc... then i think your only option is to use Pages. That way you can do the transitions and the back button works as expected.
It doesn't matter if you do this via user controls or grids - what matters speed wise is the complexity of your layout.
A user control may be better if you are doing this on a number of pages so you don't repeat yourself.
One way to do page transitions is to do it with stack panels. Have the second "hidden" stack panel way off to the right so it is off screen then animate it in.

GWT DnD: Is it possible to drag disabled widgets?

I have a composite widget that contains a disabled TextArea on an AbsotutePanel. Now I want to be able to drag the composite widget, starting from anywhere on it, including the disabled text area.
Is that possible?
If you want to drag a composite widget, you need to have a reference to the "drag handle" wich is one of the elements in the composite widget that implements HasAllMouseHandlers. The easiest (and in my mind, cleanest) way to do this is to have the composite widget extend the interface HasDragHandle wich requires the composite to have the method:
Widget getDragHandle(); the interface does not explicitly tell you so but the returned widget must be a widget implementing the HasAllMouseHandlers interface (or you'll get a runtime error).
(Non-composite widgets implementing HasAllMouseHandlers can be used directly)
I'd reccomend using a Label as a drag handle (it doesn't need to contain any text it could just be styled so the user understands it can be used for dragging), and not a form element because then you're overloading it's behaviour in a way the user most likely won't expect. I'm not really sure how a disabled element would work as a drag handle, quite possibly disabling an element will stop any mouse listners from working to so it won't work as a drag handle (haven't tried it though).
Or, try putting your widget into a FocusPanel, which is already enabled for drag 'n drop anyway. I've done this with a TextBox and a button, and it seems to work fine. Disabling the widget inside of the FocusPanel also keeps it from accidentally being activated.

Resources