אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » מדריכים » לימוד Action Script 3 ו-פלאש » אודיו עם ActionScript 3

אודיו עם ActionScript 3

רן בר-זיק אוגוסט 10, 2009 12:42 pm אין תגובות

מאמר המלמד כיצד להוסיף קבצי אודיו – MP3 לפלאש וכיצד לשלוט בהם.

המאמר הקודם במדריך ה-AS3אכסון מידע מקומי באמצעות ShareObjects
המאמר הבא במדריך ה-AS3וידאו ב-ActionScript 3
כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

במאמר הקודם למדנו על שמירת מידע במחשב המקומי באמצעות ActionScript 3. במאמר הזה נלמד על פלאש ואודיו. אודיו הוא אחד הדברים ש-ActionScript מנהל בצורה טובה הרבה יותר מכל שפת Client Side אחרת.

ב-ActionScript 3 יש 5 קלאסים שמטפלים באודיו:

Sound – שמטפל בהעלאה של הקובץ ובמידע עליו, יחד עם SoundLoaderContext.

SoundMixer – מנהל את כל האודיו ושולט עליהם (כמו למשל על רמת הקול).

SoundChannel – כאשר אנו מנגנים קובץ, הוא מתנגן בערוץ משלו. בפלאש יש לנו מקום של עד 32 ערוצים שונים לניגון אודיו. אנו יכולים לשלוט על ערוץ ספציפי עם SoundTransform.

הדיאגרמה הבאה מראה איך הכל עובד:

דיאגרמה המראה איך האודיו עובד בפלאש

קובץ ה-MP3 יכול להגיע משני מקורות. הראשון הוא לייבא באמצעות ה-GUI של פלאש את הקובץ לספריה, בדיוק כפי שעשינו את זה במאמר שהסביר איך לעבוד עם bitmap:
פותחים את ה-fla שבו אנו ניצור את האובייקטים שלנו, לוחצים על file ואז על import ואחרי כן לבחור ב-import to library. בוחרים את קובץ ה-MP3 שרוצים להעלות. לוחצים Ctrl+L על מנת לראות את כל הקבצים שיש 'בספריה', לוחצים על הקובץ שלנו עם הכפתור הימני ואז לוחצים על Linkage. מסמנים את Export for ActionScript ואז בוחרים את שם ה-class שישמש אותנו.

אנחנו יכולים גם לייבא את הקובץ מבחוץ באמצעות URLLoader וזה בדיוק מה שנעשה בדוגמא.

ועכשיו לדוגמא, אני אצור קובץ mySoundPlayer.as שדומה לזה שהשתמשנו בו במאמר הקודם – יש בו שלושה כפתורים – 'play' שמתחיל לנגן קובץ MP3 שאותו אני מייבא מבחוץ, stop שמפסיק את ניגון הקובץ וכפתור mute/unmute.

בסך הכל המבנה של הנגן שלי מאד דומה למבנה שבו השתמשתי במאמר על ShareObjects ואני לא צריך לפרט עליו מדי. הנה השלד שלו, ללא כל אובייקט Sound. שימו לב להערות בקוד:


package {
	import flash.display.Sprite;
	import flash.events.*;
	import flash.geom.*;
	import flash.text.*;
	import flash.net.*;

	public class mySoundPlayer 
	{
		private var myStage;
		
		private var mute:Boolean = false;
		private var startingX:Number = 10;

		public function mySoundPlayer(myStage) 
		{
			this.myStage = myStage;
			createButton('play');
			createButton('stop');
			createButton('mute/unmute');
		}
		private function createButton(buttonText:String) {
			/* Creating Sprite */
			this.startingX+=20;
			var m_animSprite:Sprite = new Sprite();
			m_animSprite.graphics.beginFill(0x000000);
			m_animSprite.graphics.drawRect(startingX, 100, 50, 50);
			m_animSprite.graphics.endFill();
			this.myStage.addChild(m_animSprite);

			/* Creating text Field */
			var myTextField:TextField = new TextField();
			myTextField.text = buttonText;
			myTextField.textColor = 0xFF0000;
			myTextField.x = startingX+5;
			myTextField.y = 100;
			this.myStage.addChild(myTextField);
			this.startingX+=100;
			
			/* Adding event handlers */
			switch (buttonText) {
				case "play" :
					myTextField.addEventListener(MouseEvent.CLICK, playMySound);
					break;
				case "stop" :
					myTextField.addEventListener(MouseEvent.CLICK, stopMySound);
					break;
				case "mute/unmute" :
					myTextField.addEventListener(MouseEvent.CLICK, muteUnmuteMySound);
					break;
				default :
					trace("Error");
			}
		}
		private function playMySound(ev:Event) {
			//Play The sound
		}
		private function stopMySound(ev:Event) {
			//Stop the sound
		}
		private function muteUnmuteMySound(ev:Event) {

			if (this.mute == false) 
			{
				//Mute
			} 
			else 
			{
				//Unmute
			}
		}
	}
}

וכך נראה ה-fla שיוצר את האובייקט שלנו. לא לשכוח לשמור את שני הקבצים – ה-as וה-fla באותה תיקיה!


var m_mySound:mySoundPlayer  = new mySoundPlayer(stage);

טעינת הקובץ

קובץ האודיו שלנו הוא שיר מתקופת מלחמת העולם הראשונה (שניתן להשמיעו ולהורידו לפי חוק זכויות היוצרים בישראל) שנמצא בכתובת הבאה:

https://internet-israel.com/internet_files/flash/sample_song.mp3
אנו נטען אותו באמצעות urlRequest פשוט כפי שעשינו בעבר. ןאז ניצור אובייקט sound. אנו עושים זאת כך:

יוצרים אובייקט sound:


private var sound:Sound = new Sound();

את ה-urlRequest וטעינתו לתוך אובייקט ה-sound שלנו אנו עושים כך:


			var url:String = "https://internet-israel.com/internet_files/flash/sample_song.mp3";
			var urlRequest:URLRequest = new URLRequest(url);
			this.sound.load(urlRequest);

עכשיו יש צורך ליצור SoundChannel כדי לנגן את קובץ האודיו שטענו. עושים זאת כך, ראשית אנו ניצור private var soundChannel:SoundChannel ואחרי כן, בפונקצית ה-play:


this.soundChannel = this.sound.play();

זה הכל! על מנת לעשות פעולת stop, אנו משתמשים בשורה הבאה:


this.soundChannel.stop();

soundTransform גם הוא פשוט יחסית, כל מה שעושים זה להכניס את הקוד הבא.


				transform = soundChannel.soundTransform;
            	transform.volume = כל מספר בין 0 ל-1;
            	soundChannel.soundTransform = transform;

הקוד המלא של הנגן הוא:


package {
	import flash.display.Sprite;
	import flash.events.*;
	import flash.geom.*;
	import flash.text.*;
	import flash.net.*;
	import flash.media.*

	public class mySoundPlayer 
	{
		private var myStage;
		
		private var mute:Boolean = false;
		private var startingX:Number = 10;
		private var sound:Sound = new Sound();
		private var soundChannel:SoundChannel;
		private var transform;
		
		public function mySoundPlayer(myStage) 
		{
			this.myStage = myStage;
			createButton('play');
			createButton('stop');
			createButton('mute/unmute');
			
			
			var url:String = "https://internet-israel.com/internet_files/flash/sample_song.mp3";
			var urlRequest:URLRequest = new URLRequest(url);
			this.sound.load(urlRequest);
			
		}
		private function createButton(buttonText:String) {
			/* Creating Sprite */
			this.startingX+=20;
			var m_animSprite:Sprite = new Sprite();
			m_animSprite.graphics.beginFill(0x000000);
			m_animSprite.graphics.drawRect(startingX, 100, 50, 50);
			m_animSprite.graphics.endFill();
			this.myStage.addChild(m_animSprite);

			/* Creating text Field */
			var myTextField:TextField = new TextField();
			myTextField.text = buttonText;
			myTextField.textColor = 0xFF0000;
			myTextField.x = startingX+5;
			myTextField.y = 100;
			this.myStage.addChild(myTextField);
			this.startingX+=100;
			
			/* Adding event handlers */
			switch (buttonText) {
				case "play" :
					myTextField.addEventListener(MouseEvent.CLICK, playMySound);
					break;
				case "stop" :
					myTextField.addEventListener(MouseEvent.CLICK, stopMySound);
					break;
				case "mute/unmute" :
					myTextField.addEventListener(MouseEvent.CLICK, muteUnmuteMySound);
					break;
				default :
					trace("Error");
			}
		}
		private function playMySound(ev:Event) 
		{
			this.soundChannel = this.sound.play();
		}
		private function stopMySound(ev:Event) 
		{
			this.soundChannel.stop();
		}
		private function muteUnmuteMySound(ev:Event) {
			
			if (this.mute == false) 
			{
				//Mute
				transform = soundChannel.soundTransform;
            	transform.volume = 0;
            	soundChannel.soundTransform = transform;
				
				this.mute = true;
			} 
			else 
			{
				//Unmute
				transform = soundChannel.soundTransform;
            	transform.volume = 1;
            	soundChannel.soundTransform = transform;
				
				this.mute = false;
			}
		}
	}
}

ככה זה נראה במציאות – נגן חביב שמסוגל לנגן, לעצור ולעשות mute או unmute.

יש כמובן עוד שפע של תכונות שמאפשרות לנו לעשות עוד לא מעט דברים, כל הדברים זמינים תחת כל האובייקטים שלמדנו בדוקומנטציה של פלאש.

במאמר הבא אנו נלמד על וידאו בפלאש דרך ActionScript 3.

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
קרנה של פלאש ירדה בשנים האחרונות, אבל כאן תוכלו ללמוד AS3 או לשפר את הידע שלכם בשפה זו.
המדריך ללימוד Action Scrip 3
ActionScript 3
ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

    הפרויקטים שאני כותב ושוחררו לציבור ברישיון קוד פתוח נמצאים ברובם בגיטהאב.
חיפוש

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד