Accessible Apps Qt Developer Days 2014 Frederik Gladhorn

Accessible Apps
Qt Developer Days 2014
Frederik Gladhorn
[email protected]
1
© 2013 The Qt Company
About Me
●
The Qt Company (Oslo)
●
Qt Project, QA
●
Input handling in Qt Quick
●
Cloud Services
●
Maintainer Qt Accessibility
●
Qt accessibility on Linux, OS X,
Windows, Android and iOS
2
© 2014 The Qt Company
Outline
What is accessibility?
Qt Quick
QWidget
3
© 2014 The Qt Company
Accessibility
Colors
●
Fonts
●
Assistive technology
– Magnification
– Screen reader
– Braille display
– Switch
●
4
© 2014 The Qt Company
History
●
Qt 5.0: improved API
●
Qt 5.1: Windows
●
Qt 5.2: Android and OS X
●
Qt 5.3: iOS
●
Qt 5.4: QtWebEngine
●
research project: mobile device accessibility
5
© 2014 The Qt Company
Mobile Accessibility
●
Simple user interfaces
●
Gestures
●
iOS: Voice Over
●
Android: Talk Back
6
© 2014 The Qt Company
Qt Quick Accessibility
Accessible is an attached property
Item {
Accessible.name: “Show Kitten”
Accessible.description: “Shows a kitten when clicked”
Accessible.role: Accessible.Button
}
7
© 2014 The Qt Company
Qt Quick Accessibility
Item {
Accessible.name: “Show Kitten”
Accessible.description: “Shows a kitten when clicked”
Accessible.role: Accessible.Button
}
name: concise label
8
© 2014 The Qt Company
Qt Quick Accessibility
Item {
Accessible.name: “Show Kitten”
Accessible.description: “Shows a kitten when clicked”
Accessible.role: Accessible.Button
}
description: longer explanation
9
© 2014 The Qt Company
Qt Quick Accessibility
Item {
Accessible.name: “Show Kitten”
Accessible.description: “Shows a kitten when clicked”
Accessible.role: Accessible.Button
}
role: what this item represents, for example:
Button, StaticText, EditableText, Graphic, Slider, ...
10
© 2014 The Qt Company
Voice Over
Demo time
11
© 2014 The Qt Company
Qt Quick Accessibility API
●
Name, description, role
●
State (focused, checked, readOnly, passwordEdit, ...)
●
Ignored (new in Qt 5.4)
●
Actions (new in Qt 5.4)
Accessible.onPressAction: {}
Qt 5.4: Press, Toggle, Increase, Decrease
Qt 5.5: ScrollUp, ScrollDown, ScrollLeft,
ScrollRight, PreviousPage, NextPage
12
© 2014 The Qt Company
Example: Quick Forecast
Finding the right level of abstraction
13
© 2014 The Qt Company
Example: Quick Forecast
Window
Header
Table
Row 1
Weekday
Row ...
Temp Max
Date
Temp Min
Icon
14
© 2014 The Qt Company
Example: Quick Forecast
Window
Header
Back Button
Table
Oslo – Norway, 10 Day Forecast
15
© 2014 The Qt Company
Example: Quick Forecast
Window
Table
Tue, 23/09, Cloudy, 11°C to 11°C
Wed, ...
16
© 2014 The Qt Company
Summary Qt Quick
Use Qt Quick Controls
●
Custom controls: add Accessible properties
●
Test with a screen reader
●
Split or unite items using Accessible.ignored
●
Add actions, especially for touch input
●
17
© 2014 The Qt Company
QWidget
QWidget::accessibleName
QWidget::accessibleDescription
MyWidget.setAccessibleName(“Open”);
MyWidget.setAccessibleDescription(“Open a file”);
18
© 2014 The Qt Company
Custom QWidget
●
●
●
●
Subclass QAccessibleInterface
Create a factory function
(QAccessible::installFactory)
Optionally implement more interfaces
(text, table, table-cell, value, action)
Send notifications
(QAccessible::updateAccessibility)
19
© 2014 The Qt Company
Factory
QAccessibleInterface *myAccessibleFactory(
const QString &classname, QObject *object) {
}
if (classname == "MyWidget")
return new MyWidgetAccessibleInterface(object);
return 0;
QAccessible::installFactory(myAccessibleFactory);
20
© 2014 The Qt Company
QAccessibleInterface
class MyWidgetAccessibleInterface : public
QAccessibleInterface
{
public:
MyWidgetAccessibleInterface(QObject *o);
};
QString text(QAccessible::Text t) const;
QAccessible::State state() const;
QRect rect() const;
QAccessible::Role role() const;
// ...
21
© 2014 The Qt Company
Additional Interfaces
Subclass e.g. QAccessibleTextInterface
void *MyIface::interface_cast(QAccessible::InterfaceType t)
{
if (t == QAccessible::TextInterface)
return static_cast<QAccessibleTextInterface*>(this);
return 0;
}
22
© 2014 The Qt Company
QWidget Summary
●
Use existing widgets
●
No text → setAccessibleName
●
For custom widgets create subclasses of QAccessibleInterface
23
© 2014 The Qt Company
Tools
●
OS X: Voice Over; Accessibility Inspector (in Xcode)
●
Windows: NVDA, JAWS, Windows Eyes; Inspect, AccProbe
●
Linux: Orca; Accerciser
●
iOS: Voice Over
●
Android: Talk Back
24
© 2014 The Qt Company
Resources
Qt Quick accessibility:
http://qt-project.org/doc/qt-5/qml-qtquick-accessible.html
QWidget:
http://qt-project.org/doc/qt-5/accessible-qwidget.html
http://qt-project.org/doc/qt-5/QAccessibleInterface.html
Testing and Voice Over (OS X):
http://blog.qt.digia.com/blog/2014/06/20/qt-weekly-14-testing-accessibil
ity-on-os-x
25
© 2014 The Qt Company
Questions?
Frederik Gladhorn
[email protected]
26
© 2013 The Qt Company