質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.31%
C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

WPF

Windows Presentation Foundation (WPF) は、魅力的な外観のユーザー エクスペリエンスを持つ Windows クライアント アプリケーションを作成するための次世代プレゼンテーション システムです

Q&A

解決済

1回答

1202閲覧

C# WPF Storyboardでのメディアの再生について

Hottopia

総合スコア16

C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

WPF

Windows Presentation Foundation (WPF) は、魅力的な外観のユーザー エクスペリエンスを持つ Windows クライアント アプリケーションを作成するための次世代プレゼンテーション システムです

0グッド

0クリップ

投稿2023/01/23 08:21

前提

C# (WPF)に関する質問です。
StoryboardでMediaElementを再生させようとしました。
しかし再生されず、原因もわからないため質問しました。

試したこと

Appealを発火させれば、MediaElementも再生されると考えていましたが、されませんでした。
Storyboard内でmediaの再生をさせるにはどうすればいいでしょうか?

該当のソースコード

AnimationTest.xaml

1<Page x:Name="page" x:Class="Test.AnimationTest" 2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 4 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 5 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 6 xmlns:gif="http://wpfanimatedgif.codeplex.com" 7 xmlns:local="clr-namespace:Test" 8 mc:Ignorable="d" 9 Height="768" Width="1024" 10 Title="AnimationTest"> 11 <Page.Resources> 12 <Storyboard x:Key="Fadein"> 13 <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CharaLayer" 14 Storyboard.TargetProperty="(UIElement.Opacity)"> 15 <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/> 16 <EasingDoubleKeyFrame KeyTime="00:00:01" Value="1"> 17 <EasingDoubleKeyFrame.EasingFunction> 18 <QuarticEase EasingMode="EaseIn"/> 19 </EasingDoubleKeyFrame.EasingFunction> 20 </EasingDoubleKeyFrame> 21 </DoubleAnimationUsingKeyFrames> 22 </Storyboard> 23 24 <!--該当のStoryboard--> 25 <Storyboard x:Key="Appeal"> 26 <DoubleAnimationUsingKeyFrames Storyboard.TargetName="JudgeElement" Storyboard.TargetProperty="(UIElement.Opacity)"> 27 <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/> 28 <EasingDoubleKeyFrame KeyTime="00:00:02" Value="0"/> 29 <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="1"/> 30 </DoubleAnimationUsingKeyFrames> 31 <DoubleAnimationUsingKeyFrames Storyboard.TargetName="JudgeElement" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"> 32 <EasingDoubleKeyFrame KeyTime="00:00:02" Value="1.5"/> 33 <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="1"> 34 <EasingDoubleKeyFrame.EasingFunction> 35 <BackEase EasingMode="EaseIn"/> 36 </EasingDoubleKeyFrame.EasingFunction> 37 </EasingDoubleKeyFrame> 38 </DoubleAnimationUsingKeyFrames> 39 <DoubleAnimationUsingKeyFrames Storyboard.TargetName="JudgeElement" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"> 40 <EasingDoubleKeyFrame KeyTime="00:00:02" Value="1.5"/> 41 <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="1"> 42 <EasingDoubleKeyFrame.EasingFunction> 43 <BackEase EasingMode="EaseIn"/> 44 </EasingDoubleKeyFrame.EasingFunction> 45 </EasingDoubleKeyFrame> 46 </DoubleAnimationUsingKeyFrames> 47 <!-- 該当箇所 --> 48 <MediaTimeline Source="\resources\sound\correct.mp3" Storyboard.TargetName="media" BeginTime="00:00:02"/> 49 </Storyboard> 50 </Page.Resources> 51 <Grid> 52 </Canvas> 53 <!-- オブジェクトレイヤ --> 54 <Canvas x:Name="ObjectLayer" 55 Panel.ZIndex="4" 56 d:Visibility="Visible" 57 Height="768" Width="1024" 58 Background="Transparent"> 59 60 <!-- エレメントレイヤ --> 61 <Canvas x:Name="ElementLayer"> 62 <Image x:Name="JudgeElement" 63 d:Visibility="Visible" 64 Opacity="0" 65 Height="349" Width="301" 66 Canvas.Left="374" Canvas.Top="284" 67 RenderTransformOrigin="0.5,0.5"> 68 <Image.RenderTransform> 69 <TransformGroup> 70 <ScaleTransform/> 71 </TransformGroup> 72 </Image.RenderTransform> 73 </Image> 74 </Canvas> 75 </Canvas> 76 77 <!--キャラクターレイヤ--> 78 <Canvas x:Name="CharaLayer" 79 d:Visibility="Visible" 80 Visibility="Hidden" 81 Height="768" Width="1024" 82 Background="Transparent"> 83 <Image x:Name="boy" 84 gif:ImageBehavior.AnimatedSource="\resources\fgimage\gif\speakBoy_close_.gif" 85 gif:ImageBehavior.AutoStart="False" 86 Height="350" Canvas.Left="9" Canvas.Top="414" HorizontalAlignment="Center" VerticalAlignment="Top"/> 87 <Image x:Name="girl" 88 gif:ImageBehavior.AnimatedSource="/resources/fgimage/gif/SpeakGirl_close.gif" 89 gif:ImageBehavior.AutoStart="False" 90 Height="350" Canvas.Left="767" Canvas.Top="414" HorizontalAlignment="Left" VerticalAlignment="Center"/> 91 </Canvas> 92 <!--固定レイヤ--> 93 <Canvas x:Name="FixLayer" d:Visibility="Visible" Panel.ZIndex="5" Height="768" Width="1024" Background="Transparent"> 94 <Button x:Name="TestButton" 95 Background="LightGray" 96 Content="Test" 97 Height="100" Width="100" 98 Canvas.Left="638" Canvas.Top="163" 99 Click="CorrectButton_Click"/> 100 <Button x:Name="SkipButton" 101 Background="LightGray" 102 Content="Skip" 103 Height="100" Width="100" 104 Canvas.Left="778" Canvas.Top="163" 105 Click="IncorrectButton_Click" 106 HorizontalAlignment="Left" VerticalAlignment="Top" /> 107 <Button x:Name="ResetButton" 108 Background="LightGray" 109 Content="Reset" 110 Height="100" Width="100" 111 Canvas.Left="924" Canvas.Top="163" 112 Click="ResetButton_Click" HorizontalAlignment="Left" VerticalAlignment="Center" /> 113 114 <MediaElement x:Name="media"/> 115 </Canvas> 116 </Grid> 117</Page> 118

