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.design.widget.TabLayout

Log file:

07-30 00:52:40.588: E/Trace(31652): error opening trace file: No such file or directory (2)
07-30 00:52:40.672: E/AndroidRuntime(31652): FATAL EXCEPTION: main
07-30 00:52:40.672: E/AndroidRuntime(31652): java.lang.RuntimeException: Unable to start activity ComponentInfo{com.app.mykitchen/com.app.mykitchen.MainActivity}: android.view.InflateException: Binary XML file line #8: Error inflating class android.support.design.widget.TabLayout
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2184)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2211)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.ActivityThread.access$600(ActivityThread.java:149)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1300)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.os.Handler.dispatchMessage(Handler.java:99)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.os.Looper.loop(Looper.java:153)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.ActivityThread.main(ActivityThread.java:4987)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at java.lang.reflect.Method.invokeNative(Native Method)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at java.lang.reflect.Method.invoke(Method.java:511)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:821)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:584)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at dalvik.system.NativeStart.main(Native Method)
07-30 00:52:40.672: E/AndroidRuntime(31652): Caused by: android.view.InflateException: Binary XML file line #8: Error inflating class android.support.design.widget.TabLayout
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.view.LayoutInflater.createView(LayoutInflater.java:613)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:687)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.view.LayoutInflater.rInflate(LayoutInflater.java:746)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.view.LayoutInflater.inflate(LayoutInflater.java:489)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.view.LayoutInflater.inflate(LayoutInflater.java:396)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.view.LayoutInflater.inflate(LayoutInflater.java:352)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at com.android.internal.policy.impl.PhoneWindow.setContentView(PhoneWindow.java:258)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.Activity.setContentView(Activity.java:1867)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at com.app.mykitchen.MainActivity.onCreate(MainActivity.java:30)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.Activity.performCreate(Activity.java:5020)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1080)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2148)
07-30 00:52:40.672: E/AndroidRuntime(31652):    ... 11 more
07-30 00:52:40.672: E/AndroidRuntime(31652): Caused by: java.lang.reflect.InvocationTargetException
07-30 00:52:40.672: E/AndroidRuntime(31652):    at java.lang.reflect.Constructor.constructNative(Native Method)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at java.lang.reflect.Constructor.newInstance(Constructor.java:417)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.view.LayoutInflater.createView(LayoutInflater.java:587)
07-30 00:52:40.672: E/AndroidRuntime(31652):    ... 22 more
07-30 00:52:40.672: E/AndroidRuntime(31652): Caused by: java.lang.NoClassDefFoundError: android.support.design.R$styleable
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.support.design.widget.TabLayout.<init>(TabLayout.java:236)
07-30 00:52:40.672: E/AndroidRuntime(31652):    at android.support.design.widget.TabLayout.<init>(TabLayout.java:221)
07-30 00:52:40.672: E/AndroidRuntime(31652):    ... 25 more

MainActivity.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical">

<android.support.design.widget.TabLayout
        android:id="@+id/sliding_tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
/>
<android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="0px"
        android:layout_weight="1"
        android:background="@color/white" />

</LinearLayout>

I've tried setting the AppBase theme to AppCompat, but it doesn't help.

Abdullah

have you imported design support library? Its different from app compat library – Ortensia

Yes i did it the last version that it can be downloaded with sdk manager. – Abdullah

Does your activity extends the AppCompatActivity? – Yann

no, i extend the fragmentActivity, cause i have to work with fragments with the new design support library. – Abdullah

@Abdullah I am also facing the same problem. Can you share me how you resolved your issue. That will help me lot. – Hoarsen

@GiorgosOikonomou I am facing the same exact error and i added design support library and extends my main activity by AppCompatActivity. I am using <style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar"> theme as parent. I already raised SO question #32826785. Please help me. Thanks – Hoarsen

Check [this][1] answer, it should fix the issue. [1]: https://mcmap.net/q/131182/-got-error-inflating-class-android-support-design-widget-tablayout – Husbandry

Possible duplicate of ClassNotFoundException: Didn't find class "android.support.design.R$styleable" – Faber

I was missing design support library. Just added to build.gradle: api('com.android.support:design:27.1.1') – Stroboscope

Possible duplicate of How do I import material design library to Android Studio? – Ody

Answer 1

Don't know if this relates to your problem. I changed tags of TabLayout and ViewPager to ones that correspond to ones on this page: https://material.io/develop/android/components/tab-layout/

Here is my code from my app, which made errors go away:

<com.google.android.material.tabs.TabLayout
    android:id="@+id/sliding_tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabMode="fixed"/>

<androidx.viewpager.widget.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="0px"
    android:layout_weight="1"
    android:background="@android:color/white" />

Cattalo

Answer 2

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).

<style name="TabAppTheme" parent="Theme.AppCompat.Light.DarkActionBar">        
</style>

Then we can define the activity theme in manifest file.

<activity
    android:name=".MyTabActivity"
    android:theme="TabAppTheme"
/>

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;
}

Naughton

Answer 3

I also faced similar issue. After some research on issue I find the solution. Add another style resource for your tablayout.

I have described it on my blog also.

http://www.geeksmember.blogspot.in/2015/10/errorerror-inflating-class.html

Add this to your values-v21/styles.xml. If you don't have values-v21 folder create one in app/res folder. And then create a styles.xml file in that folder.

    <resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="AppTheme.Base"/>
    <!-- inherit from the material theme -->
    <style name="AppTheme.Base" parent="android:Theme.Material">
        <!-- colorPrimary is used for the default action bar background -->
        <item name="android:colorPrimary">#3F51B5</item>

        <!-- colorPrimaryDark is used for the status bar -->
        <item name="android:colorPrimaryDark">#303F9F</item>

        <!-- colorAccent is used as the default value for colorControlActivated
             which is used to tint widgets -->
        <item name="android:colorAccent">#FF4081</item>
    </style>

    <style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
        <item name="tabIndicatorColor">#FF4081</item>
    </style>
</resources>

And then add custom style attribute to your tablayout.

<android.support.design.widget.TabLayout
        android:id="@+id/sliding_tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        style="@style/MyCustomTabLayout"
/>

I also faced the same problem and this works like a charm.

Reference: https://code.google.com/p/android/issues/detail?id=175582

Armentrout

I'm trying to use @Redione1's method of showing a ViewPager position using a TabLayout from here: #38459809 and am getting this same error. Again it seems to be related to AppCompat but the above solution does not work - I still get the same error (plus a messed up layout because of the theme changes) – Carmacarmack

Answer 4

I was also getting same error. I resolve the problem by replacing

Getting error in this code

<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    app:layout_constraintEnd_toEndOf="parent"
    app:tabMode="scrollable"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@+id/viewpager" />

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="0dp"
    android:layout_height="0dp"

    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

---

Use This code to solved above problem mentioned

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tab_layout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="4dp"
    android:background="?attr/colorPrimary"
    app:layout_constraintBottom_toTopOf="@+id/viewpager"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<androidx.viewpager.widget.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_marginEnd="5dp"
    android:layout_marginBottom="3dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/tab_layout" />

**If you are using androidx than need to change android.support.design.widget.TabLayout to com.google.android.material.tabs.TabLayout **

Misconstrue

Answer 5

I was also getting same error. I resolve the problem by upgrade android.support com.android.support:design:24.1.0

to

com.android.support:design:28.0.0

Crissum