Skip to content

Technique FLASH22:Adding keyboard-accessible actions to static elements

Obsolete

Adobe stopped updating and distributing the Flash Player at the end of 2020, and encourages authors interested in creating accessible web content to use HTML.

About this Technique

This technique is not referenced from any Understanding document.

This technique applies to content implemented in Adobe Flash.

Description

The objective of this technique is to demonstrate how to provide keyboard access to a Flash MovieClip that is not keyboard accessible by default. This technique ensures that the element is focusable by setting the tabEnabled property, and it ensures that the action can be triggered from the keyboard by providing a keydown handler in addition to a click handler.

Examples

Example 1: MovieClip used as a button

In this example, a custom MovieClip is used as a button. To make it keyboard accessible, the MovieClip is placed in the tab order using the tabEnabled. Additionally, redundant event handlers are added so that the custom button responds to both a mouse click and a space bar keypress. Finally, the custom button is provided an accessible name using the MovieClip's AccessibilityProperties object. This makes the button's label perceivable by assistive technology.

This result can be viewed in the working version of MovieClip used as a button. The source of MovieClip used as a button is available.

Note

Using a generic MovieClip is generally not recommended, since the custom button will be perceived as a focusable graphic rather than a button. Instead, a better approach would be to use the standard Flash Button component, or create a new symbol with a type of "button". 

import flash.accessibility. *
import flash.events.KeyboardEvent;
import flash.events.MouseEvent;
import flash.net.navigateToURL;
import flash.net.URLRequest;

testMC.tabEnabled = true;
updateAccName(testMC);
testMC.addEventListener(MouseEvent.CLICK, clickHandler, false);
testMC.addEventListener(KeyboardEvent.KEY_DOWN, keyDownHandler);

updateAccName(testMC);

function clickHandler(e) {
  testMC.labelText.text = "THANKS";
  updateAccName(testMC);
}

function keyDownHandler(e) {
  if (e.keyCode == 32)
  clickHandler(e);
}

function updateAccName(mc: MovieClip) {
  if (! mc.accessibilityProperties)
  mc.accessibilityProperties = new AccessibilityProperties();
  mc.accessibilityProperties.name = mc.labelText.text;
  Accessibility.updateProperties();
}

Tests

Procedure

When a Flash Movie contains generic MovieClip instances that are used as interactive controls, confirm that:

  1. The MovieClip instance has its tabEnabled property set to true
  2. The MovieClip instance has event handlers for both mouse and keyboard events

Expected Results

  • #1 and #2 are true
Back to Top