Selamat datang di UNYDeveloperNetwork. Pada postingan ini kita akan belajar sedikit banyak bagaimana membuat aplikasi video streaming sederhana di Android. Ya, video streaming, seperti Youtube-lah, namun dalam versi yang paling sederhana. Sederhana di sini tidak hanya sebatas hanya memutar ya, namun juga dapat mengontrol media yang diputar secara streaming juga. Bagaimana cara membangunnya? Mari kita simak postingan berikut ini.
Sebelum kita bergerak lebih jauh, Anda pasti bertanya-tanya. Apa sih pentingnya membuat aplikasi video streaming di Android? Ya, jawaban untuk pertanyaan itu tentu kembali ke masing-masing individu ya, mungkin untuk project Anda, tiba-tiba memerlukan fitur video streaming? Atau Anda sedang menyelesaikan tugas akhir dan tiba-tiba memerlukan fitur video streaming? Atau professor Anda meminta Anda untuk membuat aplikasi video streaming? Siapa yang tahu bukan? Oleh karena itu, di dalam postingan ini, Saya ingin berbagi dengan Anda bagaimana membuat aplikasi video streaming sederhana di Android. Kata kuncinya di sini adalah sederhana. OK? Jadi tidak ada fitur yang aneh aneh seperti Youtube ads dan lain sebagainya.
Ok, kira-kira bagaimana hasil akhir dari project kita ini nanti? Mari kita saksikan video hasil akhir dari project ini.
Menarik bukan? Mudah kok untuk membuatnya, tidak memerlukan library yang aneh-aneh dan hanya terdiri dari dua activity saja. Bahkan sebenarnya jika mau dipaksakan, bisa juga dengan menggunakan satu activity saja. Bagaimana cara membangunnya? Mari kita mulai: membangun aplikasi video streaming Android sederhana.
1. Membuat Project Baru
Ya tentu saja, ini langkah paling dasar. Iya kan? Buatlah sebuah project baru dengan nama SimpleVideoStreamer. Anda tentu saja boleh menggunakan nama yang lain. Untuk activity, pilihlah Empty Activity
Untuk bahasa yang digunakan, pilih Java, OK? No comment dulu ya. Mengapa Java, tidak Kotlin. Bukan saya anti dengan Kotlin, tetapi karena memang basic saya adalah programmer Java jadi saya prefer untuk menggunakan bahasa Pemrograman Java. OK? Hehehe. Untuk minimum SDK pada project ini menggunakan API 30 (Android 11).
2. Konfigurasi Manifest
Langkah selanjutnya adalah mengonfigurasi manifest agar kita dapat melakukan stream video dari internet. Pertama tambahkan uses-permission internet
<uses-permission android:name="android.permission.INTERNET" />Selanjutnya tambahkan parameter berikut pada tag <application> untuk memastikan aplikasi kita dapat melakukan stream dari server non HTTPS
android:usesCleartextTraffic="true"Perubahan sementara di manifest kita adalah seperti kode di bawah ini.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:allowBackup="true"
android:dataExtractionRules="@xml/data_extraction_rules"
android:fullBackupContent="@xml/backup_rules"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/Theme.SimpleVideoStreamer"
android:usesCleartextTraffic="true"
tools:targetApi="31">3. Tambahkan value pada strings.xml
Ya, kita akan menambahkan beberapa string untuk mendukung beberapa view yang akan kita buat dalam project kali ini. Berikut adalah list string yang dibuat untuk project ini.
<resources>
<string name="app_name">SimpleVideoStreamer</string>
<string name="input_label">URL Input</string>
<string name="input_hint">Enter your video URL here...</string>
<string name="btn_label_start">Start Stream</string>
<string name="btn_label_reset">Clear URL Input</string>
</resources>4. Layout MainActivity
Berikut adalah layout dari activity_main.xml (MainActivity.java)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
android:layout_margin="20dp"
tools:context=".MainActivity">
<TextView
android:id="@+id/label_input"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/input_label"
android:textSize="20sp" />
<EditText
android:id="@+id/input_url"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/label_input"
android:layout_marginTop="3dp"
android:ems="10"
android:hint="@string/input_hint"
android:importantForAutofill="no"
android:inputType="textUri"
android:minHeight="48dp"
android:textColorHint="#757575" />
<Button
android:id="@+id/start_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/input_url"
android:backgroundTint="@color/teal_700"
android:text="@string/btn_label_start"
tools:ignore="TextContrastCheck" />
<Button
android:id="@+id/reset_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/input_url"
android:layout_marginStart="10dp"
android:layout_toEndOf="@+id/start_button"
android:text="@string/btn_label_reset" />
</RelativeLayout>
5. Layout VideoPlayer
Selanjutnya, buat activity baru sebagai player dari video kita. Activity baru ini kita beri nama VideoPlayer (VideoPlayer.java; activity_video_player.xml). Setelah Activity baru terbentuk, buatlah layout yang khusus hanya berisi View VideoView
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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=".VideoPlayer">
<VideoView
android:id="@+id/video_player"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"/>
</RelativeLayout>6. Konfigurasi Ulang Manifest
Kita perlu mengonfigurasi ulang manifest untuk memastikan behavior aplikasi ini baik. Konfigurasi yang kita lakukan adalah pada aspek screen orientation dan parent activity. Berikut adalah final dari manifest project kita
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:allowBackup="true"
android:dataExtractionRules="@xml/data_extraction_rules"
android:fullBackupContent="@xml/backup_rules"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/Theme.SimpleVideoStreamer"
android:usesCleartextTraffic="true"
tools:targetApi="31">
<activity
android:name=".VideoPlayer"
android:parentActivityName=".MainActivity"
android:screenOrientation="landscape"
android:exported="false">
<meta-data
android:name="android.app.lib_name"
android:value="" />
</activity>
<activity
android:name=".MainActivity"
android:exported="true"
android:screenOrientation="portrait">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
<meta-data
android:name="android.app.lib_name"
android:value="" />
</activity>
</application>
</manifest>7. Class: VideoPlayer.java
Selanjutnya kita akan membuat logika pemrograman untuk video player. Mengapa kita mendahulukan activity video player daripada main activity nya? Karena activity inilah yang merupakan core dari project ini. Memutar video dengan sourcenya adalah berupa URI; yang mana secara otomatis akan melakukan stream ke URI yang telah diatur. Berikut adalah kodingannya.
package com.unydevelopernetwork.simplevideostreamer;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.PixelFormat;
import android.net.Uri;
import android.os.Bundle;
import android.widget.MediaController;
import android.widget.VideoView;
import com.google.android.material.snackbar.Snackbar;
public class VideoPlayer extends AppCompatActivity {
private VideoView videoPlayer;
private String videoURL;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_video_player);
initLevel0();
initLevel1();
initLevel2();
}
private void initLevel0(){
videoPlayer = findViewById(R.id.video_player);
}
private void initLevel1(){
videoURL = getIntent().getStringExtra("VIDEO_URL");
}
private void initLevel2(){
videoPlayer();
}
private void videoPlayer(){
Snackbar.make(findViewById(android.R.id.content), "Video Buffering...", Snackbar.LENGTH_LONG).show();
try {
getWindow().setFormat(PixelFormat.TRANSLUCENT);
MediaController mediaController = new MediaController(this);
mediaController.setAnchorView(videoPlayer);
Uri video = Uri.parse(videoURL);
videoPlayer.setMediaController(mediaController);
videoPlayer.setVideoURI(video);
videoPlayer.requestFocus();
videoPlayer.setOnPreparedListener(mp -> videoPlayer.start());
}
catch(Exception e) {
Snackbar.make(findViewById(android.R.id.content), "Video Play Error:" + e, Snackbar.LENGTH_LONG).show();
finish();
}
}
}8. Class: MainActivity.java
Terakhir kita membuat logika pemrograman untuk main activity nya. Secara sederhana di kelas main activity terdapat tiga aksi:
a. Menangkap Inputan dari User
b. Memulai activity video player dengan parameter URI berasal dari inputan user
c. Mereset inputan dari user
Berikut adalah kodingannya:
package com.unydevelopernetwork.simplevideostreamer;
import androidx.appcompat.app.AppCompatActivity;
import android.annotation.SuppressLint;
import android.content.Intent;
import android.os.Bundle;
import android.widget.Button;
import android.widget.EditText;
public class MainActivity extends AppCompatActivity {
private EditText inputURL;
private Button btnStartStream, btnReset;
private String videoURL;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initLevel0();
initLevel1();
initLevel2();
}
private void initLevel0(){
inputURL = findViewById(R.id.input_url);
btnStartStream = findViewById(R.id.start_button);
btnReset = findViewById(R.id.reset_button);
}
@SuppressLint("ClickableViewAccessibility")
private void initLevel1(){
btnStartStream.setOnTouchListener((view, motionEvent) -> {
getInput();
startStream();
return false;
});
}
@SuppressLint("ClickableViewAccessibility")
private void initLevel2(){
btnReset.setOnTouchListener((view, motionEvent) -> {
resetInput();
return false;
});
}
private void getInput(){
videoURL = inputURL.getText()+"";
}
private void startStream(){
Intent streamIntent = new Intent(MainActivity.this, VideoPlayer.class);
streamIntent.putExtra("VIDEO_URL", videoURL);
startActivity(streamIntent);
}
private void resetInput(){
inputURL.getText().clear();
}
}9. Testing
Untuk testing pada project kali ini, saya menggunakan device (bukan AVD) Google Pixel 3A XL. Sedangkan untuk Video test menggunakan URL berikut ini:
https://cdn.unydevelopernetwork.com/unydevelopernetwork/ex_video_stream_android.mp4Berikut adalah hasil testingnya:
Bagaimana? cukup mudah bukan? Saya rasa project ini masih cukup mudah. Selanjutnya mungkin kita akan bermain-main dengan file-file video yang tersimpan di Android kita. Yep bisa ditebak, kita membuat video player sederhana, seperti VLC atau Video player yang lain, namun yang sederhana saja. Tapi, kita simpan hal ini untuk project yang lain ya? ^_^
Anda dapat mengunduh project ini secara lengkap melalui tautan berikut ini:
Github: Simple Video Streaming
Baiklah, demikian postingan saya tentang Membuat Aplikasi Video Streaming Android Sederhana. Semoga bermanfaat bagi Anda para pembaca. Apabila ada pertanyaan mengenai postingan ini, Anda dapat meninggalkannya di kolom komentar. Dan, Apabila Anda menemukan artikel ini berguna, Anda dapat membagikannya. Anda juga dapat mencuplik beberapa bagian dari artikel ini, namun jangan lupa untuk sertakan URL nya. Terima kasih.