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.

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" />