Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Android dialog with Action Bar using Tool Bar

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 4.69k
    Comment on it

    Android Toolbar widget is the new UI android components available in AppCompt v21. It works just like action bar. It can be used as action bar in a dialog with support from API 7 onwards . This tutorial helps to create a toolbar in android dialog display. Use the following steps to complete this task.

    Step -1 You have to put AppCompat dependencies in build.gradle(app)

    compile 'com.android.support:appcompat-v7:22.1.0'
    

    Step-2 Now you need to include Android Tool Bar layout in your custom dialog layout in xml.

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
        <android.support.v7.widget.Toolbar
            android:id="@+id/my_toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:background="?attr/colorPrimary"
            android:minHeight="?attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
    
        <TextView
            android:id="@+id/text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/my_toolbar"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="50dp"
            android:layout_marginTop="50dp"/>
    
    </RelativeLayout>
    

    Step-3 Create a class ActionBarDialog which extends DialogFragment class.

    import android.app.Dialog;
    import android.app.DialogFragment;
    import android.os.Bundle;
    import android.support.v7.widget.Toolbar;
    import android.view.LayoutInflater;
    import android.view.MenuItem;
    import android.view.View;
    import android.view.ViewGroup;
    import android.view.Window;
    import android.widget.TextView;
    
    /**
     * Created by arvindkumar on 3/6/15.
     */
    public class ActionBarDialog extends DialogFragment {
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
            Bundle args = getArguments();
            String title = args.getString("title");
            View v = inflater.inflate(R.layout.action_bar_dialog, container, false);
            TextView tv = (TextView) v.findViewById(R.id.text);
            tv.setText("This is an instance of ActionBarDialog");
            Toolbar toolbar = (Toolbar) v.findViewById(R.id.my_toolbar);
            toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
                @Override
                public boolean onMenuItemClick(MenuItem item) {
                    // Handle the menu item
                    return true;
                }
            });
            toolbar.inflateMenu(R.menu.menu_main);
            toolbar.setTitle(title);
            return v;
        }
    
        @Override
        public Dialog onCreateDialog(Bundle savedInstanceState) {
            Dialog dialog = super.onCreateDialog(savedInstanceState);
            // request a window without the title
            dialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);
            return dialog;
        }
    }
    

    Step-4 Need a specified theme

    <!-- Base application theme. -->
        <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
            <!-- Customize your theme here. -->
            <!--   your app branding color for the app bar -->
            <item name="colorPrimary">#ff19b525</item>
            <!--   darker variant for the status bar and contextual app bars -->
            <item name="colorPrimaryDark">#ff189f1f</item>
            <!--   theme UI controls like checkboxes and text fields -->
            <item name="colorAccent">#ff2fff2b</item>
        </style>
    

    Step-5 Our activity don't have action bar so we will use action bar. We need to define a tool bar in this layout

    <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=".MainActivity">
    
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:background="?attr/colorPrimary"
            android:elevation="8dp"
            android:minHeight="?attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
    

    Step-6 Now lets create a main activity

    import android.os.Bundle;
    import android.support.v7.app.ActionBarActivity;
    import android.support.v7.widget.Toolbar;
    import android.view.Menu;
    import android.view.MenuItem;
    
    
    public class MainActivity extends ActionBarActivity {
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
            setSupportActionBar(toolbar);
    
            Bundle args = new Bundle();
            args.putString("title", "Dialog with Action Bar");
            ActionBarDialog actionbarDialog = new ActionBarDialog();
            actionbarDialog.setArguments(args);
            actionbarDialog.show(getFragmentManager(),"ACTION BAR DIALOG");
        }
    
        @Override
        public boolean onCreateOptionsMenu(Menu menu) {
            getMenuInflater().inflate(R.menu.menu_main, menu);
            return true;
        }
    
        @Override
        public boolean onOptionsItemSelected(MenuItem item) {
            int id = item.getItemId();
            if (id == R.id.action_settings) {
                return true;
            }
            return super.onOptionsItemSelected(item);
        }
    }
    

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: