Georg fährt extra nach Berlin um Steve Ballmer zu treffen

31 Tage Mango | Tag #28: Media Library

Die­ser Arti­kel ist Tag #28 der Serie 31 Tage Man­go von Jeff Blan­ken­burg.

Der Ori­gi­nal­ar­ti­kel befin­det sich hier: Day #28: Media Libra­ry.

Die­ser Arti­kel wur­de in der Ori­gi­nal­se­rie von Gast­au­tor Jeff Fans­ler geschrie­ben. Bei Twit­ter kann Jeff unter @fanzoo erreicht wer­den.

Heu­te schau­en wir uns die Klas­se Media­Li­bra­ry an. Die­se ist Teil des Name­spaces Microsoft.Xna.Framework.Media. Wie der Name schon andeu­tet, gibt uns die­se Klas­se Zugriff auf die Medi­en­bi­blio­thek des Anwen­ders. Eine Medi­en­bi­blio­thek auf Win­dows Pho­ne spei­chert Bil­der und Musik. Indem Sie die Media­Li­bra­ry ver­wen­den, kön­nen Sie die­se Inhal­te in Ihrer eige­nen Anwen­dung ver­wen­den. Es gibt eini­ge Grün­de, war­um das als Ent­wick­ler inter­es­sant sein kann. Hier sind eini­ge Ide­en:

  • Sie kön­nen eine Lis­te von Lie­dern anzei­gen und den Benut­zer eine Hin­ter­grund­mu­sik zu Ihrer Anwen­dung wäh­len las­sen.
  • Sie kön­nen den Benut­zer Bil­der eines Diens­tes (z.B. Flickr) her­un­ter­la­den las­sen und die­se in der Medi­en­bi­blio­thek able­gen.
  • Sie kön­nen die Künst­ler und Gen­res der Medi­en­bi­blio­thek ver­wen­den, um dem Anwen­der Vor­schlä­ge für ähn­li­che Inhal­te zu machen.

Um zu zei­gen, wie die Medi­en­bi­blio­thek ver­wen­det wer­den kann, habe ich eine Bei­spiel­an­wen­dung gebaut. Die­se App wird alle Lie­der aus der Medi­en­bi­blio­thek des Anwen­ders anzei­gen, ein gewähl­tes Lied abspie­len und dem Anwen­der erlau­ben, ein Bild aus der Medi­en­bi­blio­thek als Hin­ter­grund­bild für die Anwen­dung zu wäh­len. Die App ver­wen­det die Medi­en­bi­blio­thek also, um eine Lis­te der Lie­der zu bekom­men und sie wird außer­dem ein Bild zur spä­te­ren Ver­wen­dung für den Benut­zer in der Medi­en­bi­blio­thek able­gen.

Ein Bild in der Medienbibliothek speichern

In der Bei­spiel­an­wen­dung habe ich image1.jpg als Res­sour­ce hin­zu­ge­fügt. Es ist ein tol­les Bild und ich bin mir sicher, dass alle Benut­zer das Bild haben wol­len. Wir wer­den es also in der Medi­en­bi­blio­thek able­gen. Die Bei­spiel­an­wen­dung spei­chert die­ses Bild in der Metho­de Application_Launching in App.xaml.cs. Hier ist der Code, der das erle­digt:

var library = new MediaLibrary();
var image = library.Pictures.Where(p => p.Name == imageName).SingleOrDefault();

if (image == null)
{
   var resource =
      Application
      .GetResourceStream(new Uri(string.Format("/31DaysMediaLibrary;component/Images/{0}",
         imageName),
         UriKind.Relative));
   var bitmap = new BitmapImage();
   bitmap.SetSource(resource.Stream);

   // Save the image to the camera roll or saved pictures album.
   library.SavePicture(imageName, bitmap.ToStream());
} 

Der meis­te Code hat mit dem Laden des Bil­des zu tun. Eini­ge wich­ti­ge Zei­len ver­wen­den die Media­Li­bra­ry. Las­sen Sie uns die­se Zei­len näher anse­hen.

var library = new MediaLibrary(); 

Die­se Zei­le erstellt eine neue Instanz von Media­Li­bra­ry. Damit bekom­men wir Zugriff auf deren Eigen­schaf­ten und Metho­den.

var image = library.Pictures.Where(p => p.Name == imageName).SingleOrDefault();

Mit die­ser Zei­le durch­su­chen wir die Media­Li­bra­ry nach einem Bild mit dem Namen imageNa­me. Wenn das Bild bereits exis­tiert, spei­chert der Code es nicht noch­mal.

