Error inflating class android.support.design.widget.TabLayout

Question

I\'m trying to create a menu tab based on Google\'s \"material design\" using Eclipse, but I got an error:

Error inflating class android.support.desig

Answer 1

I have a bit more in my Logcat. You can see at the end that there is clear explanation:

You need to use a Theme.AppCompat theme (or descendant) with the design library.

android.view.InflateException: Binary XML file line #6: Error inflating class android.support.design.widget.TabLayout at android.view.LayoutInflater.createView(LayoutInflater.java:633) at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:743) at android.view.LayoutInflater.rInflate(LayoutInflater.java:806) at android.view.LayoutInflater.inflate(LayoutInflater.java:504) at android.view.LayoutInflater.inflate(LayoutInflater.java:414) at pl.acme_gliwice.smieciarka.nowe.ekran_glowny.MainTrasyFragment.onCreateView(MainTrasyFragment.java:44) at android.support.v4.app.Fragment.performCreateView(Fragment.java:2337) at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1418) at android.support.v4.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManager.java:1739) at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1808) at android.support.v4.app.BackStackRecord.executeOps(BackStackRecord.java:799) at android.support.v4.app.FragmentManagerImpl.executeOps(FragmentManager.java:2579) at android.support.v4.app.FragmentManagerImpl.executeOpsTogether(FragmentManager.java:2366) at android.support.v4.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManager.java:2321) at android.support.v4.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:2228) at android.support.v4.app.FragmentManagerImpl$1.run(FragmentManager.java:699) at android.os.Handler.handleCallback(Handler.java:739) at android.os.Handler.dispatchMessage(Handler.java:95) at android.os.Looper.loop(Looper.java:135) at android.app.ActivityThread.main(ActivityThread.java:5376) at java.lang.reflect.Method.invoke(Native Method) at java.lang.reflect.Method.invoke(Method.java:372) at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:908) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:703) Caused by: java.lang.reflect.InvocationTargetException at java.lang.reflect.Constructor.newInstance(Native Method) at java.lang.reflect.Constructor.newInstance(Constructor.java:288) at android.view.LayoutInflater.createView(LayoutInflater.java:607) at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:743)  at android.view.LayoutInflater.rInflate(LayoutInflater.java:806)  at android.view.LayoutInflater.inflate(LayoutInflater.java:504)  at android.view.LayoutInflater.inflate(LayoutInflater.java:414)  at pl.acme_gliwice.smieciarka.nowe.ekran_glowny.MainTrasyFragment.onCreateView(MainTrasyFragment.java:44)  at android.support.v4.app.Fragment.performCreateView(Fragment.java:2337)  at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1418)  at android.support.v4.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManager.java:1739)  at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1808)  at android.support.v4.app.BackStackRecord.executeOps(BackStackRecord.java:799)  at android.support.v4.app.FragmentManagerImpl.executeOps(FragmentManager.java:2579)  at android.support.v4.app.FragmentManagerImpl.executeOpsTogether(FragmentManager.java:2366)  at android.support.v4.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManager.java:2321)  at android.support.v4.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:2228)  at android.support.v4.app.FragmentManagerImpl$1.run(FragmentManager.java:699)  at android.os.Handler.handleCallback(Handler.java:739)  at android.os.Handler.dispatchMessage(Handler.java:95)  at android.os.Looper.loop(Looper.java:135)  at android.app.ActivityThread.main(ActivityThread.java:5376)  at java.lang.reflect.Method.invoke(Native Method)  at java.lang.reflect.Method.invoke(Method.java:372)  at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:908)  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:703)  Caused by: java.lang.IllegalArgumentException: You need to use a Theme.AppCompat theme (or descendant) with the design library. at android.support.design.widget.ThemeUtils.checkAppCompatTheme(ThemeUtils.java:33) at android.support.design.widget.TabLayout.(TabLayout.java:298) at android.support.design.widget.TabLayout.(TabLayout.java:292)

All this style trick examples above are not exactly true.

We have 2 scenarios:

1) Our TabLayout is in the activity. If that's the case, we need to set the theme of this activity to AppCompat theme. First we need to define such theme in style.xml (it doesn't have to be 21 version).

Then we can define the activity theme in manifest file.

We don't need to do anything with our layout.xml

2) Our TabLayout is inside the fragment

Similar situation but it's harder to change the theme.

First we define theme as above. Then we need to change the theme for just our TabFragment. To do this our ActivityThatHoldsTheFragment must not have a theme set to it in the manifest. It can inherit it from the application theme but can't have it set directly.

Then we have to change fragment theme in OnCreateView of this fragment:

final Context contextThemeWrapper = new ContextThemeWrapper(getActivity(), R.style.TabAppTheme);
LayoutInflater localInflater = inflater.cloneInContext(contextThemeWrapper);
View view = localInflater.inflate(R.layout.fragment_main_trasy, container, false);

Whole fragment onCreateView can looks like this:

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // create ContextThemeWrapper from the original Activity Context with the custom theme
    final Context contextThemeWrapper = new ContextThemeWrapper(getActivity(), R.style.TabAppTheme);
    // clone the inflater using the ContextThemeWrapper
    LayoutInflater localInflater = inflater.cloneInContext(contextThemeWrapper);

    View view = localInflater.inflate(R.layout.fragment_main_trasy, container, false);
    tabLayout = (TabLayout) view.findViewById(R.id.tabs);
    viewPager = (ViewPager) view.findViewById(R.id.pager);
    mAdapter = new TabFragment.MyAdapter(getChildFragmentManager());
    viewPager.setAdapter(mAdapter);
    tabLayout.setupWithViewPager(viewPager);

    return view;
}