PR

音声を録音してライブラリに保存するプログラムを作る

2013年6月6日(木)
薬師寺 国安

今回のサンプルは、録音した音声をライブラリに保存・再生するプログラムです。

まず、話す秒数を選択します。するとカウントダウンが開始されますので、カウントが0になるまで話すことができます(図1)。
話した内容はファイルとして、ビデオライブラリ内のSoundFileというサブフォルダに保存されます。
保存された音声ファイル(mp4)の一覧がリストボックスに表示されますので、任意のファイルを選択すると音声が再生されます(図2)。

図1:カウントダウンが0になるまで話すことができる(クリックで拡大)
図2:ファイルを選択して音声を再生している(クリックで拡大)

実際に動かした動画は下記のようになります。スマホで撮影した動画のため、見難い点はご了承願います。

サンプル一式は、会員限定特典としてダウンロードできます。記事末尾をご確認ください。

プロジェクトの作成

VS 2012のメニューから[ファイル(F)/新規作成(N)/プロジェクト(P)]と選択します。
次に、「テンプレート」から「Windows ストア」を選択し、右に表示される項目名から「新しいアプリケーション(XAML)」を選択します。
「名前(N)」に任意のプロジェクト名を指定します。ここでは「Win8_VoiceRecording」という名前を付けています。

ソリューションエクスプローラー内にImagesというフォルダを作って、画像を2枚配置しておきます。

ダウンロードされたサンプルファイルには、画像ファイルは追加済みです。

コントロールの配置

ツールボックスからデザイン画面上に、ScrollViewerコントロールを1個配置し、HorizontalScrollBarVisibilityプロパティにVisibleを指定して、水平スクロールバーを表示させます。
このScrollviewerの子要素として以下のコントロールを配置します。これはタブレットPCを縦にした場合に、水平スクロールを可能にするためです。

Imageコントロールを2個、WinRTXAML ToolkitのコントロールであるCounddownControlを1個、ComboBoxコントロールを1個、MediaElementコントロールを1個、TextBlockコントロールを4個、ProgressRingコントロールを1個、ButtonコントロールとListBoxコントロールを1個ずつ配置します。

書き出されるXAMLをリスト1のように編集します。レイアウトは図3のようになります。

リスト1 書き出されたXAMLコード(MainPage.xaml)

  • (1)要素を配置し、HorizontalScrollBarVisibilityプロパティにVisibleを指定して水平スクロールを可能にしています。この要素の子要素として以下の要素を配置します。
  • (2)要素を配置し、SourceプロパティにImageフォルダ内の画像を指定します。
  • (3)WinRTXAML ToolkitのCountdownContorl1という名前の要素を配置しています。
  • (4)ComboBox1という名前の要素を配置し、プロパティの[共通]パネルにあるItemsプロパティから「コレクションエディタ」を起動して、要素を追加し、Contentプロパティに録音の秒数となる値を指定しておきます。
  • (5)名前がMediaElement1という要素を配置します。
  • (6)項目名となる要素を配置します。
  • (7)ProgressRing1という名前の要素を配置します。最初の状態ではIsEnabledにFalseを指定して、使用不可としておきます。
  • (8)stopButtonという名前の
  • (9)fileNameListBoxという名前の、保存したmp4ファイルの一覧を表示する要素を配置します。
  • (10)messageTextBlockという名前の要素を配置します。
