Example of Exoplayer ,with ProgressBar on top of the video when any error will come. Following are the steps:-
1. Open Android Studio and create a new project and open layout main_activity.xml and write following code:-
To customise the video control we have to add two xml with the same name in our layout folder like following:-
app - res - layout here add the file .
1. exo_playback_control_view.xml
Code will be like:-
2. exo_simple_player_view.xml
Code will be like:-
1. Open Android Studio and create a new project and open layout main_activity.xml and write following code:-
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"> <TextView
android:id="@+id/tvWatchVideo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Watch Video"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" /> </android.support.constraint.ConstraintLayout>2. Open MainActivity.java and write following code:-
public class MainActivity extends AppCompatActivity { private TextView tvWatchVideo;
protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); tvWatchVideo = (TextView)findViewById(R.id.tvWatchVideo); tvWatchVideo.setOnClickListener(new View.OnClickListener() {
public void onClick(View view) { startActivity(new Intent(MainActivity.this,VideoPlayActivity.class)); } }); } }3. Open app gradle and add exo player library like following:-
dependencies {
// exo player
implementation 'com.google.android.exoplayer:exoplayer:2.7.0' }4. Create a separate class with any name i am giving VideoPlayActivity.java code will be following:-
public class VideoPlayActivity extends AppCompatActivity { String videoURL = "http://blueappsoftware.in/layout_design_android_blog.mp4"; private SimpleExoPlayerView simpleExoPlayerView; private SimpleExoPlayer exoPlayer; private ProgressBar progressBar; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.videoplay_activity); exoPlayerControl(); } private void exoPlayerControl() { simpleExoPlayerView = (SimpleExoPlayerView)findViewById(R.id.exoPlayerview); progressBar = (ProgressBar) findViewById(R.id.progress_bar); try { BandwidthMeter bandwidthMeter = new DefaultBandwidthMeter(); TrackSelector trackSelector = new DefaultTrackSelector(new AdaptiveTrackSelection.Factory(bandwidthMeter)); exoPlayer = ExoPlayerFactory.newSimpleInstance(this, trackSelector); Uri videoUrl = Uri.parse(videoURL); DefaultHttpDataSourceFactory defaultHttpDataSource = new DefaultHttpDataSourceFactory("exoplayer"); ExtractorsFactory factory = new DefaultExtractorsFactory(); MediaSource mediaSource = new ExtractorMediaSource(videoUrl,defaultHttpDataSource,factory,null,null); simpleExoPlayerView.setPlayer(exoPlayer); exoPlayer.prepare(mediaSource); exoPlayer.setPlayWhenReady(true); }catch (Exception e){ e.printStackTrace(); } exoPlayer.addListener(new ExoPlayer.EventListener() { public void onTimelineChanged(Timeline timeline, Object manifest, int reason) { }
public void onTracksChanged(TrackGroupArray trackGroups, TrackSelectionArray trackSelections) { }
public void onLoadingChanged(boolean isLoading) { }
public void onPlayerStateChanged(boolean playWhenReady, int playbackState) { if (playbackState == ExoPlayer.STATE_BUFFERING){ progressBar.setVisibility(View.VISIBLE); } else { progressBar.setVisibility(View.INVISIBLE); } }
public void onRepeatModeChanged(int repeatMode) { }
public void onShuffleModeEnabledChanged(boolean shuffleModeEnabled) { }
public void onPlayerError(ExoPlaybackException error) { progressBar.setVisibility(View.VISIBLE); exoPlayer.stop(); exoPlayer.setPlayWhenReady(true); }
public void onPositionDiscontinuity(int reason) { }
public void onPlaybackParametersChanged(PlaybackParameters playbackParameters) {
}
public void onSeekProcessed() {
}
});
}
}
5. videoplay_activity.xml will be looks like following:--<?xml version="1.0" encoding="utf-8"?><RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"> <com.google.android.exoplayer2.ui.SimpleExoPlayerView
android:layout_width="match_parent"
android:id="@+id/exoPlayerview"
android:layout_height="match_parent"> </com.google.android.exoplayer2.ui.SimpleExoPlayerView> <ProgressBar
android:id="@+id/progress_bar"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_centerInParent="true"
android:visibility="visible"
android:layout_gravity="center"/> </RelativeLayout>6. Output wil be:-
To customise the video control we have to add two xml with the same name in our layout folder like following:-
app - res - layout here add the file .
1. exo_playback_control_view.xml
Code will be like:-
<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (C) 2016 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layoutDirection="ltr"
android:background="#CC000000"
android:orientation="vertical"> <LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingTop="4dp"
android:orientation="horizontal"> <ImageButton android:id="@id/exo_prev"
style="@style/ExoMediaButton.Previous"/> <ImageButton android:id="@id/exo_rew"
style="@style/ExoMediaButton.Rewind"/> <ImageButton android:id="@id/exo_shuffle"
style="@style/ExoMediaButton.Shuffle"/> <ImageButton android:id="@id/exo_repeat_toggle"
style="@style/ExoMediaButton"/> <ImageButton android:id="@id/exo_play"
style="@style/ExoMediaButton.Play"/> <ImageButton android:id="@id/exo_pause"
style="@style/ExoMediaButton.Pause"/> <ImageButton android:id="@id/exo_ffwd"
style="@style/ExoMediaButton.FastForward"/> <ImageButton android:id="@id/exo_next"
style="@style/ExoMediaButton.Next"/> </LinearLayout> <LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:gravity="center_vertical"
android:orientation="horizontal"> <TextView android:id="@id/exo_position"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14sp"
android:textStyle="bold"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:includeFontPadding="false"
android:textColor="#FFBEBEBE"/> <com.google.android.exoplayer2.ui.DefaultTimeBar
android:id="@id/exo_progress"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="26dp"/> <TextView android:id="@id/exo_duration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14sp"
android:textStyle="bold"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:includeFontPadding="false"
android:textColor="#FFBEBEBE"/> </LinearLayout> </LinearLayout>
2. exo_simple_player_view.xml
Code will be like:-
<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (C) 2016 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.-->
<merge xmlns:android="http://schemas.android.com/apk/res/android"> <com.google.android.exoplayer2.ui.AspectRatioFrameLayout
android:id="@id/exo_content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"> <!-- Video surface will be inserted as the first child of the content frame. --> <View
android:id="@id/exo_shutter"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/black" /> <ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY" /> <com.google.android.exoplayer2.ui.SubtitleView
android:id="@id/exo_subtitles"
android:layout_width="match_parent"
android:layout_height="match_parent" /> <ProgressBar
android:id="@+id/exo_buffering"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminate="true" /> <TextView
android:id="@+id/exo_error_message"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:padding="16dp" /> </com.google.android.exoplayer2.ui.AspectRatioFrameLayout> <FrameLayout
android:id="@id/exo_overlay"
android:layout_width="match_parent"
android:layout_height="match_parent" /> <View
android:id="@id/exo_controller_placeholder"
android:layout_width="match_parent"
android:layout_height="match_parent" /> </merge>
