begin process at 2008 05 16 17:42:03
1 173 622 membres
440 nouveaux aujourd'hui
13 972 membres club

Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum.
Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

Un lecteur audio WPF en 4 j


Information sur le tutorial

Catégorie :DirectX / OpenGL Tutorial .NET ( DotNet ) Date de création : 23/01/2008 10:33:12 Vu : 2 493 fois

Note :
Aucune note

Commentaire sur cette source (5)
Ajouter un commentaire et/ou une note

Description

Document PDF expliquant comment réaliser un lecteur audio rudimentaire en manipulant les technologies du framework 3.0 (WPF, XAML) et le langage C#.

Tutorial

UN LECTEUR AUDIO WPF
EN 4 HEURES

Hervé Labénère 22/01/2008

h.labenere@free.fr

    


Objectif

Objectif : se familiariser avec les technologies WPF (Windows Presentation Foundation) et XAML en créant un lecteur audio MP3/WMA rudimentaire.

Technologies


Aspect général de l’application


L’application est basique et son but est avant tout pédagogique. Elle se présente de la manière suivante : Un bouton « Parcourir », qui lorsque l’on clique dessus explore le disque dur afin de sélectionner le fichier audio à lire. Nous l’applerons btnParcourir.

Une fois sélectionné, le chemin complet du fichier s’affiche dans le contrôle Label « Chemin du fichier sélectionné » que nous appelerons pour simplifier lChemin. On peut alors cliquer sur le contrôle bouton Lecture que nous appelerons btnLecture, pour lancer l’écoute du fichier. Nous pouvons soit appuyer sur le bouton Pause, que nous appelerons btnPause, pour mettre la lecture en pause, soit appuyer sur le bouton Stop que nous appelerons btnArret, pour stopper la lecture et remettre au début le fichier.


Pré-requis

Pour exécuter l’application

  • .Net Framework 3.0
  • Direct X 9.0 (DirectX.AudioVideoPlayBack.dll)

Pour réaliser l’application



Réalisation

Ouvrir Visual C# Express 2008. Choisir dans le Menu File -> New Project -> WPF Application

Aspect de l’IDE




XAML – Présentation

Placer ce code dans l’éditeur XAML (fichier Windows1.Xaml)

<Window x:Class="Myriam.Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="Myriam - Lecteur audio WPF" Height="303.485" Width="530.932">

<Grid Height="187.427">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="102.051*" />

<ColumnDefinition Width="14.674*" />

<ColumnDefinition Width="74.709*" />

<ColumnDefinition Width="317.492*" />

</Grid.ColumnDefinitions>

<Button Height="23" HorizontalAlignment="Right" Margin="0,22.011,27.347,0" Name="btnParcourir" VerticalAlignment="Top" Width="60.03" Click="btnParcourir_Click" Grid.Column="3">...</Button>

<Label Height="28" Margin="12.673,22.011,118.059,0" Name="lChemin" VerticalAlignment="Top" Grid.ColumnSpan="4" OpacityMask="Chocolate" BorderBrush="Chocolate" Foreground="BlueViolet">

<Label.BitmapEffectInput>

<BitmapEffectInput AreaToApplyEffectUnits="Absolute" />

</Label.BitmapEffectInput>

<Label.BitmapEffect>

<BlurBitmapEffect Radius="1" KernelType="Box" />

</Label.BitmapEffect> Fichier sélectionné</Label>

<Image Margin="12.673,57.362,19.343,85.376" Name="imgPlay" Stretch="Fill" Source="file:///C:/Users/myriam/Desktop/btnPlay.png" />

<Image Margin="0,57.362,25.346,85.376" Name="imgPause" Source="file:///C:/Users/myriam/Desktop/btnPause.png" Stretch="Fill" Grid.ColumnSpan="3" HorizontalAlignment="Right" Width="70.036" />

<Image Margin="64.699,57.362,0,85.376" Name="imgStop" Source="file:///C:/Users/myriam/Desktop/btnStop.png" Stretch="Fill" Grid.Column="2" Grid.ColumnSpan="2" HorizontalAlignment="Left" Width="70.036" />

