Rheinwerk Design < openbook > Rheinwerk Design - Know-how für Kreative.
Know-how für Kreative.

Inhaltsverzeichnis
Vorwort
1 Flash für ActionScript
2 ActionScript in Flash
3 Flash Pro für ActionScript
4 Grundlagen der Programmierung
5 Einfache Filmsteuerung
6 Bildschirme und Präsentationen
7 Drucken und das Kontextmenü
8 Textfelder
9 Tasten
10 Datum und Zeit
11 Rechnen
12 Farbe wechseln und Drag
13 Zeichnen und Zufall
14 Von Mäusen und Duplikaten
15 Kollisionstest
16 Sound
17 Video
18 Externe Filme
19 Vorladen und Player erkennen
20 Formulare und UI-Komponenten
21 Komponenten anpassen
22 Formulare versenden
23 Warenkorb
24 Ausblick auf ActionScript 3
Stichwort
Ihre Meinung?

Spacer
 <<   zurück
Einstieg in ActionScript von Christian Wenz, Tobias Hauser, Armin Kappler
Aktuell zu Flash 8
Buch: Einstieg in ActionScript

Einstieg in ActionScript
brosch., mit CD und QuickFinder und Referenz
416 S., 24,90 Euro
Rheinwerk Design
ISBN 978-3-89842-774-6
Pfeil 16 Sound
  Pfeil 16.1 Sound in Flash
  Pfeil 16.2 Sound mit ActionScript
  Pfeil 16.3 Mehrere Sounds


Rheinwerk Computing - Zum Seitenanfang

16.3 Mehrere Sounds  topZur vorigen Überschrift

Bisher haben Sie nur mit einem Sound gearbeitet. Möchten Sie mehrere Sounds einsetzen, müssen Sie sie voneinander trennen, um alle unabhängig steuern zu können. Wie das geht, führen wir anhand eines Beispiels vor. Die Grundlage ist die Datei groovemixer.fla auf der CD-ROM.

Abbildung 16.6 Ob der Groovemixer seinem groovigen Namen alle Ehre macht?

Abbildung 16.7 Die Elemente des Groovemixers

Schritt für Schritt: Ein kleiner Mixer

Der Code für die Schaltflächen landet per Ereignisprozeduren im ersten Schlüsselbild des Hauptfilms auf der Ebene ActionScript. Den Code für die Regler geben Sie in den MovieClips der Regler ein.

Zuerst erstellen Sie vier neue Sound-Objekte, die Sie an jeweils eigene MovieClips binden:

drumLoop1_sound = new Sound(dloop1_mc);
drumLoop2_sound = new Sound(dloop2_mc);
synthiLoop1_sound = new Sound(sloop1_mc);
synthiLoop2_sound = new Sound(sloop2_mc);

Das Ziel dieser Sound-Objekte sind vier MovieClips, die in unserem Beispiel als leere Instanzen auf der Ebene ActionScript liegen.

Durch dieses Zuweisen der Sound-Objekte zu eigenständigen MovieClips lassen sich alle vier Sounds einzeln steuern.

Anschließend fügen Sie die vier Sounds zu den Sound-Objekten hinzu:

drumLoop1_sound.attachSound("drums1");
drumLoop2_sound.attachSound("drums2");
synthiLoop1_sound.attachSound("synthi1");
synthiLoop2_sound.attachSound("synthi2");

Die Sounds haben wir bereits in der vorbereiteten Datei für ActionScript exportiert und mit den vier Namen drums1, drums2, synthi1 und synthi2 versehen.

Als Nächstes versehen Sie die vier Schaltflächen für die einzelnen Sounds mit Funktionalität. Hier der Code für die erste Schaltfläche der Drums:

drums1_btn.onRelease = function() {
   drumLoop2_sound.stop();
   drumLoop1_sound.start(0, 50000);
};

Der Sound für die zweiten Drums wird angehalten, der für die ersten gestartet.

Der Code für die anderen drei Schaltflächen entsteht analog, Sie müssen nur den Instanznamen der Schaltflächen und die Namen der Sounds austauschen.

Da der Start hier immer bei Position 0 erfolgt, kann ein Sound mehrmals aufgerufen werden, wenn der Nutzer die Schaltfläche öfter drückt; das führt zu neuen interessanten Effekten.