library.SavePicture(imageName, bitmap.ToStream()); 

Die­se Zei­le spei­chert das Bit­ma­pI­mage in der Media­Li­bra­ry. Wie Sie wis­sen, hat das Bit­ma­pI­mage nor­ma­ler­wei­se kei­ne Metho­de ToStream. Ich habe eine Exten­si­on Method ver­wen­det, um die­se Metho­de hin­zu­zu­fü­gen. Die­se Erwei­te­rung hat eigent­lich nichts mit der Medi­en­bi­blio­thek zu tun, aber der Voll­stän­dig­keit hal­ber ist sie hier:

public static class BitmapExtensions
{
   public static Stream ToStream(this BitmapImage bitmap)
   {
      var writeableBitmap = new WriteableBitmap(bitmap);
      var stream = new MemoryStream();
      writeableBitmap.SaveJpeg(stream, bitmap.PixelWidth, bitmap.PixelHeight, 0, 100);
      stream.Position = 0;
      return stream;
   }
} 

Nach­dem der Code aus­ge­führt wur­de, wird das Bild in der Medi­en­bi­blio­thek ver­füg­bar sein. Sie kön­nen das in unse­rer Bei­spiel­an­wen­dung aus­pro­bie­ren, indem Sie den But­ton in der App­li­ca­ti­on Bar der Anwen­dung drü­cken. Dadurch wird ein Pho­to­Ch­oo­ser­Task gestar­tet und das Bild soll­te dort zur Aus­wahl ste­hen.

Eine Liste von Liedern bekommen

Der Screen­shot der Bei­spiel­an­wen­dung oben zeigt eine Lis­te von Lie­dern in der Medi­en­bi­blio­thek des Benut­zers. Die Lis­te ist eine List­Box. Wir haben einen DataTem­pla­te defi­niert, der die Eigen­schaft Text zwei­er Text­Blocks bin­det. Der eine zeigt den Namen des Lie­des und der ande­re den Künst­ler. Das XAML für die List­Box sieht so aus:

<ListBox
    x:Name="lstSongs"
    SelectionChanged="SongSelectionChanged">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel
                Margin="0,0,0,17"
                Width="432"
                Height="78">
                <TextBlock
                    Text="{Binding Name}"
                    TextWrapping="Wrap"
                    Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                <TextBlock
                    Text="{Binding Artist.Name}"
                    TextWrapping="Wrap"
                    Margin="12,-6,12,0"
                    Style="{StaticResource PhoneTextSubtleStyle}"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox> 

Die ItemsSour­ce der List­Box zu set­zen ist sehr ein­fach:

var library = new MediaLibrary();
lstSongs.ItemsSource = library.Songs; 

Was gibt es noch?

Es gibt eini­ge wei­te­re Eigen­schaf­ten der Klas­se Media­Li­bra­ry die wir uns anse­hen soll­ten:

  • Albums — Ähn­lich wie die Lis­te der Lie­der, nur das Alben zurück­ge­ge­ben wer­den.
  • Artists — Wie­der ähn­lich wie die Lis­te der Lie­der, dies­mal für Künst­ler.
  • Gen­res — Die­se Collec­tion beinhal­tet die Gen­res der Lie­der.
  • Play­lists — Die Play­lists, die der Benut­zer zur Medi­en­bi­blio­thek hin­zu­ge­fügt hat.

Zusammenfassung

Wie Sie sehen kön­nen, ist die Ver­wen­dung der Medi­en­bi­bio­thek rela­tiv ein­fach. Der meis­te Code der Anwen­dung wur­de geschrie­ben, um mit den Inhal­ten umzu­ge­hen, nicht um die­se in der Media­Li­bra­ry zuzu­grei­fen. Wir haben gese­hen, wie man auf die Lis­te der Lie­der zugreift und wie man ein Bild abspei­chern kann. Ich habe auch eini­ge Ide­en zur Ver­wen­dung der Medi­en­bi­blio­thek ange­ris­sen. Ich bin mir sicher, dass es vie­le wei­te­re Ver­wen­dungs­mög­lich­kei­ten gibt. Viel Spaß bei der Ent­wick­lung. Ich freue mich schon auf Ihre Apps.

Um ein kom­plet­tes Win­dows Pho­ne Pro­jekt mit dem Code die­ses Arti­kels her­un­ter­zu­la­den, drü­cken Sie auf den Down­load Code But­ton:

Mor­gen wer­den wir Globalisierung/Lokalisierung behan­deln.

Bis dahin!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert