WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

SL3: Controlling Silverlight MediaElement Audio Volume

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

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

適用(対象)

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

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

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

解説

The objective of this technique is to adjust the volume for media that is played in Silverlight applications, as implemented through incorporating the Silverlight MediaElement object. By default, a MediaElement will start playing its media as soon as the UI loads completely AND the media source file is downloaded. For details, see SL24: Using AutoPlay to Keep Silverlight Media from Playing Automatically.

At any given time, a Silverlight MediaElement is associated with exactly one media source as specified by the Source property URI value. That source might be audio-only, or audio-video. The Volume property of MediaElement affects the audio playback volume of that particular source when it is playing. The Silverlight plug-in does not have a user option that adjusts the volume of ALL Silverlight applications as run within it, or a standardized user interface that is always present for all uses of MediaElement. Therefore it is the responsibility of Silverlight application authors to provide an adequate set of user interface controls, including volume adjustment, whenever the Silverlight application plays media that has an audio component.

事例

事例 1: Providing a volume control and a Mute control as part of a set of user interface controls that go with a MediaElement

In addition to the Play Pause Stop controls, application authors can also provide a dedicated control that changes the Volume property of the MediaElement. The typical control for setting a discrete volume is Slider, because Slider is designed for input of discrete values from a range. Adjusting Volume with a data bound Slider changes the volume of any actively playing media, independent of the system volume or of any other audio source controlled by Silverlight. For Volume as set with the Slider, the Binding in XAML declares the interaction between the control and the MediaElement, without requiring an event handler. However, not all users will be able to interact quickly with a Slider, particularly if they are not using a mouse. To help these users, application authors should also include a "Mute" control. Rather than setting Volume to 0, application authors should instead set IsMuted to true. Note that Volume and IsMuted values are not directly related; if IsMuted is set to true, that does not set Volume to 0, nor does setting Volume to zero cause IsMuted to be set true.

<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>

The following is the C# logic.

 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. It is expected that the application incorporates a MediaElement.

  2. Check that a control is available for controlling volume and that the Volume control controls the volume of the playing media, independently from system volume.

  3. Check that control is available for muting, and that the Mute control mutes the volume of the playing media, independently from system volume.

判定基準

#2 OR #3 is true.

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