<Button Margin="12.673,57.362,19.343,85.376" Name="btnLecture" Opacity="0" Click="btnLecture_Click">Lecture</Button>

<Button Margin="0,57.362,32.683,85.376" Name="btnPause" Grid.ColumnSpan="3" HorizontalAlignment="Right" Width="62.698" Opacity="0" Click="btnPause_Click">Pause</Button>

<Button Grid.Column="2" Margin="64.699,57.362,0,85.062" Name="btnArret" Grid.ColumnSpan="2" HorizontalAlignment="Left" Width="62.698" Opacity="0" Click="btnArret_Click">Arret</Button>

</Grid>

</Window>




On peut raffiner un peu le résultat, en utilisant des images à la place des boutons. Mais faute d’avoir trouvé l’évènement Click pour le contrôle Image, j’ai dû ruser en superposant pour chaque image un contrôle bouton transparent (opacity = 0).



Ce qui doit vous donner un résultat proche de ceci :


Ajouter les assemblies adéquates.

Pour que l’application fonctionne, il lui faut en plus des assemblies de base d’une application XAML, les assemblies System.Windows.Forms et Microsoft.DirectX.AudioVideoPlayBack.

Ne pas oublier dans le fichier de code Window1.Xaml.Cs de préciser l’importation de ces assemblies (directive Using).



Double-cliquer dans l’IDE sur le contrôle btnParcourir. On se retrouve alors dans la couce métier (fichier Window1.Xaml .cs)


C# Fonction Parourir

Dans la fonction btnParcourir_Click , tapez le code suivant :

Stream myStream = null;

OpenFileDialog ofd = new OpenFileDialog();

ofd.Filter = "Fichiers Audio|*.mp3;*.wma";

ofd.Title = "Ouvrir un fichier musical";

if(ofd.ShowDialog().ToString() == "OK")

{

try

{

if ((myStream = ofd.OpenFile()) != null)

{

using (myStream)

{

lChemin.Content = ofd.FileName;

try

{

if (lecture == true)

{

lecteur.Stop();

lecteur.Dispose();

}

lecteur = new Audio(ofd.FileName);

lecteur.Play();

chemin = ofd.FileName;

lecture = true;

}

catch (Exception ex)

{

}

}

}

}

catch (Exception ex)

{

lChemin.Content = "Impossible de lire le fichier audio " + ex.Message;

}

}


Lorsque l’on clique sur le bouton btnParcourir une fonction est appelée qui déclenche l’ouverture de la fenêtre de dialogue OpenFileDialog (fenêtre de dialogue Windows d’ouverture de fichier), dont nous instancierons la classe en l’appelant « ofd » . On filtre les résultats, en utilisant la propriété Filter de l’ofd, pour n’afficher que les fichiers portant l’extension MP3 et WMA.

Si la fenêtre de dialogue donne pour résultat « Ok », alors on commence par vérifier qu’aucun fichier n’est déjà en cours de lecture. Si au contraire il y en a un, on l’arrête grâce à la méthode Stop de la classe Audio (objet lecteur) et libère la mémoire utilisée par cet objet grâce à la méthode Dispose().

Lecture préexistante ou non, on peut lancer la lecture, en instanciant la classe lecteur qui est de type Audio (élèment DirectX servant à manipuler des fichiers musicaux). On lance la lecture, en appelant tout simplement la méthode Play de l’objet lecteur (Audio), sans oublier de gérer les exceptions, car par défaut l’instanciation du fichier Audio lève une exception. On n’oublie pas d’attribuer à la propriété lecture, la valeur true et d’attribuer à la propriété chemin le chemin sélectionné par la fenêtre de dialogue Windows.


Une fois cette étape effectuée, le plus dur est fait. Il nous reste à gérer l’arrêt de l’écoute d’un fichier et la mise en pause.


C# Fonction Lecture

En double-cliquant dans l’IDE sur le bouton btnLecture, on déclenche l’évènement Click et la méthode correspondante.

private void btnLecture_Click(object sender, RoutedEventArgs e)

{

try

{

if (chemin != null)

{

if (pause == false)

{

lecteur = new Audio(chemin);

}

lecteur.Play();

lecture = true;

pause = false;

}

}

catch (Exception ex)

{


}

}


