Open In App

Eye Detecting Video Player in Android

Improve
Improve
Like Article
Like
Save
Share
Report

In this article, we are going to learn that how we can make an eye detecting video player and use third-party libraries in our android application. If you are a beginner in android development then by making this application you will boost your confidence and learn some interesting and new.

What we are going to build in this article? 

In this application, we are going to use a library named “LookAtMe” and then put a video in our application. If the user’s eye is in the camera’s range then the video will continue to play but if the eyes are not in the range of the camera then immediately the video will stop. If the user’s eyes again come in a range of the camera then the video will resume from where it was paused. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Java language. 

Eye Detecting Video Player in Android Sample GIF

So, let us see the step-by-step implementation of this application.

Step by Step Implementation

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.

Step 2: Add dependency and JitPack Repository

Navigate to the Gradle Scripts > build.gradle(Module:app) and add the below dependency in the dependencies section.   

implementation ‘com.github.Pradyuman7:LookAtMe:Version2.0’

Add the JitPack repository to your build file. Add it to your root build.gradle at the end of repositories inside the allprojects{ } section.

allprojects {

 repositories {

   …

   maven { url “https://jitpack.io” }

     }

}

After adding this dependency sync your project and now we will move towards its implementation.  

Step 3: Go to “res” and create a new android resource directory and name it as raw. This file is made to paste the offline video we want to play in our application(for online videos no need to create it we can provide the link of the video in java code which we will see ahead).

Refer to the article: Resource Raw Folder in Android Studio

Step 4: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. 

<com.pd.lookatme.LookAtMe
    android:id="@+id/lookme"
    android:layout_width="match_parent"
    android:layout_height="250dp" />

Below is the code for the activity_main.xml file. 

XML




<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
  
    <com.pd.lookatme.LookAtMe
        android:id="@+id/lookme"
        android:layout_width="443dp"
        android:layout_height="400dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.577" />
  
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Eye Detecting Video Player"
        android:textColor="#0B0000"
        android:textSize="30sp"
        app:layout_constraintBottom_toTopOf="@+id/lookme"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.703"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0" />
  
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="154dp"
        android:layout_height="118dp"
        app:layout_constraintBottom_toTopOf="@+id/textView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0"
        app:srcCompat="@drawable/gfgimage" />
      
</androidx.constraintlayout.widget.ConstraintLayout>


Step 5: Working with the MainActivity.java file

Go to the MainActivity.java file and refer to the following code. We have to use the following piece of code in our java file.

private LookAtMe lookAtMe;
lookAtMe = findViewById(R.id.lookme);
lookAtMe.init(this);
lookAtMe.setVideoURI(Uri.parse("android.resource://" + getPackageName() + "/" + R.raw.videoplayback));

// to use video from a url
lookAtMe.setVideoPath("http://website.com/video/mp4/62000/62792m.mp4"); 
       
lookAtMe.start();
lookAtMe.setLookMe();

Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.

Java




import android.os.Bundle;
  
import androidx.appcompat.app.AppCompatActivity;
  
import com.pd.lookatme.LookAtMe;
  
public class MainActivity extends AppCompatActivity {
      
    private LookAtMe lookAtMe;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        getSupportActionBar().hide();
        lookAtMe = findViewById(R.id.lookme);
        lookAtMe.init(this);
          
        // This line of code is used for offline videos which we pasted in our raw file.
        // lookAtMe.setVideoURI(Uri.parse("android.resource://" + getPackageName() + "/" + R.raw.gfg_eye_detecting));
          
        // This code is used for online videos along with their url
        // to use video from a url
  
        lookAtMe.start();
        lookAtMe.setLookMe();
  
    }
}


Note: You can play both online and offline videos in this application. For playing the offline video you have to paste it in the raw folder and then give its name in code as here mentioned “gfg_eye_detectig” but if you want to play the online video then you have to give it Url of the video in the code mentioned above.

Step 6: Working with the AndroidManifest.xml file

One last thing. If you are using an online video in your app then don’t forget to grant internet permission in your manifest file

<uses-permission android:name=”android.permission.INTERNET”/>

Output:

So, we are all done with our code and other steps, and it’s time to see the output. In the video below you will see that when I see towards mobile phone the video is running but when I stop seeing it the video is paused automatically and resumes only when the camera is able to detect eyes.

Hence, we made an eye detecting video player app using “LookAtMe” library and got a basic feel that how to use this library. You can use this basic knowledge to create your own applications and explore Android development more and more.



Last Updated : 23 May, 2021
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads