برنامج تعليمي VideoView مع مثال في Android Studio
في Android ، يتم استخدام VideoView لعرض ملف فيديو. يمكنه تحميل الصور من مصادر مختلفة (مثل موفري المحتوى أو الموارد) مع الاهتمام بحساب قياسه من الفيديو بحيث يمكن استخدامه لأي مدير تخطيط ، مما يوفر خيارات عرض مثل القياس والتلوين.
ملاحظة مهمة: لا يحتفظ VideoView بحالته الكاملة عند الانتقال إلى الخلفية. على وجه الخصوص ، لا يستعيد وضع اللعب الحالي وحالة اللعب. يجب أن تحفظ التطبيقات هذه وتستعيدها في onSaveInstanceState (Bundle) و onRestoreInstanceState (Bundle).
كود VideoView في XML Android:
<VideoView android:id="@+id/simpleVideoView" android:layout_width="fill_parent" android:layout_height="fill_parent" />
جدول المحتويات
الطرق والدوال المستخدمة في VideoView :
دعنا نناقش بعض الطرق المهمة لـ VideoView التي قد يتم استدعاؤها من أجل إدارة تشغيل الفيديو :
1. setVideoUri (Uri uri): تُستخدم هذه الطريقة لتعيين المسار المطلق لملف الفيديو الذي سيتم تشغيله. تأخذ هذه الطريقة كائن Uri كوسيطة.
أدناه قمنا بتعيين uri للفيديو المحفوظ في Android Studio:
الخطوة 1: قم بإنشاء دليل جديد في مجلد res وقم بتسميته خام
الخطوة 2: احفظ اسم الفيديو fishvideo في المجلد raw
الخطوة 3: الآن استخدم الكود أدناه لتعيين مسار الفيديو باستخدام طريقة setVideoUri () في VideoView.
// initiate a video view
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView);
simpleVideoView.setVideoURI(Uri.parse("android.resource://" + getPackageName() + "/" + R.raw.fishvideo));
إعداد الفيديو من مصدر ويب على الإنترنت :
الخطوة 1: قم أولاً بإضافة تصريح الإنترنت في Manifest. xml . سنحتاج إلى إضافة هذا للوصول إلى الفيديو عبر الإنترنت. افتح AndroidManifest. xml وأضف الكود أدناه
<!--Add this before application tag in AndroidManifest.xml--> <uses-permission android:name="android.permission.INTERNET" />
الخطوة 2: أضف كود VideoVideo XML الأساسي في activity_main.xml أو activity.xml
الخطوة 3: استخدم الكود أدناه للوصول إلى الفيديو من موقعنا على الإنترنت .
package abhiandroid.com.videofromwebsource;
import android.app.ProgressDialog;
import android.net.Uri;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.VideoView;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Uri uri = Uri.parse("/ui/wp-content/uploads/2016/04/videoviewtestingvideo.mp4");
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view
simpleVideoView.setVideoURI(uri);
simpleVideoView.start();
}
}
2. setMediaController ( MediaController controller): تُستخدم طريقة VideoView هذه لتعيين وحدة التحكم لعناصر التحكم في تشغيل الفيديو.
نوضح أدناه كيفية تعيين كائن وحدة التحكم في الوسائط لعرض الفيديو .
// create an object of media controller MediaController mediaController = new MediaController(this); // initiate a video view VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // set media controller object for a video view simpleVideoView.setMediaController(mediaController);
3. start (): تُستخدم طريقة VideoView هذه لبدء تشغيل ملف الفيديو.
نوضح أدناه كيفية بدء تشغيل مقطع فيديو في عرض الفيديو .
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view simpleVideoView.start(); // start a video
4. pause (): تُستخدم طريقة عرض الفيديو هذه لإيقاف التشغيل الحالي مؤقتًا.
نوضح أدناه كيفية إيقاف مقطع فيديو مؤقتًا في عرض الفيديو.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view simpleVideoView.pause(); // pause a video
5. canPause (): ستخبر هذه الطريقة ما إذا كان VideoView قادرًا على إيقاف الفيديو مؤقتًا. تُرجع هذه الطريقة قيمة منطقية تعني إما صواب أو خطأ. إذا كان من الممكن إيقاف مقطع فيديو مؤقتًا ، فسيتم إرجاعه "صحيحًا" وإلا فإنه سيعرض "خطأ".
نتحقق أدناه مما إذا كان مقطع الفيديو قادرًا على التوقف مؤقتًا أم لا.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view Boolean canPauseVideo = simpleVideoView.canPause(); // check whether a video is able to pause or not
6. canSeekForward (): ستخبر هذه الطريقة ما إذا كان الفيديو قادرًا على المضي قدمًا. تقوم هذه الطريقة بإرجاع قيمة منطقية مثل صواب أو خطأ. إذا كان مقطع الفيديو يمكنه التقدم ، فسيتم إرجاعه صحيحًا وإلا فسيتم إرجاعه كاذب.
نتحقق أدناه مما إذا كان مقطع الفيديو قادرًا على التقدم أم لا.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view Boolean canSeekForward = simpleVideoView.canSeekForward(); // checks whether a video view is able to seek forward or not
7. canSeekBackward (): ستخبر هذه الطريقة ما إذا كان الفيديو قادرًا على الرجوع للخلف. تقوم هذه الطريقة بإرجاع قيمة منطقية مثل صواب أو خطأ. إذا كان مقطع الفيديو يمكنه الرجوع للخلف ، فسيعود صحيحًا وإلا فإنه سيعيد القيمة false.
نتحقق أدناه مما إذا كان مقطع الفيديو قادرًا على الرجوع للخلف أم لا.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view Boolean canSeekBackword = simpleVideoView.canSeekBackward(); // checks whether a video view is able to seek backword or not
8. getDuration (): تستخدم هذه الطريقة للحصول على المدة الإجمالية لبرنامج VideoView. هذه الطرق ترجع قيمة عدد صحيح.
أدناه نحصل على المدة الإجمالية لمشاهدة الفيديو.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view int duration =simpleVideoView.getDuration();// get the total duration of the video
9. getCurrentPosition () : تُستخدم هذه الطريقة للحصول على موضع التشغيل الحالي. هذه الطريقة ترجع قيمة عدد صحيح.
أدناه نحصل على الوضع الحالي للتشغيل.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view int currentPosition = simpleVideoView.getCurrentPosition(); // get the current position of the video play back
10. isPlaying (): تخبر هذه الطريقة ما إذا كان الفيديو قيد التشغيل حاليًا أم لا. ترجع هذه الطريقة قيمة منطقية. يعود صحيحًا إذا تم تشغيل الفيديو أو خطأ إذا لم يكن كذلك.
أدناه نتحقق مما إذا كان عرض الفيديو قيد التشغيل حاليًا أم لا
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view Boolean isPlaying = simpleVideoView.isPlaying(); // check whether a video view is currently playing or not
11. stopPlayback (): تُستخدم طريقة VideoView هذه لإيقاف تشغيل الفيديو.
نوضح أدناه كيفية إيقاف الفيديو في عرض الفيديو.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view simpleVideoView.stopPlayback(); // stop a video
12. setOnPreparedListener (MediaPlayer.OnPreparedListener): هذا مستمع يسمح باستدعاء طريقة رد الاتصال عندما يكون الفيديو جاهزًا للتشغيل .
نعرض أدناه استخدام حدث setOnPreparedListener لعرض الفيديو.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view
// perform set on prepared listener event on video view
simpleVideoView.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
@Override
public void onPrepared(MediaPlayer mp) {
// do something when video is ready to play
}
});
13. setOnErrorListener (MediaPlayer.OnErrorListener): يسمح هذا المستمع باستدعاء طريقة رد الاتصال عند حدوث خطأ أثناء تشغيل الفيديو.
نعرض أدناه استخدام حدث setOnErrorListener لعرض الفيديو.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view
// perform set on error listener event on video view
simpleVideoView.setOnErrorListener(new MediaPlayer.OnErrorListener() {
@Override
public boolean onError(MediaPlayer mp, int what, int extra) {
// do something when an error is occur during the video playback
return false;
}
});
14. setOnCompletionListener (MediaPlayer.OnCompletionListener): يسمح هذا المستمع باستدعاء طريقة رد الاتصال عند الوصول إلى نهاية الفيديو.
نعرض أدناه استخدام حدث setOnCompletionListener لعرض الفيديو.
VideoView simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView); // initiate a video view
// perform set on completion listener event on video view
simpleVideoView.setOnCompletionListener(new MediaPlayer.OnCompletionListener() {
@Override
public void onCompletion(MediaPlayer mp) {
// do something when the end of the video is reached
}
});
MediaController في VideoView
MediaController عبارة عن فئة تُستخدم لتوفير عناصر التحكم في تشغيل الفيديو. إذا تم تشغيل مقطع فيديو ببساطة باستخدام فئة VideoView ، فلن يتم منح المستخدم أي تحكم في تشغيل الفيديو الذي سيتم تشغيله حتى الوصول إلى نهاية الفيديو. يمكن معالجة هذه المشكلة عن طريق إرفاق مثيل لفئة MediaController بمثيل VideoView. ستوفر وحدة التحكم في الوسائط بعد ذلك مجموعة من عناصر التحكم التي تسمح للمستخدم بإدارة التشغيل (مثل البحث للخلف / للأمام والتوقف المؤقت في المخطط الزمني للفيديو).
طرق التحكم في الوسائط:
دعنا نناقش بعض الطرق المهمة لفئة MediaController التي قد يتم استدعاؤها من أجل التحكم في التشغيل.
1. setAnchorView ( View view): يتم استخدام setAnchorView لتعيين العرض الذي سيتم إرساء وحدة التحكم عليه. يتحكم هذا في موقع عناصر التحكم على الشاشة.
نوضح أدناه كيفية استخدام طريقة setanchorview () لفئة MediaController.
MediaController mediaController = new MediaController(this); // create an object of media controller mediaController.setAnchorView(simpleVideoView); // set anchor view for video view
2. show (): تستخدم هذه الطريقة لإظهار وحدة التحكم على الشاشة.
أدناه نعرض وحدة التحكم على الشاشة.
MediaController mediaController = new MediaController(this); // create an object of media controller mediaController.show(); // show the controller on the screen
3. show (int timeout): تُستخدم هذه الطريقة لضبط الوقت لإظهار وحدة التحكم على الشاشة.
أدناه قمنا بتعيين وقت إظهار وحدة التحكم على الشاشة.
MediaController mediaController = new MediaController(this); // create an object of media controller mediaController.show(500); // set the time to show the controller on the screen
4. hide (): تستخدم هذه الطريقة لإخفاء عناصر التحكم من الشاشة.
أدناه نخفي التحكم من الشاشة
MediaController mediaController = new MediaController(this); // create an object of media controller mediaController.hide(); // hide the control from the screen
5. isShowing (): تُرجع هذه الطريقة قيمة منطقية تشير إلى ما إذا كانت عناصر التحكم مرئية حاليًا للمستخدم أم لا.
أدناه نتحقق مما إذا كانت عناصر التحكم مرئية حاليًا أم لا.
MediaController mediaController = new MediaController(this); // create an object of media controller Boolean isShowing = mediaController.isShowing(); // checks whether the controls are currently visible or not
مثال VideoView في Android Studio :
يوجد أدناه مثال VideoView في Android حيث نقوم بتشغيل مقطع فيديو في عرض فيديو باستخدام Media Controller ونقوم بالتعيين على أحداث المستمع للخطأ والإكمال وعرض Toast عند اكتمال الفيديو أو حدوث خطأ أثناء تشغيل الفيديو.
في هذا المثال ، نقوم بإنشاء مجلد يسمى raw في مشروعنا وتخزين ملف الفيديو في هذا المجلد ثم تعيين uri للفيديو في نشاطنا الذي نعرض فيه عرض الفيديو.
فيما يلي الإخراج النهائي ، تنزيل الكود والشرح خطوة بخطوة:
الخطوة 1: قم بإنشاء مشروع جديد في Android Studio وقم بتسميته VideoViewExample
الخطوة 2: افتح res -> layout -> xml (or) main.xml وأضف الكود التالي:
في هذه الخطوة ، نفتح ملف xml ونضيف الكود لعرض VideoView في نشاطنا.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".MainActivity"> <VideoView android:id="@+id/simpleVideoView" android:layout_width="match_parent" android:layout_height="match_parent" /> </RelativeLayout>
الخطوة 3: افتح src -> package -> MainActivity. جافا
في هذه الخطوة نفتح MainActivity ونضيف الكود لبدء عرض الفيديو وإنشاء كائن MediaController للتحكم في تشغيل الفيديو.
في هذه الفئة ، قمنا أيضًا بتعيين uri للفيديو وقمنا بتعيين أحداث مستمع الخطأ والإكمال وعرض رسالة Toast عند اكتمال الفيديو أو حدوث خطأ أثناء تشغيل الفيديو.
تأكد أيضًا من إنشاء دليل جديد في مجلد res وقم بتسميته خام. حفظ اسم الفيديو fishvideo في مجلد خام. سنقوم بتعيين المسار لهذا الفيديو في طريقة setVideoURI ().
package example.abhiandroid.videoviewexample;
import android.app.Activity;
import android.app.ProgressDialog;
import android.content.res.Configuration;
import android.media.MediaPlayer;
import android.media.MediaPlayer.OnPreparedListener;
import android.net.Uri;
import android.os.Bundle;
import android.util.Log;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.MediaController;
import android.widget.Toast;
import android.widget.VideoView;
public class MainActivity extends Activity {
VideoView simpleVideoView;
MediaController mediaControls;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Find your VideoView in your video_main.xml layout
simpleVideoView = (VideoView) findViewById(R.id.simpleVideoView);
if (mediaControls == null) {
// create an object of media controller class
mediaControls = new MediaController(MainActivity.this);
mediaControls.setAnchorView(simpleVideoView);
}
// set the media controller for video view
simpleVideoView.setMediaController(mediaControls);
// set the uri for the video view
simpleVideoView.setVideoURI(Uri.parse("android.resource://" + getPackageName() + "/" + R.raw.fishvideo));
// start a video
simpleVideoView.start();
// implement on completion listener on video view
simpleVideoView.setOnCompletionListener(new MediaPlayer.OnCompletionListener() {
@Override
public void onCompletion(MediaPlayer mp) {
Toast.makeText(getApplicationContext(), "Thank You...!!!", Toast.LENGTH_LONG).show(); // display a toast when an video is completed
}
});
simpleVideoView.setOnErrorListener(new MediaPlayer.OnErrorListener() {
@Override
public boolean onError(MediaPlayer mp, int what, int extra) {
Toast.makeText(getApplicationContext(), "Oops An Error Occur While Playing Video...!!!", Toast.LENGTH_LONG).show(); // display a toast when an error is occured while playing an video
return false;
}
});
}
}
المخرجات :
الآن قم بتشغيل التطبيق وسترى تشغيل الفيديو أثناء فتح التطبيق. انقر فوق Video and Media Controller سيظهر على الشاشة.