WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

SL12: Pausing, Stopping, or Playing Media in Silverlight MediaElements

達成方法に関する重要な情報

これらの達成方法(参考)の使用法及び、それらがWCAG 2.0 達成基準(規定)とどのように関係するかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用(対象)セクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法があるからといって、WCAG 2.0 を満たすコンテンツを作成する際に、常にその技術が使用可能であるわけではない。

適用(対象)

これは、次の達成基準に関連する達成方法である:

ユーザエージェント及び支援技術によるサポート

SL12 に関するユーザエージェントサポートノート (英語)を参照のこと。Silverlight Technology Notesも参照。

解説

The objective of this technique is to create a control user interface for the Silverlight MediaElement object. The controls enable users to pause or stop the video to prevent the video images on the MediaElement surface from moving, and stop video-associated audio. These UI controls enable an interaction defined in code event handlers. Each handler calls one of the following MediaElement methods:

Note that by default, a MediaElement will start playing its media as soon as the UI loads completely AND the media source file is downloaded (or a certain buffer size is reached, in the case of streaming media). Use the AutoPlay property to change this default.

事例

事例 1: Providing MediaElement controls in the UI

This example has a UI definition in XAML and interaction logic in C#.

<UserControl x:Class="MediaElementControls.MainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 >
  <Grid x:Name="LayoutRoot">
      <StackPanel>
          <MediaElement x:Name="media" Source="/xbox.wmv"
         Width="300" Height="300" 
         AutomationProperties.Name="Video of new Fable game for XBox"           
      />
          <Grid Name="UIControls">
              <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="*" />
                  <ColumnDefinition Width="*" />
                  <ColumnDefinition Width="*"/>
              </Grid.ColumnDefinitions>
              <Grid.RowDefinitions>
                  <RowDefinition Height="*" />
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="20" />
              </Grid.RowDefinitions>
              <Button Click="StopMedia" 
   Grid.Column="0" Grid.Row="1" Content="Stop" />
              <Button Click="PauseMedia" 
   Grid.Column="1" Grid.Row="1" Content="Pause" />
              <Button Click="PlayMedia" 
   Grid.Column="2" Grid.Row="1" Content="Play" />
              <Button Click="MuteMedia" 
  Grid.Row="2" Grid.Column="0" Content="Mute" />
              <TextBlock Name="VolumeLabel" Grid.Row="2" Grid.Column="1" HorizontalAlignment="Right">Volume</TextBlock>
              <Slider Height="20"
          Value="{Binding Volume, Mode=TwoWay, ElementName=media}"
          Minimum="0" Maximum="1"
          Grid.Row="2" Grid.Column="2" Grid.ColumnSpan="2"
              AutomationProperties.LabeledBy="{Binding ElementName=VolumeLabel}"/>
          </Grid>
      </StackPanel>
  </Grid>
</UserControl>

private void StopMedia(object sender, RoutedEventArgs e)
{
    media.Stop();
}
private void PauseMedia(object sender, RoutedEventArgs e)
{
    media.Pause();
}
private void PlayMedia(object sender, RoutedEventArgs e)
{
    media.Play();
}
private void MuteMedia(object sender, RoutedEventArgs e)
{
    Button target = sender as Button;
    // mute if not muted, unmute if already muted, in either case make sure the button content for text and accessibility info is updated
    if (!media.IsMuted)
    {
        media.IsMuted = true;
        target.Content = "Unmute";
    }
    else
    {
         media.IsMuted = false;
         target.Content = "Mute";
     }
}

This example is shown in operation in the working example of Media Element Controls.

参考リソース

この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。

検証

チェックポイント

  1. Using a browser that supports Silverlight, open an HTML page that references a Silverlight application through an object tag. The application is expected to incorporate a MediaElement in the user interface.

  2. Check that interactive controls are available so that users can pause or stop the media.

  3. Check that when activated, the controls stop or pause the media.

判定基準

#2 and #3 are true.

この達成方法が「十分な達成方法」の一つである場合、このチェックポイントや判定基準を満たしていなければ、それはこの達成方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の達成方法によってその達成基準が満たされていることもありうる。