المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : مشغل الميديا في فلاش FLVPlayback وكيفية عمل اسطوانة فيديوهات


azizsoft
11-05-2015, 07:12 PM
بسم الله الرحمن الرحيم
الحمدلله والصلاة والسلام على رسول الله وعلى آله وصحبه أجمعين
السلام عليكم ورحمة الله وبركاته


يسعدني اخوتي الكرام أن أقدم لكم في هذا الموضوع شرح للمكون الجاهز في برنامج فلاش FLVPlayback
وكيفية استغلاله في عمل اسطوانات اسلامية وتعليمية هادفة .
http://www.ligams.com/var/ezwebin_site/storage/images/media/images/flvplayback-sur-scene/4533-1-fre-FR/FLVPlayback-sur-scene.jpg

سنحاول ان شاء الله تبسيط شرح الاكواد حتى تكون الفائدة كبيرة .

بداية وجب أن نشير الى ان اكشن سكريبت توفر كلاسات اخرى غير هذا المكون يمكن من خلالها انشاء مشغل فيديو بكامل خصائصه
وهاته الكلاسات هي :
flash.media.Video
flash.net.NetConnection
flash.net.NetStream
لكن طريقة توظيفها في مشروع معين تتطلب خبرة برمجية متقدمة يطول شرحها كثيرا لذلك نمر مباشرة الى شرحنا وننسى هذا الجزء من الموضوع .

تعريف سريع للمكون :

