android.view.InflateException: Binary XML file line #17: Error inflating class <unknown>

Question

Hi i am trying to start activity with this layout, but it works only on android 5+, when i am running it on older versions it always crushes. What may cause this? Maybe i am using some restricted for android version<5 xml fields?

Styles

https://drive.google.com/open?id=0B-pbp_K-xNkEb0pQbzIzd0FYMU0 https://drive.google.com/open?id=0B-pbp_K-xNkEWlpuanl3ejhxd2c

Layout

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="192dp"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

            <ImageView
                android:id="@+id/header"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/sport"
                android:fitsSystemWindows="true"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/anim_toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

        </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/scroll"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/background"
        android:clipToPadding="false"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">


        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/background"
            android:orientation="vertical">

            <LinearLayout
                android:id="@+id/title_lay"
                android:layout_width="match_parent"
                android:layout_height="72dp"
                android:background="@color/background"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:paddingLeft="30dp"
                android:paddingRight="30dp">

                <FrameLayout
                    android:layout_width="40dp"
                    android:layout_height="40dp"
                    android:layout_marginRight="16dp">

                    <ImageView
                        android:id="@+id/iv_icon"
                        android:layout_width="40dp"
                        android:layout_height="40dp" />

                </FrameLayout>

                <LinearLayout
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center_vertical"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/club_title"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:gravity="center_vertical"
                        android:textSize="16sp"
                        android:textColor="@color/second_text" />

                    <TextView
                        android:id="@+id/club_description"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:gravity="center_vertical"
                        android:textColor="@color/text_color" />
                </LinearLayout>


            </LinearLayout>

            <LinearLayout
                android:id="@+id/subscription_lay"
                android:layout_width="match_parent"
                android:layout_height="40dp"
                android:layout_below="@id/title_lay"
                android:layout_marginBottom="8dp"
                android:background="@drawable/backgroundtoolbar"
                android:clickable="true"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <ImageView
                    android:layout_width="24dp"
                    android:layout_height="24dp" />

                <TextView
                    android:id="@+id/subscription_txt"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/str_subscribe_on"
                    android:textSize="16sp" />

            </LinearLayout>

            <android.support.v7.widget.CardView
                android:id="@+id/address_card_view"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="8dp"
                android:background="@color/second_background"
                android:layout_below="@id/subscription_lay"
                app:cardCornerRadius="4dp"
                >

                <RelativeLayout
                    android:id="@+id/address_lay"
                    android:layout_width="match_parent"
                    android:layout_height="48dp"
                    android:background="@color/second_background"
                    android:gravity="center_vertical"
                    android:paddingLeft="16dp"
                    android:paddingRight="16dp">

                    <TextView
                        android:id="@+id/club_address"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text=""
                        android:textColor="@color/second_text" />

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentRight="true"
                        android:src="@drawable/ic_maps_place" />
                </RelativeLayout>

            </android.support.v7.widget.CardView>

            <android.support.v7.widget.CardView
                android:id="@+id/schedule_card_view"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="8dp"
                android:background="@color/second_background"
                android:layout_below="@id/address_card_view"
                app:cardCornerRadius="4dp"
                >

                <RelativeLayout
                    android:id="@+id/schedule_lay"
                    android:layout_width="match_parent"
                    android:layout_height="64dp"
                    android:background="@color/second_background"
                    android:gravity="center_vertical"
                    android:paddingLeft="16dp"
                    android:paddingRight="16dp">

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:gravity="center_vertical"
                        android:orientation="vertical">

                        <TextView
                            android:id="@+id/club_schedule"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/schedule_title"
                            android:gravity="center_vertical"
                            android:textColor="@color/text_color" />

                        <TextView
                            android:id="@+id/schedule_value"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text=""
                            android:gravity="center_vertical"
                            android:textColor="@color/second_text" />
                    </LinearLayout>

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentRight="true"
                        android:layout_centerVertical="true"
                        android:src="@drawable/ic_notification_event_note" />
                </RelativeLayout>

            </android.support.v7.widget.CardView>

            <android.support.v7.widget.CardView
                android:id="@+id/contact_card_view"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="8dp"
                android:background="@color/second_background"
                android:layout_below="@id/schedule_card_view"
                app:cardCornerRadius="4dp"
                >

                <RelativeLayout
                    android:id="@+id/contact_lay"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/second_background"
                    android:gravity="center_vertical"
                    android:paddingLeft="16dp"
                    android:paddingRight="16dp">

                    <RelativeLayout
                        android:id="@+id/phone_lay"
                        android:layout_width="match_parent"
                        android:gravity="center_vertical"
                        android:layout_height="64dp">

                        <LinearLayout

                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:gravity="center_vertical"
                            android:orientation="vertical">

                            <TextView
                                android:id="@+id/phone_title"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text=""
                                android:gravity="center_vertical"
                                android:textColor="@color/text_color" />

                            <TextView
                                android:id="@+id/phone_value"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text=""
                                android:gravity="center_vertical"
                                android:textColor="@color/second_text" />
                        </LinearLayout>

                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentRight="true"
                            android:layout_centerVertical="true"
                            android:src="@drawable/ic_maps_local_phone" />
                    </RelativeLayout>

                    <RelativeLayout
                        android:id="@+id/web_lay"
                        android:layout_width="match_parent"
                        android:layout_height="64dp"
                        android:gravity="center_vertical"
                        android:layout_below="@id/phone_lay">

                        <LinearLayout

                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:gravity="center_vertical"
                            android:orientation="vertical">

                            <TextView
                                android:id="@+id/web_title"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:gravity="center_vertical"
                                android:text=""
                                android:textColor="@color/text_color" />

                            <TextView
                                android:id="@+id/web_value"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:gravity="center_vertical"
                                android:text=""
                                android:textColor="@color/second_text" />
                        </LinearLayout>

                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentRight="true"
                            android:layout_centerVertical="true"
                            android:src="@drawable/ic_action_language" />
                    </RelativeLayout>

                    <RelativeLayout
                        android:id="@+id/mail_lay"
                        android:layout_width="match_parent"
                        android:layout_height="64dp"
                        android:gravity="center_vertical"
                        android:background="@color/second_background"
                        android:layout_below="@id/web_lay">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:gravity="center_vertical"
                            android:orientation="vertical">

                            <TextView
                                android:id="@+id/mail_title"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text=""
                                android:gravity="center_vertical"
                                android:textColor="@color/text_color" />

                            <TextView
                                android:id="@+id/mail_value"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="12-3123-123-34"
                                android:gravity="center_vertical"
                                android:textColor="@color/second_text" />
                        </LinearLayout>

                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentRight="true"
                            android:layout_centerVertical="true"
                            android:src="@drawable/ic_content_send" />
                    </RelativeLayout>

                    <View
                        android:id="@+id/devider"
                        android:layout_width="match_parent"
                        android:layout_height="1dp"
                        android:layout_below="@id/mail_lay"
                        android:paddingLeft="-30dp"
                        android:paddingRight="-30dp"
                        android:background="@color/second_background" />

                    <RelativeLayout
                        android:id="@+id/other_lay"
                        android:layout_width="match_parent"
                        android:layout_height="48dp"
                        android:gravity="center_vertical"
                        android:layout_below="@id/devider">

                        <TextView
                            android:id="@+id/club_contacts"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/detail"
                            android:layout_centerVertical="true"
                            android:textColor="@color/text_color" />

                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentRight="true"
                            android:layout_centerVertical="true"
                            android:src="@drawable/ic_hardware_keyboard_arrow_right" />
                    </RelativeLayout>

                </RelativeLayout>

            </android.support.v7.widget.CardView>
        </RelativeLayout>

    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>

