TabLayout using fragment dynamically

Question

I just tried to use TabLayout, and I have some issues to understand how it works. Fragments is new for me too. So this is the point, My first activity when the user launch the app is a tutorial. I use one fragment for each part of the tutorial. What's more, I know that only the view pager is enough for the user I just want to try it with the tab layout too. So, in the first fragment I have a TextView and a Button. And when the user click on the button, I want to switch to the second tab for the second part of the tutorial etc.

Now the first fragment :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ext="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
    android:id="@+id/tv_tuto_first_fragment"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

<Button
    android:layout_width="130dp"
    android:layout_height="53dp"
    android:id="@+id/valider_tuto_first_fragment"/>

</RelativeLayout>

The java file :

public class TutoFirstFragment extends Fragment {

    public TutoFirstFragment()
    {

    }

    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
    }

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

The onCreate() method on the Activity named Tutoriel :

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    replaceContentLayout(R.layout.tutorial_activity, super.CONTENT_LAYOUT_ID);

    toolbar = (Toolbar) findViewById(R.id.tutorial_toolbar);
    navigationView = (NavigationView) findViewById(R.id.nav_view);
    tabLayout = (TabLayout) findViewById(R.id.tuto_tab_layout);
    tabHost = (TabHost) findViewById(R.id.tuto_first_fragment_tabhost);
    viewPager = (ViewPager) findViewById(R.id.tuto_view_pager);

    setSupportActionBar(toolbar);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    toggle = new ActionBarDrawerToggle(this, drawer, toolbar,  R.string.navigation_drawer_open, R.string.navigation_drawer_close);
    drawer.setDrawerListener(toggle);
    toggle.syncState();

    navigationView.setNavigationItemSelectedListener(this);

    setupViewPager(viewPager);
    tabLayout.setupWithViewPager(viewPager);
    tabLayout.setSelectedTabIndicatorColor(ContextCompat.getColor(context, R.color.white));

    toSecondFragment = (Button) findViewById(R.id.valider_tuto_first_fragment);
    toSecondFragment.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            tabHost.setCurrentTab(tabLayout.getSelectedTabPosition() + 1);
        }
    });
}

To the issue is that I can't make the onClickListener in the activity and I don't understand how to do it in fragments.

Thank you for your help by sharing me your knowledge :)

Answer 1

Make your fragment implement OnClickListener :

public class MainFragment extends Fragment implements OnClickListener

Then implement the onClick method in your fragment

@Override // LISTENER
public void onClick(View v) { do your stuff there }

Now to assign his listener to an object, use the following:

yourWhateverObject.setOnClickListener(this);

Now you can switch your tab position in this if you have access to the pager as an example:

pager.setCurrentItem(position);

Answer 2

You are essentially wondering how your fragment can communicate with it'a parent activity.

The cleanest way to do this, is to define an interface in your fragment, have your activity implement it, and then override onAttach(..) to setup a callback.

There is an example for this here http://developer.android.com/training/basics/fragments/communicating.html#DefineInterface