Wenn Sie dies vermeiden möchten, verwenden Sie die Methode für das Sound-Abspielen aus dem vorherigen Beispiel »Einfache Soundsteuerung«, Schritt 3.

Jetzt fügen Sie den Code für die beiden Stopp-Schaltflächen ein:

dstoppen_btn.onRelease = function() {
   drumLoop1_sound.stop();
   drumLoop2_sound.stop();
};
sstoppen_btn.onRelease = function() {
   synthiLoop1_sound.stop();
   synthiLoop2_sound.stop();
};

Der Schieberegler für die Lautstärke funktioniert genauso wie der Schieberegler aus dem Beispiel »Einfache Soundsteuerung«, Schritt 5:

onClipEvent (enterFrame) {
   _parent.drumLoop1_sound.setVolume(Math.round(100+(dposoben_num-_y)));
   _parent.drumLoop2_sound.setVolume(Math.round(100+(dposoben_num-_y)));
}

Die einzigen Unterschiede zum vorigen Beispiel der einfachen Soundsteuerung: Der Schieberegler ist hier genau 100 Pixel hoch, deswegen kann der Wert direkt übernommen werden. Außerdem müssen Sie die Lautstärke in diesem Beispiel für beide Sound-Objekte des jeweiligen Bereichs (Drums und Synthi) festlegen.

Zum Schluss wechseln Sie in die Aktion für den MovieClip mit dem Drehregler und fügen folgenden Code hinzu:

on (press) {
   var mausklick:Boolean = true;
}
on (release, releaseOutside) {
   mausklick = false;
}
onClipEvent (mouseMove) {
   if (mausklick) {
      var rotation_num:Number = Math.atan2(_parent._ymouse – 
      _y, _parent._xmouse – _x) * 180 / Math.PI;
      if (rotation_num < –150) {
         rotation_num = –150;
         this._rotation = rotation_num;
         _root.drumLoop1_sound.setPan(rotation_num) * 0.67;
         _root.drumLoop2_sound.setPan(rotation_num) * 0.67;
      } else if (rotation_num > 150) {
         rotation_num = 150;
         this._rotation = rotation_num;
         _root.drumLoop1_sound.setPan(rotation_num) * 0.67;
         _root.drumLoop2_sound.setPan(rotation_num) * 0.67;
      } else {
         this._rotation = rotation_num;
         _root.drumLoop1_sound.setPan(rotation_num) * 0.67;
         _root.drumLoop2_sound.setPan(rotation_num) * 0.67;
      }
      updateAfterEvent();
   }
}

Eine ausführliche Erklärung erhalten Sie im Exkurs zum Drehregler am Ende des Kapitels. Der Code des zweiten Drehreglers entsteht analog, nur dass die Sounds drumLoop1_sound und drumLoop2_sound durch synthiLoop1_sound und synthiLoop2_sound ersetzt werden.

Abbildung 16.8 Der Nutzer mixt die Sounds, wie er möchte.

Die fertige Datei finden Sie auf der CD-ROM unter dem Namen groovemixer_AS2.fla bzw. groovemixer_AS1.fla. Auch hier können Sie einiges verändern und anpassen. Wie wäre beispielsweise die Idee, auch die Drums zusammenzuschalten? Oder Sie bauen noch aufwendigere Sound-Transformationen ein.

Exkurs: Drehregler

Wie versprochen, zeigen wir Ihnen zum Schluss die Logik des Drehreglers. Dazu finden Sie auf der CD-ROM einen Drehregler in der Datei drehregler.fla. Er gibt nach dem Drehen seinen Winkel in ein dynamisches Textfeld aus.

Abbildung 16.9 Um 112° gedreht …

Sehen Sie sich den Code in der Aktion des MovieClips ein wenig genauer an:

1. Zuerst überprüfen Sie mit dem Ereignis press, ob der Nutzer gerade die Maustaste auf dem Drehregler drückt. Wenn ja, erhält die Prüfvariable mausklick den Wert true:
       
on (press) {
   var mausklick:Boolean = true;
}
2. Lässt der Nutzer die Maustaste los, geben Sie den Drehwinkel aus und schalten die Prüfvariable mausklick auf false:
       