Styles

 <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

<style name="AppTheme.NoActionBar" >
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>

Errors:

android.view.InflateException: Binary XML file line #17: Error inflating class <unknown>
 Caused by: android.view.InflateException: Binary XML file line #17: Error inflating class <unknown>
Caused by: java.lang.reflect.InvocationTargetException
Caused by: java.lang.IllegalArgumentException: You need to use a Theme.AppCompat theme (or descendant) with the design library.

Gradle

apply plugin: 'com.android.application'


android {
    compileSdkVersion 24
    buildToolsVersion "23.0.2"
    enforceUniquePackageName = false

    defaultConfig {
        applicationId "com.mycrosswod.crossfit"
        minSdkVersion 15
        targetSdkVersion 23
        versionCode 1
        versionName "1.0"
        multiDexEnabled true
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {

    compile fileTree(include: ['*.jar'], dir: 'libs')
    testCompile 'junit:junit:4.12'

    compile 'com.android.support:appcompat-v7:24+'
    compile 'com.android.support:design:24.0.0'
    compile 'com.android.support:recyclerview-v7:24.0.0'
    compile 'com.android.support:percent:24.0.0'
    compile 'com.google.firebase:firebase-core:9.6.1'
    compile 'com.google.android.gms:play-services-maps:9.6.1'
    compile 'com.google.code.gson:gson:1.7.2'
    compile 'com.squareup.picasso:picasso:2.5.2'
    compile 'com.squareup.okhttp3:okhttp:3.1.2'
    compile 'com.facebook.android:facebook-android-sdk:4+'
    compile 'com.vk:androidsdk:+'
    compile 'com.google.apis:google-api-services-youtube:v3-rev163-1.21.0'
    compile 'com.thefinestartist:ytpa:1.2.1'
    compile 'com.github.clans:fab:1.6.3'
    compile "com.google.firebase:firebase-messaging:9.0.0"
    compile 'com.android.support:multidex:1.0.1'
    compile group: 'org.apache.commons', name: 'commons-lang3', version: '3.0'
}

apply plugin: 'com.google.gms.google-services'

Answer 1

Are you using Vector images?

If you are try replacing all your android:src to app:srcCompat (when you are referring to a Vector image)

Answer 2

Change the lines as corresponding files values/v-2x/styles.xml

<style name="Base.MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="windowActionBar">false</item>
    <item name="windowActionBarOverlay">true</item>`
    <item name="windowNoTitle">true</item>

</style>
<style name="MyTheme" parent="Base.MyTheme">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
</style>

final styles in values/v-2x/styles.xml

<resources>     
<style name="CrossfitTextView" parent="@android:style/Widget.TextView">
<item name="android:textColor">@color/text_color</item>
<item name="android:drawableBottom">@color/tomato</item>
</style>
<style name="CrossfitSecondTextView" parent="@android:style/Widget.TextView">
    <item name="android:textColor">@color/text_color2</item>
</style>
<style name="CrossfitTitleTextView" parent="@android:style/Widget.TextView">
    <item name="android:textColor">@color/second_text</item>
</style>
<style name="CrossfitEditText" parent="@android:style/Widget.EditText">
    <item name="android:textSize">16sp</item>
    <item name="android:maxLines">1</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:textColorHint">@color/text_color</item>
</style>
<style name="Crossfit.Button" parent="Widget.AppCompat.Button.Colored">
    <item name="colorButtonNormal">@color/colorPrimary</item>
    <item name="colorControlHighlight">@color/colorPrimary</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:paddingLeft">10dp</item>
    <item name="android:paddingRight">10dp</item>
    <item name="android:gravity">center</item>
</style>
<style name="Crossfit.F" parent="Widget.AppCompat.Button.Colored">
    <item name="colorButtonNormal">@color/com_facebook_button_background_color</item>
    <item name="colorControlHighlight">@color/com_facebook_button_background_color</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:textAllCaps">false</item>
    <item name="android:paddingLeft">10dp</item>
    <item name="android:paddingRight">10dp</item>
    <item name="android:gravity">center</item>
    <item name="android:drawableLeft">@drawable/com_facebook_button_icon</item>
</style>
<style name="Crossfit.V" parent="Widget.AppCompat.Button.Colored">
    <item name="colorButtonNormal">@color/vk_share_blue_color</item>
    <item name="colorControlHighlight">@color/vk_share_blue_color</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:textAllCaps">false</item>
    <item name="android:paddingLeft">10dp</item>
    <item name="android:paddingRight">10dp</item>
    <item name="android:gravity">center</item>
    <item name="android:drawableLeft">@drawable/com_facebook_button_icon</item>
</style>
<style name="CustomActionBar" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:windowActionBarOverlay">true</item>
    <!-- Support library compatibility -->
    <item name="windowActionBarOverlay">true</item>
</style>


<style name="AppTheme" parent="AppTheme.Base">
<!-- Customize your theme here. -->
<item name="android:colorPrimary">@color/colorPrimary</item>
<item name="android:colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="android:colorAccent">@color/colorAccent</item>
<item name="android:textColorPrimary">@color/colorPrimary</item>
<item name="android:windowBackground">@color/colorAccent</item>
<item name="android:navigationBarColor">@color/colorPrimary</item>
</style>

<style name="MyTheme.Detail" parent="MyTheme">
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>
<style name="cfButton" parent="Widget.AppCompat.Button.Colored">
    <item name="colorButtonNormal">@color/colorPrimary</item>
    <item name="android:colorButtonNormal">@color/colorPrimary</item>
    <item name="colorControlHighlight">@color/colorPrimaryDark</item>
    <item name="android:textColor">@android:color/white</item>
</style>

<style name="MenuButtonsSmall">
    <item name="fab_size">mini</item>
    <item name="fab_colorNormal">@color/end</item>
    <item name="fab_colorPressed">@color/end</item>
    <item name="fab_colorRipple">@color/end</item>
</style>
<style name="mytext" parent="@android:style/TextAppearance">
    <item name="android:textColor">@color/text_color</item>
    <item name="android:textColorHint">@color/text_color</item>
    <item name="colorAccent">@color/text_color</item>
</style>
</resources>

Changes made in values/styles.xml

<style name="AppThemeSignIn" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/background</item>
    <item name="colorPrimaryDark">@color/background</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

final styles in values/styles.xml

<resources>     
<style name="CrossfitTextView" parent="@android:style/Widget.TextView">
    <item name="android:textColor">@color/text_color</item>
</style>

<style name="CrossfitEditText" parent="@android:style/Widget.EditText">
    <item name="android:textColor">@color/text_color</item>
    <item name="android:textColorHint">@color/text_color</item>
</style>

<!-- Base application theme. -->
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
</style>

<style name="AppTheme" parent="AppTheme.Base">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>


 <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

 <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
 <style name="MaterialDialogSheet" parent="@android:style/Theme.Dialog">
    <item name="android:windowIsTranslucent">true</item>
    <item    name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:backgroundDimEnabled">true</item>
    <item name="android:windowIsFloating">false</item>
    <item name="android:windowAnimationStyle">@style/MaterialDialogSheetAnimation</item>
</style>

 <style name="MaterialDialogSheetAnimation">
    <item name="android:windowEnterAnimation">@anim/popup_show</item>
    <item name="android:windowExitAnimation">@anim/popup_hide</item>
</style>

 <style name="MenuButtonsSmall">
    <item name="fab_size">mini</item>
    <item name="fab_colorNormal">#026158</item>
    <item name="fab_colorPressed">#026158</item>
    <item name="fab_colorRipple">#026158</item>
</style>

 <style name="MenuButtonNormal">
    <item name="fab_size">normal</item>
    <item name="fab_colorNormal">#026158</item>
    <item name="fab_colorPressed">#026158</item>
    <item name="fab_colorRipple">#026158</item>
</style>
</resources>

Answer 3

The issue about android doesn't know which theme to take. it is the conflict between pre-lollipop and post lollipop devices, So we need to explicitly convert into No action bar theme. Adding

compile 'com.android.support:appcompat-v7:24.2.0'

here my case is v24, choose your convenient version.To defining pre lollipop devices we change the style scheme in res/values/style.xml as follows:

<!-- Base application theme. -->
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
</style>

<style name="AppTheme" parent="AppTheme.Base">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

AppTheme inherited from AppTheme.Base it inherited from Theme.AppCompat.Light.NoActionBar. So here we can mention our supported color schemes here for pre-lollipop devices.Thats it :)

Material design supported from lollipop devices. we can add more color schemes here.We already defined AppTheme in res/values/styles.xml.

Now inherit same AppTheme from res/values/values/styles.xml to res/values/values-v21/styles.xml. So Values-v21/styles.xml as follows:

<style name="AppTheme" parent="AppTheme.Base">
    <!-- Customize your theme here. -->
    <item name="android:colorPrimary">@color/colorPrimary</item>
    <item name="android:colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="android:colorAccent">@color/colorAccent</item>
    <item name="android:textColorPrimary">@color/colorPrimary</item>
    <item name="android:windowBackground">@color/colorAccent</item>
    <item name="android:navigationBarColor">@color/colorPrimary</item>
</style>

Try this. :-)