Switch Fragment using ImageButton

Question

I really want to know how i can use an ImageButton to switch to another Fragment. FragmentSeven is where the ImageButton is and has to link to FragmentEight. How can i do that?

Here is my code from my FragmentSeven:

package com.mypackage;

import android.app.Fragment;
import android.content.Intent;
import android.content.pm.ActivityInfo;
import android.os.Bundle;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageButton;


public class FragmentSeven extends Fragment {


      public static final String IMAGE_RESOURCE_ID = "iconResourceID";
      public static final String ITEM_NAME = "itemName";

      public FragmentSeven() {

      }



      @Override
      public View onCreateView(LayoutInflater inflater, ViewGroup container,
                  Bundle savedInstanceState) {

          View view = inflater.inflate(R.layout.fragment_layout_seven, container, false);

          getActivity().setRequestedOrientation(
                  ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);

          final ImageButton ib = (ImageButton) view.findViewById(R.id.imageButton2);
          ib.setOnClickListener(new View.OnClickListener(){
             //SWITCH TO OTHER FRAGMENT HERE
          });

            return view;

         }
      }

Here is my MainActivity:

package com.rydee.trinitas;

 import java.util.ArrayList;
 import java.util.List;

 import android.os.Bundle;
 import android.app.Activity;
 import android.app.Fragment;
 import android.app.FragmentManager;
 import android.content.res.Configuration;
 import android.support.v4.view.GravityCompat;
 import android.support.v4.widget.DrawerLayout;
 import android.view.Menu;
 import android.view.MenuItem;
 import android.view.View;
 import android.widget.AdapterView;
 import android.widget.ListView;

 public class MainActivity extends Activity {

  private DrawerLayout mDrawerLayout;
  private ListView mDrawerList;
  private ActionBarDrawerToggle mDrawerToggle;

  private CharSequence mDrawerTitle;
  private CharSequence mTitle;
  CustomDrawerAdapter adapter;

  List<DrawerItem> dataList;

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

        // Initializing
        dataList = new ArrayList<DrawerItem>();
        mTitle = mDrawerTitle = getTitle();
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerList = (ListView) findViewById(R.id.left_drawer);

        mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow,
                    GravityCompat.START);

        // Add Drawer Item to dataList
        dataList.add(new DrawerItem("1", R.drawable.1));
        dataList.add(new DrawerItem("2", R.drawable.2));
        dataList.add(new DrawerItem("3", R.drawable.3));
        dataList.add(new DrawerItem("4", R.drawable.4));
        dataList.add(new DrawerItem(" 5", R.drawable.5));
        dataList.add(new DrawerItem(" 6", R.drawable.6));
        dataList.add(new DrawerItem(" 7", R.drawable.7));

        adapter = new CustomDrawerAdapter(this, R.layout.custom_drawer_item,
                    dataList);

        mDrawerList.setAdapter(adapter);

        mDrawerList.setOnItemClickListener(new DrawerItemClickListener());

        getActionBar().setDisplayHomeAsUpEnabled(true);
        getActionBar().setHomeButtonEnabled(true);

        mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,
                    R.drawable.ic_drawer, R.string.drawer_open,
                    R.string.drawer_close) {
              public void onDrawerClosed(View view) {
                    getActionBar().setTitle(mTitle);
                    invalidateOptionsMenu(); // creates call to
                                                              // onPrepareOptionsMenu()
              }

              public void onDrawerOpened(View drawerView) {
                    getActionBar().setTitle(mDrawerTitle);
                    invalidateOptionsMenu(); // creates call to
                                                              // onPrepareOptionsMenu()
              }
        };

        mDrawerLayout.setDrawerListener(mDrawerToggle);

        if (savedInstanceState == null) {
              SelectItem(0);
        }

  }



  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;

  }

  public void SelectItem(int possition) {

        Fragment fragment = null;
        Bundle args = new Bundle();
        switch (possition) {
        case 0:
              fragment = new FragmentOne();
              args.putString(FragmentOne.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentOne.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 1:
              fragment = new FragmentTwo();
              args.putString(FragmentTwo.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentTwo.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 2:
              fragment = new FragmentThree();
              args.putString(FragmentThree.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentThree.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 3:
            fragment = new FragmentFour();
            args.putString(FragmentFour.ITEM_NAME, dataList.get(possition)
                        .getItemName());
            args.putInt(FragmentFour.IMAGE_RESOURCE_ID, dataList.get(possition)
                        .getImgResID());
            break;
      case 4:
            fragment = new FragmentFive();
            args.putString(FragmentFive.ITEM_NAME, dataList.get(possition)
                        .getItemName());
            args.putInt(FragmentFive.IMAGE_RESOURCE_ID, dataList.get(possition)
                        .getImgResID());
            break;
      case 5:
            fragment = new FragmentSix();
            args.putString(FragmentSix.ITEM_NAME, dataList.get(possition)
                        .getItemName());
            args.putInt(FragmentSix.IMAGE_RESOURCE_ID, dataList.get(possition)
                        .getImgResID());
            break;
        case 6:
              fragment = new FragmentSeven();
              args.putString(FragmentSeven.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentSeven.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 7:
              fragment = new FragmentTwo();
              args.putString(FragmentTwo.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentTwo.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 8:
              fragment = new FragmentThree();
              args.putString(FragmentThree.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentThree.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 9:
              fragment = new FragmentOne();
              args.putString(FragmentOne.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentOne.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 10:
              fragment = new FragmentTwo();
              args.putString(FragmentTwo.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentTwo.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 11:
              fragment = new FragmentThree();
              args.putString(FragmentThree.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentThree.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        case 12:
              fragment = new FragmentOne();
              args.putString(FragmentOne.ITEM_NAME, dataList.get(possition)
                          .getItemName());
              args.putInt(FragmentOne.IMAGE_RESOURCE_ID, dataList.get(possition)
                          .getImgResID());
              break;
        default:
              break;
        }

        fragment.setArguments(args);
        FragmentManager frgManager = getFragmentManager();
        frgManager.beginTransaction().replace(R.id.content_frame, fragment)
                    .commit();

        mDrawerList.setItemChecked(possition, true);
        setTitle(dataList.get(possition).getItemName());
        mDrawerLayout.closeDrawer(mDrawerList);

  }

  @Override
  public void setTitle(CharSequence title) {
        mTitle = title;
        getActionBar().setTitle(mTitle);
  }

  @Override
  protected void onPostCreate(Bundle savedInstanceState) {
        super.onPostCreate(savedInstanceState);
        // Sync the toggle state after onRestoreInstanceState has occurred.
        mDrawerToggle.syncState();
  }

  @Override
  public void onConfigurationChanged(Configuration newConfig) {
        super.onConfigurationChanged(newConfig);
        // Pass any configuration change to the drawer toggles
        mDrawerToggle.onConfigurationChanged(newConfig);
  }

  @Override
  public boolean onOptionsItemSelected(MenuItem item) {
        // The action bar home/up action should open or close the drawer.
        // ActionBarDrawerToggle will take care of this.
        if (mDrawerToggle.onOptionsItemSelected(item)) {
              return true;
        }

        return false;
  }

    private class DrawerItemClickListener implements
              ListView.OnItemClickListener {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position,
                    long id) {
              SelectItem(position);

        }
  }

Have you tried anything? If so, what behavior did you experience? — Bryan Herbst, May 12 '14 at 14:37

score 0 · Answer 1 · answered May 12 '14 at 15:19

You generally don't want to be starting fragments from within other fragments, especially when you're going to be replacing one with another. The correct way to implement this is to add an interface that your fragmentSeven can use to communicate with the parent activity, which will manage the transaction.

public interface OnImageButtonListener {
    public void onImageButton();
}

@Override
public void onAttach(Activity activity){
    super.onAttach(activity);
    try {
        mListener = (OnImageButtonListener) activity;
    }catch (ClassCastException e){
        throw new ClassCastException(activity.toString() + " must implement OnImageButtonListener");
    }
}
....


OnImageButtonListener mListener = (OnImageButtonListener) this.getActivity();
final ImageButton ib = (ImageButton) view.findViewById(R.id.imageButton2);
ib.setOnClickListener(new View.OnClickListener(){
    mListener.onImageButton();
});

Then you implement OnImageButtonListener in your host activity and manage the FragmentTransaction there. You can do it directly in:

@Override
onImageButton(){
//do a fragmenttransaction here in your activity
}

I don't really understand what i have to do. I'm just a noob in this kind of things so can you maybe explain me where i have to put all these code? I will add some things above like the MainActivity — Melvin, May 12 '14 at 15:35

score 0 · Answer 2 · answered May 12 '14 at 18:35

Step-1 : Put this method in your MainActivity.java,

    public void switchContent(Fragment fragment) {
    mContent = fragment;

    FragmentManager manager = getSupportFragmentManager();
    FragmentTransaction ft = manager.beginTransaction();
    ft.setTransitionStyle(android.R.attr.fragmentOpenEnterAnimation);
    ft.replace(R.id.content_frame, fragment);
    ft.commit();

    getSlidingMenu().showContent();
}

Step-2: And now this code at click event of your button and where ever you wants to switch your fragment,

        Fragment newContent = new FragmentEight();
    if (getActivity() == null)
        return;
    if (getActivity() instanceof MainActivity) {
        MainActivity fca = (MainActivity) getActivity();
        fca.switchContent(newContent);
    }

Switch Fragment using ImageButton

2 Answers2