on (release, releaseOutside) {
   _root.anzeige_str = this._rotation;
   mausklick = false;
}
    • Hier sehen Sie eine Besonderheit: Wir reagieren gleichzeitig auf zwei Ereignisse. Wenn der Nutzer die Maustaste loslässt oder sie außerhalb des Drehreglers loslässt. Beides soll dasselbe bewirken. Wenn Sie nur release abfangen würden, könnte der Nutzer die Maustaste außerhalb der Grafik des Drehreglers loslassen, ohne dass die Drehbewegung beendet wird.
3. Bewegt sich die Maus irgendwo im SWF-Film, prüfen Sie zuerst, ob die Maustaste gedrückt ist:
       
onClipEvent (mouseMove) {
   if (mausklick) {
    • Das ist der »große« Trick: Einerseits bedienen Sie den Drehregler nur, wenn die Maustaste auf ihm gedrückt ist, andererseits reagieren Sie auf Mausbewegungen!
4. Nun berechnen Sie die Rotation in Abhängigkeit von der Mausbewegung. Hier kommt die Methode atan2(x, y) der Math-Klasse zum Einsatz: Sie berechnet den Winkel eines Punktes mit den Koordinaten x und y relativ zum Ursprung des Koordinatensystems.
       
      var rotation_num:Number = Math.atan2(_parent._ymouse – 
_y, _parent._xmouse – _x) * 180 / Math.PI;
    • An dieser Stelle verwenden Sie die Mausposition abzüglich der Position des Drehreglers zur Berechnung der beiden Punkte. Deswegen muss der Registrierungspunkt des Drehreglers in seiner Mitte liegen. Der Winkel wird von atan2() als Bogenmaß geliefert und muss in einen Winkel umgerechnet werden.
5. Nun weisen Sie die Rotation in gerundeter Form dem Drehregler zu:
       
      this._rotation = Math.round(rotation_num);
      updateAfterEvent();
   }
}

Das war der einfache Drehregler mit Textfeld, den Sie für beliebige Anwendungen adaptieren können. Die in Schritt 6 unseres Beispiels »Ein kleiner Mixer« eingeführten Drehregler für die Balance funktionieren analog, allerdings mit zwei Unterschieden:

Zum einen dient der Rotationswinkel (rotation_num) nicht nur der Rotation, sondern auch zur Berechnung der Balance:

_root.drumLoop1_sound.setPan(rotation_num) * 0.67;

Zum anderen schließt eine Fallunterscheidung Rotationswinkel zwischen +150° und –150° aus und setzt in solchen Fällen den Rotationswinkel auf diese Extremwerte:

if (rotation_num < –150) {
   rotation_num = –150;

Damit soll vermieden werden, dass der Drehregler im unteren Bereich zwischen den Extremen links und rechts (bei –150° und +150°) noch Werte annimmt.

 



Ihre Meinung

Wie hat Ihnen das Openbook gefallen? Wir freuen uns immer über Ihre Rückmeldung. Schreiben Sie uns gerne Ihr Feedback als E-Mail an kommunikation@rheinwerk-verlag.de.

 <<   zurück
  
  Zum Rheinwerk-Shop
Zum Rheinwerk-Shop: ActionScript 3 – Das Praxisbuch
ActionScript 3
Das Praxisbuch

bestellen
 Ihre Meinung?
Wie hat Ihnen das Openbook gefallen?
Ihre Meinung

 Buchtipps
Zum Rheinwerk-Shop: JavaScript






 JavaScript


Zum Rheinwerk-Shop: jQuery






 jQuery


Zum Rheinwerk-Shop: Responsive Webdesign






 Responsive Webdesign


Zum Rheinwerk-Shop: Suchmaschinen-Optimierung






 Suchmaschinen-
 Optimierung


Zum Rheinwerk-Shop: Schrödinger lernt HTML5, CSS3 und JavaScript






 Schrödinger lernt
 HTML5, CSS3
 und JavaScript


 Lieferung
Versandkostenfrei bestellen in Deutschland, Österreich und der Schweiz
InfoInfo




Copyright © Rheinwerk Verlag GmbH 2006
Für Ihren privaten Gebrauch dürfen Sie die Online-Version natürlich ausdrucken. Ansonsten unterliegt das Openbook denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt.
Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.


Nutzungsbestimmungen | Datenschutz | Impressum

Rheinwerk Verlag GmbH, Rheinwerkallee 4, 53227 Bonn, Tel.: 0228.42150.0, Fax 0228.42150.77, service@rheinwerk-verlag.de

Cookie-Einstellungen ändern