how to put circular progress bar in action bar?

Question

i have a play button in my action bar and i want that when i click on play button then the waiting time that it will take to connect to my live stream it will show the circular progress bar and when it connects with stream them pause and play button will appear.like following image

here is my code that i use

action_bar_progress.xml
    <?xml version="1.0" encoding="utf-8"?>
   <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    style="@android:style/Widget.ActionButton">
<ProgressBar
    android:id="@+id/actionProgressBar"
    android:layout_width="32dp"
    android:layout_height="32dp"
    android:visibility="visible"
    android:layout_gravity="center" />
</FrameLayout>

Menu.xml class

enter code here
         <?xml version="1.0" encoding="utf-8"?>
 <menu xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res-auto">
   <item
    android:title="play"
    android:icon="@drawable/ic_play_arrow_black_24dp"
    android:id="@+id/actionPlay"
    app:showAsAction="always"/>
<item
    android:title="pause"
    android:icon="@drawable/ic_pause_black_24dp"
    android:id="@+id/actionPause"
    app:showAsAction="always"
    android:visible="false"/>
<item
    android:title="stop"
    android:icon="@drawable/ic_stop_black_24dp"
    android:id="@+id/actionStop"
    app:showAsAction="always"
    android:visible="false"/>
<item
    android:id="@+id/action_working"
    android:actionLayout="@layout/action_bar_progress"
    app:showAsAction="always"
    android:title="@string/loadingActionBar"
    />

MainActivity.java

     @Override
public boolean onPrepareOptionsMenu(Menu menu) {
    mnuPlay = menu.findItem(R.id.actionPlay);
    mnuStop=menu.findItem(R.id.actionStop);
    mnuPause=menu.findItem(R.id.actionPause);
    mnuProgressBar = menu.findItem(R.id.action_working);


    if(bConnected){
        if(mediaPlayer.isPlaying()){
            mnuPlay.setVisible(false);
            mnuPause.setVisible(true);
            mnuStop.setVisible(true);
            mnuProgressBar.setVisible(false);
        }else {
            if (bShouldPlay) {
                mnuPlay.setVisible(false);
                mnuPause.setVisible(false);
                mnuStop.setVisible(false);
                mnuProgressBar.setVisible(true);
            }else{
                mnuPlay.setVisible(true);
                mnuPause.setVisible(false);
                mnuStop.setVisible(false);
                mnuProgressBar.setVisible(false);
            }
        }
    }else{
        mnuPlay.setVisible(true);
        mnuPause.setVisible(false);
        mnuStop.setVisible(false);
        mnuProgressBar.setVisible(false);
    }

    return super.onPrepareOptionsMenu(menu);
}
//Menu  Item  function start
@Override
public boolean onOptionsItemSelected(MenuItem item) {


    switch (item.getItemId())
    {
        case R.id.actionPlay:
            if (bConnected)
            {
                mediaPlayer.start();
                mnuPlay.setVisible(false);
                mnuProgressBar.setVisible(false);
                mnuPause.setVisible(true);
                mnuStop.setVisible(true);
                Toast.makeText(getBaseContext(), "Playing...", Toast.LENGTH_LONG).show();

            }
            else
            {
                mnuPlay.setVisible(false);
                mnuPause.setVisible(false);
                mnuStop.setVisible(false);
                bShouldPlay = true;
                getMedia();
                mnuProgressBar.setVisible(true);
                //Toast.makeText(getBaseContext(), "Still connecting...", Toast.LENGTH_LONG).show();
            }

            break;

        case R.id.actionPause:
            //bPaused=true;
            if (mediaPlayer.isPlaying())
            {
                mediaPlayer.pause();
                bPaused=true;
                mnuPause.setVisible(false);
                mnuPlay.setVisible(true);
                mnuStop.setVisible(true);
                mnuProgressBar.setVisible(false);
                Toast.makeText(MainActivity.this, "Paused!", Toast.LENGTH_SHORT).show();
            }
            break;

        case R.id.actionStop:
            if (mediaPlayer.isPlaying() || bPaused)
            {
                Toast.makeText(this, "Stopping...", Toast.LENGTH_LONG).show();

                mediaPlayer.stop();
                mediaPlayer.release();
                bConnected = false;
                bPaused=false;
                bShouldPlay = false;
                mnuPlay.setVisible(true);
                mnuPause.setVisible(false);
                mnuStop.setVisible(false);
                mnuProgressBar.setVisible(false);

                Toast.makeText(this, "Stopped!", Toast.LENGTH_LONG).show();

            }
            break;
        default:
            break;
    }
    return super.onOptionsItemSelected(item);
}

when i click on play button then it show the text what i have written in title ..i need the circular progress bar instead of that text and one more thing how to set the error messages.for example if stream is not available means goes offline then how after few minute of connecting it will show message to user the stream is not available..

Answer 1

You can do it using a progress bar inside Toolbar. Toolbar is just a ViewGroup:

 <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_main"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="#2196F3"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        android:orientation="horizontal">

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".70"
            android:gravity="center"
            android:orientation="horizontal"
            android:text="left">

            <TextView
                android:id="@+id/toolbar_title"
                style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="Tital"
                android:textColor="@color/white"
                android:textSize="20dp"
                android:textStyle="bold" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_weight=".30"
            android:text="right">

            <ProgressBar
                android:id="@+id/actionProgressBar"
                android:layout_width="32dp"
                android:layout_height="32dp"
                android:layout_gravity="center"
                android:visibility="visible" />
        </LinearLayout>
    </LinearLayout>
</android.support.v7.widget.Toolbar>