AnimationTest.xaml.cs

1using System; 2using System.Collections.Generic; 3using System.Text; 4using System.Windows; 5using System.Windows.Controls; 6using System.Windows.Data; 7using System.Windows.Documents; 8using System.Windows.Input; 9using System.Windows.Media; 10using System.Windows.Media.Animation; 11using System.Windows.Media.Imaging; 12using System.Windows.Navigation; 13using System.Windows.Shapes; 14 15namespace Test 16{ 17 /// <summary> 18 /// AnimationTest.xaml の相互作用ロジック 19 /// </summary> 20 public partial class AnimationTest : Page 21 { 22 public AnimationTest() 23 { 24 InitializeComponent(); 25 } 26 27 <!--Storyboard発火用ボタン--> 28 private void CorrectButton_Click(object sender, RoutedEventArgs e) 29 { 30 var source = new BitmapImage(); 31 source.BeginInit(); 32 source.UriSource = new Uri(@"resources\Image\element\circle.png", UriKind.Relative); 33 source.EndInit(); 34 JudgeElement.Source= source; 35 AppealAnimation(); 36 } 37 38 private void IncorrectButton_Click(object sender, RoutedEventArgs e) 39 { 40 var source = new BitmapImage(); 41 source.BeginInit(); 42 source.UriSource = new Uri(@"resources\Image\element\cross.png", UriKind.Relative); 43 source.EndInit(); 44 JudgeElement.Source = source; 45 AppealAnimation(); 46 } 47 48 private void ResetButton_Click(object sender, RoutedEventArgs e) 49 { 50 CharaLayer.Visibility = Visibility.Hidden; 51 JudgeElement.Visibility = Visibility.Hidden; 52 } 53 54 public void AppealAnimation() 55 { 56 JudgeElement.Visibility = Visibility.Visible; 57 CharaLayer.Visibility = Visibility.Visible; 58 var charaSb = FindResource("Fadein") as Storyboard; 59 BeginStoryboard(charaSb); 60 var judgeSb = FindResource("Appeal") as Storyboard; 61 BeginStoryboard(judgeSb); 62 } 63 } 64} 65

補足情報(FW/ツールのバージョンなど)

Visual Studio 2022
C#10.0
WPF

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

TN8001

2023/01/23 11:01

Storyboard以前に、そもそもこれは鳴りますか? <MediaElement x:Name="media" d:Source="" Source="\resources\sound\correct.mp3" /> Source=".\resources\sound\correct.mp3" こうとか Source="resources\sound\correct.mp3" こうではどうですか? correct.mp3 のプロパティはどうなっていますか?(ビルド アクションや、出力ディレクトリにコピー)
Hottopia

2023/01/24 02:27

すみません、 <MediaElement x:Name="media" d:Source="" Source="\resources\sound\correct.mp3" /> では鳴りませんでした。 Storyboardの方を <Storyboard x:Key="Appeal"> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="JudgeElement" Storyboard.TargetProperty="(UIElement.Opacity)"> <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/> <EasingDoubleKeyFrame KeyTime="00:00:02" Value="0"/> <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="1"/> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="JudgeElement" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"> <EasingDoubleKeyFrame KeyTime="00:00:02" Value="1.5"/> <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="1"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseIn"/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="JudgeElement" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"> <EasingDoubleKeyFrame KeyTime="00:00:02" Value="1.5"/> <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="1"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseIn"/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> <!-- 変更 --> <MediaTimeline Source="resources\sound\correct.mp3" Storyboard.TargetName="media" BeginTime="00:00:02"/> </Storyboard> に修正したところ、解決しました。 本当にありがとうございました。
TN8001

2023/01/24 04:25

> に修正したところ、解決しました。 \ がいっこ余計だったってことですね。 お手数ですが自己回答していただいて、質問を「解決済」にしてください。 [ヘルプ|質問をした後に自己解決してしまった](https://teratail.com/help#resolve-myself)
guest

回答1

0

自己解決

修正前
<MediaTimeline Source="\resources\sound\correct.mp3" Storyboard.TargetName="media" BeginTime="00:00:02"/>
修正後
<MediaTimeline Source="resources\sound\correct.mp3" Storyboard.TargetName="media" BeginTime="00:00:02"/>
Sourceプロパティの頭の \ が余計でした。凡ミスでした。
コメントくださった方ありがとうございました。

投稿2023/01/25 08:59

Hottopia

総合スコア16

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.31%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問