Music Player app in android studio latest using java

music player app

In this video, we will create a Music Player App in android studio with the help of java programming language.

We will use MediaPlayer class to handle audio playback. SeekBar to update values while playing music.

Also, we will be using volume control to increase or decrease the volume in our music player app. All this with good looking UI design in android studio latest version 4.1.1.

Here I have provided the full source code below so that you can try and practice in your android studio platform.

Activity_main.xml File

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Music Player"
    android:textSize="25dp"
    android:textColor="#800000"/>

<ImageView
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:src="@drawable/music"
    android:layout_marginVertical="12dp"/>

<SeekBar
    android:id="@+id/seekBarPosition"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:progress="50"
    android:layout_marginVertical="12dp"/>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/elapsedTimeView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0.10"
        android:textStyle="bold"
        android:textSize="20sp"
        android:layout_marginLeft="10dp"/>

    <TextView
        android:id="@+id/remainingTimeView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0.10"
        android:textStyle="bold"
        android:textSize="20sp"
        android:layout_marginLeft="240dp"/>

</LinearLayout>

<Button
    android:id="@+id/btnPlay"
    android:layout_width="40dp"
    android:layout_height="40dp"
    android:background="@drawable/play"
    android:layout_marginTop="30dp"
    android:onClick="btnPlayAction"/>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_marginTop="20dp"
    android:gravity="center">

<ImageView
    android:layout_width="20dp"
    android:layout_height="20dp"
    android:src="@drawable/sound"/>

<SeekBar
    android:id="@+id/volumeBar"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:progress="50"
    android:max="100"/>

    <ImageView
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:src="@drawable/sound2"/>

</LinearLayout>

MainActivity.java File

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.media.MediaPlayer;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.View;
import android.widget.Button;
import android.widget.SeekBar;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    Button btnPlay;
    SeekBar seekBarPosition;
    SeekBar volumeBar;
    TextView elapsedTimeView;
    TextView remainingTimeView;
    MediaPlayer mediaPlayer;
    int totalTime;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        btnPlay = findViewById(R.id.btnPlay);
        elapsedTimeView = findViewById(R.id.elapsedTimeView);
        remainingTimeView = findViewById(R.id.remainingTimeView);

        // Media Player
        mediaPlayer = MediaPlayer.create(this, R.raw.mymusic);
        mediaPlayer.setLooping(true);
        mediaPlayer.seekTo(0);
        mediaPlayer.setVolume(0.5f, 0.5f);
        totalTime = mediaPlayer.getDuration();

        //Position Bar
        seekBarPosition = findViewById(R.id.seekBarPosition);
        seekBarPosition.setMax(totalTime);
        seekBarPosition.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean user) {
                if(user){
                    mediaPlayer.seekTo(progress);
                    seekBarPosition.setProgress(progress);

                }
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {

            }
        });


        //Volume Bar
        volumeBar = findViewById(R.id.volumeBar);
        volumeBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean user) {
                float numVolume = progress / 100f;
                mediaPlayer.setVolume(numVolume, numVolume);

            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {

            }
        });

        // Create Thread to update position and time view

        new Thread(new Runnable() {
            @Override
            public void run() {
                while(mediaPlayer != null){
                    try{
                        Message msg = new Message();
                        msg.what = mediaPlayer.getCurrentPosition();
                        handler.sendMessage(msg);
                        Thread.sleep(1000);

                    }catch (InterruptedException e){}
                }
            }
        }).start();

    }

        private Handler handler = new Handler(){

            @Override
            public void handleMessage(@NonNull Message msg) {
               int currentPosition = msg.what;
               // Update SeekBar Position
               seekBarPosition.setProgress(currentPosition);

               // Update TimeView
                String elapsedTime = createTimeView(currentPosition);
                elapsedTimeView.setText(elapsedTime);

                String remainingTime = createTimeView(totalTime-currentPosition);
                remainingTimeView.setText("- " + remainingTime);


            }
        };

    public String createTimeView(int time){

        String timeView = "";
        int min =  time / 1000 / 60;
        int sec = time / 1000 % 60;

        timeView = min + ":";
        if(sec < 10) timeView += "0";
        timeView += sec;

        return  timeView;
    }

        public void btnPlayAction(View view){

        if(!mediaPlayer.isPlaying()){
            //Stop Music
            mediaPlayer.start();
            btnPlay.setBackgroundResource(R.drawable.stop);
        }else{
            // Play Music
            mediaPlayer.pause();
            btnPlay.setBackgroundResource(R.drawable.play);
            
        }
    }
}

You can watch this full video tutorial and try it yourself in your android studio:

Sharing Is Caring:

I'm a Computer Science graduate. I'm passionate about blogging and I owned codewithap.com to share some of my interests with other people.

Leave a Comment