Rien de particulier à dire. Là encore on instancie la classe lecteur de type Audio en lui donnant pour paramètre le chemin précédemment stockée (méthode Parcourir).

On n’oublie pas de gérer le cas, où un utilisateur peu habile clique sur le bouton Lecture sans avoir au préalable sélectionné de fichier musical. If chemin != null…

Si le fichier n’est pas en pause on instancie un nouvel objet lecteur.


C# Fonction Pause

private void btnPause_Click(object sender, RoutedEventArgs e)

{

try

{

if (lecture == true)

{

lecteur.Pause();

lecture = false;

pause = true;

}

}

catch (Exception ex)

{

}

}



Très simple cette fonction verifie que le fichier es t en phase de lecture, elle appelle la méthode Audio.Pause(), qui met effectivement le fichier en pause , attribue du coup VRAI au booléen pause, et FALSE au booléen lecture.


C# Fonction Arrêt

private void btnArret_Click(object sender, RoutedEventArgs e)

{

try

{

if (lecture == true)

{

lecteur.Stop();

lecteur.Dispose();

lecture = false;

}

}

catch (Exception ex)

{


}

}

Avant de stopper le morceau, on vérifie qu’il y a bien un fichier en cours de lecture (if lecture == true…). Si cette condition est atteinte, on arrête la lecture, en appelant la méthode Audio.Stop(). On libère alors la ressource occupée par le lecteur, en appelant la méthode Audio.Dispose(), sans oublier de mettre le booléen lecture du coup à false.




Conclusion

Par ce bref tutoriel vous avez appris à réaliser un mini lecteur MP3 en utilisant les technologies WPF et XAML. Ces technologies semblent prometteuses, puisqu’elles ont l’énorme avantage de dissocier totalement la couche Présentation de la couche Métier, idée relativement évidente dans une architecture web, mais plutôt étrangère aux architectures Windows classiques. XAML se propose donc de réunir le meilleur du monde Windows et du monde Web.

  • signaler à un administrateur
    Commentaire de herve_labenere le 29/01/2008 16:01:09

    Pour les plus courageux, un tutoriel en anglais de 49 p accessible depuis ce site http://blogs.msdn.com/mgrayson/archive/2007/02/16/creating-a-glass-button-the-complete-tutorial.aspx

    pour réaliser des "glassbuttons" (boutons qui se reflètent dans une glasse) en XAML, avec Microsoft Blend, plutôt que le classic bouton-image proposé dans l'application.

  • signaler à un administrateur
    Commentaire de XRMiMil le 12/03/2008 18:05:36

    Pas mal, bien conçu, j'aime bien
    ...
    mais histoire de corser la chose, comment construire un slider  gérant le temps de la chanson ??? (Positionner la chanson à un endroit précis, mais aussi voir le défilement de la chanson)
    Je vais y réfléchir ...

    @+

  • signaler à un administrateur
    Commentaire de herve_labenere le 13/03/2008 10:34:29

    Ah le slider,

    Ca doit pas être trop compliqué, à faire. De mémoire, il faut quand même avoir des notions sur le multithreading. Car un lecteur multimédia doté d'1 slider, mais développé en "monothread", serait bloqué tout au long du déroulement du slider, cad tant que 1 chanson tourne.

  • signaler à un administrateur
    Commentaire de Guizmodams le 13/03/2008 11:48:39

    Tres bon tuto!
    L'idéale aurait peu être été une petite classe qui ce détache de l'interface (comme ça tu la fait sous Blend en tout jolie et tu fais ton code sous Visual Studio) en utilisant le pattern Etat ;)
    Mais sinon très bonne source, simple et efficace! ;)
    Well done! 9

  • signaler à un administrateur
    Commentaire de samalive le 30/03/2008 00:46:06

    c'est vraiment très intéressant merci pour votre effort.

Ajouter un commentaire

Appels d'offres

Pub



CalendriCode

Mai 2008
LMMJVSD
   1234
567891011
12131415161718
19202122232425
262728293031 

VS Express FR Gratuit !

VS Express en français et 100% gratuit !

Boutique

Boutique de goodies CodeS-SourceS