التحكم البرمجي (programming interface (API لمكون FLVPlayback يتم من خلال خصائصproperties ووظائف methods
وأحداث events .
الخصائص properties تتعلق مثلا بالتحكم في المكون حجم الفيديو عرضه طوله مكانه في المسرح x و y الشكل = السكن skin الخ ...
الوظائف methods هي الدوال لتنفيذ أوامرمعينة من المشغل مثل التشغيل ()play والايقاف المؤقت ()pause والايقاف ()stop الخ ..
الاحداث events وهي هامة لتنفيذ أوامر معينة اثناء تشغيل الفيديو يعني تقدر تنفذ امر في زمن معين من الفيديو تعلن عنه مسبقا مثل
cuePoint و complete و seeked الخ ..

نمر الان الى الشرح وارجو أن تتابع معي اخي الكريم بالتطبيق كي تفهم جيدا وتحسن استغلال هذا المكون وطريقة صياغة الاكواد .
قبل ان تواصل القراءة افتح مجلد بسطح المكتب ضع بداخلة 3 فيديوهات أو ماتشاء ويفضل أن تكون الاسماء v1 v2 v3 الخ ... وصيغة الفيديوهات FLV .
افتح برنامج الفلاش غير المقاس الىW=800 و 600= H الان اضغط windows ثم components اضغط مجلد فيديو واسحب مكون FLVPlayback ومن خانة properties عير مقاسه الى W=800 و 600= H وفي خانة الانستنس نايم اعطه اسم player
في المسرح اضف 3 أزرار أو بحسب عدد الفيديوهات التي لديك في المجلد يفضل ان تكون الاسماء btn1 btn2 btn3 ...... الخ
واحفظ المشروع في المجلد بجانب الفيديوهات = انتهيت = طيب جميل نتابع .

ملاحظة : هناك عديد الطريق لصياغة الاكواد واضافة احداث كثيرة مثل صور نصوص تاثيرات حسب نوع التصميم لكن سنتطرق فقط للطريقة المختصرة في هذا المشروع على افتراض ان لدينا مشروع فيديوهات وازرار تحكم ويمكن طبعا تنفيذ اي اوامر اخرة مع اي زر


طيب اخي الفاضل الان اضف طبقة جديدة باسم Action حددها واضغط F9
1/ === سنقوم باستدعاء كل كلاسات المكون من خلال هذا الكود انسخه والصقه

import fl.video.*;


2/ === سنقوم بتخزين كل الازار في مصفوفة ايضا انسخ الكود والصقه واضف داخلها اسماء الازار اذا كانت اكثر من 3

var btn:Array = new Array(btn1,btn2,btn3);

سنقوم بتخزين كل الفيديوهات في مصفوفة ايضا انسخ الكود والصقه واضف داخلها اسماء الفيدوهات اذا كانت اكثر من 3

var video:Array = new Array("v1.flv","v2.flv","v3.flv");


نضيف ايضا هذا الكود لتأكيد مسار الفيديوهات

video.source = video[i];

نضيف ايضا هذا الكود اختياري للتغيل التلقائي للفيديو = الرقم 0 هو الفيدو الاول لوتحب يشتغل الفيدو الرابع ضع رقم 3 مثلا
ولو شئت اضف له comment يعني عدم تفعيله //

player.play(video[0]);//تشغيل الفيديو الاول اليا


سنضيف الان كود التكرار على كل الازرار للاستماع لحدث النقر كالعادة انسخ والصق في الاسفل


for (var i:int = 0;i<btn.length ; i++)
{
btn[i].addEventListener(MouseEvent.CLICK,OnClick)
}


طبيعي الان أن نضيف ما هو مطلوب تنفيذة عند حصول حدث النقر على اي زر في المصفوفة لذلك انسخ والصق هذا الكود




function OnClick(event:MouseEvent):void
{
for (var i:int = 0;i<btn.length ; i++)

{
if (event.currentTarget == btn[i]){
player.play(video[i]);

}

}

}


باختصار معنى الكود أنه اشتطرنا أنه اذا اي زر في ترتيب المصفوفة مقصود بحدث الضغط event.currentTarge
سيشغل الفيديو المقابل لم في ترتيبه بمصفوفة الفيديوهات .

احفظ المشروع اضغط Ctrl + Enter وعاين النتيجة


الان أخي الكريم تعلمنا كيفية اعداد مشروع فيديوهات باسلوب مبسط وسهل وهذا ليس كل شىء
مازال امامنا معرفة كيفية اضافة صورة عند الضغط على زر معين اضافة عنوان فيديو في حقل نصي
ايقاف فيديو في أوقات معينة وعند الايقاف تنفيذ حدث معين وعدة اشياء اخرى وكيفية اخراج الاسطوانة في ملف تنفيذي واحد

أرجو ممن تابعنا معنا الشرح أن لاينسانا بدعوة صالحة .


الجزء الثاني من الشرح
(http://www.abc4web.net/vb/showthread.php?t=31662)

abohmam
11-05-2015, 07:54 PM
جزاك الله خيرا أخى الفاضل عزيز

شرح رائع ومميز ان شاء الله يستفيد منه جميع الأخوة المهتمون بتجميعات الدروس

بارك الله فيك وفى جهودك المميزة

azizsoft
11-05-2015, 07:58 PM
بسم الله الرحمن الرحيم

بارك الله فيكم أستاذ أبو همام على حضوركم واهتمامكم
وفقكم الله يا طيب :abc_022:

انـا مسلم
11-05-2015, 10:54 PM
شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية . :abc_138:

خادم المسلمين
11-05-2015, 11:18 PM
مشكور اخى عزيز
شرح ممتاز وكنا جميعا فى امس الحاجة لمثل هذه الشروحات لمزيد من مراجعة الدوال والاحداث الخاصة بهذا المشغل الرائع



عموما طبقت بطريقة اخرى
http://store1.up-00.com/2015-05/1431377011061.jpg (http://www.up-00.com/)

http://store1.up-00.com/2015-05/1431377011182.jpg (http://www.up-00.com/)

وتم تطبيق شرحك لانه يمتاز اكثر بأنه تم استخدام اللوب مرتين وتوفير استخدام الشرط اكثر من مرة
بجد انااستفدت منه كثيرا فى مسألة الاختصار

التطبيق
http://www.gulfup.com/?385chO

azizsoft
11-05-2015, 11:41 PM
بسم الله الرحمن الرحيم

بارك الله فيكم اخي فيصل
نعم يمكن ايضا اعتماد هاته الطريقة وهي صحيحة وهنا يمكن ان تطبق الجزء الثاني من الشرح باضافة الحقل النصي
من الاسفل وتعطه اسم dt وفي طبقة الاكشن واسفل مسار كل فيديو تلصق فقط كود تغيير الحقل النصي ليصبح مثلا


flv_mc.source = "ALENSAN.mp4";
dt.text = "سورة الانسان";



بالنسبة للشرح بالموضوع صحيح ومجرب راجع امتداد الفيديوهات وان كان هناك خطاء اخر
:abc_022:

خادم المسلمين
11-05-2015, 11:42 PM
هل ننتظر جزءا ثالثا ان شاء الله؟

azizsoft
11-05-2015, 11:45 PM
الثالث والرابع والخامس ان شاء الله :abc_088:

خادم المسلمين
11-05-2015, 11:50 PM
الثالث والرابع والخامس ان شاء الله :abc_088:

طيب تمام
بما انك اخى سبقتنى فى المبادرة الى الشرح
وطبعا وفرت علي الكثير من التعب:abc_065:
هههه:abc_051:
ننتظر منك شرح جزئية عمل زر تالى وزر سابق
وايضا
الانتقال التلقائى بين الفيديوهات
واخيرا عمل تاثيرات انتقالية بين الفيديو والاخر
ممممممممم
بس :abc_088:
:abc_156:كفاية كدة

azizsoft
12-05-2015, 12:02 AM
اخي فيصل حملت تطبيقك ولاحظت ان غيرت الكود الاخير كما انك
حذفت أو كود الخاص بكل كلاسات المكون وهو

import fl.video.*;


لذلك لما طبقت على الملف المرفق اشتغل تمام .

المهم انا احضر في الجزء الثالث وسيكون افضل بكثير من التالي والسابق :abc_022:

خادم المسلمين
12-05-2015, 12:27 AM
اخي فيصل حملت تطبيقك ولاحظت ان غيرت الكود الاخير كما انك
حذفت أو كود الخاص بكل كلاسات المكون وهو

import fl.video.*;


لذلك لما طبقت على الملف المرفق اشتغل تمام .

المهم انا احضر في الجزء الثالث وسيكون افضل بكثير من التالي والسابق :abc_022:

معاك للصبح ان شاء الله اجازة وسهرة صباحى يا استاذى المهم ننتهز فرصة تواجدا لنستفيد منك:abc_088:

عوض السوداني
12-05-2015, 07:40 AM
جزاك الله كل خير اخي عزيز
وجعل في ميزان حسناتك
ان شاء الله سيتم التطبيق لاحقا
:abc_022:

azizsoft
12-05-2015, 01:34 PM
جزاك الله كل خير اخي عزيز
وجعل في ميزان حسناتك
ان شاء الله سيتم التطبيق لاحقا
:abc_022:

بارك الله فيكم
ان شاء نستكمل الموضوع الى غاية اخراج العمل في ملف تنفيذي واحد .

ودالثورة
12-05-2015, 02:42 PM
موفق بإذن الله ... لك مني أجمل تحية .
جزاء الله خير على الشرح

أبو يوسف
12-05-2015, 05:32 PM
جزاك الله خيرا اخانا عزيز :abc_152: وبارك الله فيك

شرح رائع وسهل

ميزو فوكس
18-05-2015, 11:39 AM
شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

ايوب شاكر
24-06-2015, 06:17 AM
شكراااااااااا

الموسوعة للمعلوماتية
15-02-2016, 08:08 AM
نفع الله بكم

محمدعلواني
02-08-2016, 06:15 PM
جزاك الله خيرا

عبد الهادي بهاب
01-01-2017, 10:04 PM
السلام عليكم ورحمة الله وبركاته
شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

اميجو
02-04-2018, 08:38 PM
شكرا جزاك الله خير

محمد عماد الدين
12-08-2018, 05:54 PM
بسم الله الرحمن الرحيم
موفق بإذن الله ... لك مني أجمل تحية .