<Page
  x:Class="Win8_VoiceRecording.MainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="using:Win8_VoiceRecording"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  xmlns:Controls="using:WinRTXamlToolkit.Controls"
  mc:Ignorable="d">
  <Grid>
    <ScrollViewerHorizontalScrollBarVisibility="Visible" Margin="0,-10,0,10">■(1)
      <Grid>
        <Image HorizontalAlignment="Left" Height="256" Margin="384,140,0,0" VerticalAlignment="Top" Width="82" Source="Images/microphone.png"/>■(2)
        <Image HorizontalAlignment="Left" Height="219" Margin="845,145,0,0" VerticalAlignment="Top" Width="192" Source="Images/speaker.png"/>■(2)
        <Controls:CountdownControlx:Name="CountdownControl1"  Width="200" Height="200" Margin="28,71,1138,497"/>■(3)
        <ComboBoxx:Name="ComboBox1" HorizontalAlignment="Left" Height="56" Margin="365,70,0,0" VerticalAlignment="Top" Width="129" FontFamily="Meiryo UI" FontSize="36">■(4)
          <ComboBoxItem Content="5" FontSize="36" FontFamily="Meiryo UI" />■(4)
          <ComboBoxItem Content="10" FontSize="36" FontFamily="Meiryo UI"/>■(4)<ComboBoxItem Content="15" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="20" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="25" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="30" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="40" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="50" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="60" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="120" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="180" FontSize="36" FontFamily="Meiryo UI"/>■(4)
          <ComboBoxItem Content="300" FontSize="36" FontFamily="Meiryo UI"/>■(4)
        </ComboBox>■(4)
        <MediaElementx:Name="MediaElement1" HorizontalAlignment="Left" Height="46" Margin="806,183,0,0" VerticalAlignment="Top" Width="327"/>■(5)
        <TextBlockHorizontalAlignment="Left" Height="35" Margin="233,81,0,0" TextWrapping="Wrap" Text="録音秒数" VerticalAlignment="Top" Width="108" FontFamily="Meiryo UI" FontSize="24"/>■(6)
        <ProgressRingx:Name="ProgressRing1" HorizontalAlignment="Left" Height="168" Margin="839,165,0,0" VerticalAlignment="Top" Width="204" IsEnabled="False" Foreground="Crimson" FontSize="36"/>■(7)
        <Button x:Name="stopButton" Content="中止" HorizontalAlignment="Left" Height="76" Margin="316,498,0,0" VerticalAlignment="Top" Width="200" FontFamily="Meiryo UI" FontSize="36" IsEnabled="False"/>■(8)
        <ListBoxx:Name="fileNameListBox" HorizontalAlignment="Left" Height="399" Margin="691,369,0,0" VerticalAlignment="Top" Width="527" FontFamily="Meiryo UI" FontSize="24"/>■(9)
        <TextBlockx:Name="messageTextBlock" HorizontalAlignment="Left" Height="84" Margin="203,568,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="483" Foreground="Crimson" FontFamily="Meiryo UI" FontSize="48" FontWeight="Bold"/>■(10)
        <TextBlockHorizontalAlignment="Left" Height="101" Margin="203,657,0,0" TextWrapping="Wrap" Text="音声ファイルはビデオライブラリ内のSoundFileというサブフォルダに保存されています。不要なファイルは手動で削除してください。" VerticalAlignment="Top" Width="394" FontFamily="Meiryo UI" FontSize="18"/>■(6)
        <TextBlockHorizontalAlignment="Left" Height="65" Margin="839,73,0,0" TextWrapping="Wrap" Text="スピーカー" VerticalAlignment="Top" Width="237" FontFamily="Meiryo UI" FontSize="48" FontWeight="Bold"/>■(6)
      </Grid>
      </ScrollViewer>
  </Grid>
</Page>
図3:各コントロールを配置した(クリックで拡大)
Think IT会員限定特典
  • 音声を録音してライブラリに保存するプログラム

薬師寺国安事務所

薬師寺国安事務所代表。Visual Basic プログラミングと、マイクロソフト系の技術をテーマとした、書籍や記事の執筆を行う。
1950年生まれ。事務系のサラリーマンだった40歳から趣味でプログラミングを始め、1996年より独学でActiveXに取り組む。1997年に薬師寺聖とコラボレーション・ユニット PROJECT KySS を結成。2003年よりフリーになり、PROJECT KySS の活動に本格的に参加、.NETやRIAに関する書籍や記事を多数執筆する傍ら、受託案件のプログラミングも手掛ける。Windows Phoneアプリ開発を経て、現在はWindows ストア アプリを多数公開中

Microsoft MVP for Development Platforms - Client App Dev (Oct 2003-Sep 2012)。Microsoft MVP for Development Platforms - Windows Phone Development(Oct 2012-Sep 2013)。Microsoft MVP for Development Platforms - Client Development(Oct 2013-Sep 2014)。Microsoft MVP for Development Platforms-Windows Platform Development (Oct 2014-Sep 2015)。

連載バックナンバー

Think IT会員サービス無料登録受付中

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

他にもこの記事が読まれています