Skip to content

How to use DialogFragment

thaoln87 edited this page May 16, 2017 · 1 revision

DialogFragment usage

  • Create a class DialogFragmentPassingData is extended by DialogFragment
public class DialogFragmentPassingData extends DialogFragment{
}
  • DialogFragment actually comes with two ways of setting UI: Standard dialog and custom view dialog

Standard Dialog

There is a AlertDialog in our DialogFragment. We have to override onCreateDialog().

public class DialogFragmentPassingData extends DialogFragment{
    //...
  @Override 
  public Dialog onCreateDialog(Bundle savedInstanceState) {        
    // Create AlertDialog
    // ...
    return dialog;       
}

AlertDialog

  • Instantiate an AlertDialog.Builder with its constructor
    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
  • Chain together various setter methods to set the dialog characteristics: message and title
    builder.setMessage(R.string.dialog_message).setTitle(R.string.dialog_title);
  • Create AlertDialog from Builder
    AlertDialog dialog = builder.create();

AlertDialog

Custom View Dialog

Create a dialog custom layout

An example fragment XML file in res/layout/dialog_fragment_passing_data.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/edit_name"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:orientation="vertical"  >
    <TextView
        android:id="@+id/lbl_your_name"
        android:text="Your name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <EditText
        android:id="@+id/txt_your_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="text"
        android:imeOptions="actionDone" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btnDone"
        android:text="Done"/>

</LinearLayout>

Override onCreateView(...) method.

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        return inflater.inflate(R.layout.dialog_fragment_passing_data, container);
    }
}

Showing the dialog in an Activity extending AppCompatActivity

public class MainActivity extends AppCompatActivity {
    //...
    private void showEditDialog() {
        FragmentManager fm = getSupportFragmentManager();
        DialogFragmentPassingData editNameDialogFragment = DialogFragmentPassingData.newInstance(mName.getText().toString());
        editNameDialogFragment.show(fm, "fragment_edit_name");
    }
}

Passing Data

Passing Data from Activity to Fragment

  • From Activity, sending data with Bundle as
        DialogFragmentPassingData frag = new DialogFragmentPassingData();
        Bundle args = new Bundle();
        args.putString("title", title);
        frag.setArguments(args);
  • In Fragment, we have to
    • Override onCreateView method
    • Get data from Bundle through getArguments method
    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        //...
        // Fetch arguments from bundle and set title
        String title = getArguments().getString("title", "Enter Name");
        getDialog().setTitle(title);
    }

Passing Data from Fragment to Activity

  • Define a Listener that can be invoked to pass data result to the activity
public interface PassingDataListener {
    void onFinishEditDialog(String inputText);
}
  • Setup a view event which invokes the custom listener passing data through the method
public class DialogFragmentPassingData extends DialogFragment {
     ...
    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        ....
        btnDone.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                PassingDataListener listener = (PassingDataListener) getActivity();
                listener.onFinishEditDialog(etName.getText().toString());
                dismiss();
            }
        });
    }
}
  • Implement the interface in the Activity defining behavior for when the event is triggered
public class MainActivity extends AppCompatActivity implements PassingDataListener {
    ...
    @Override
    public void onFinishEditDialog(String inputText) {
        mName.setText(inputText);
    }
}

Note: For this to work properly make sure that all the fragment related items (FragmentDialog) are from the android.support.v4.app namespace.