android - Material Design 和 appcompat 不适用于较旧的 API 版本

Question

我正在使用 appcompat v7 (23.1.1) 实现 MaterialDesign 向后兼容性。在 API 21 设备上它看起来不错。在旧的 API 版本上，我的样式没有任何影响。为什么？

API 21 的结果(目标):

API 17 中的结果(差):

这是我在 values 文件夹中的 style.xml:

<resources>

<!--
    Base application theme, dependent on API level. This theme is replaced
    by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <!--
        Theme customizations available in newer API levels can go in
        res/values-vXX/styles.xml, while customizations related to
        backward-compatibility can go here.
    -->
    <!-- customize the color palette -->
    <item name="android:colorPrimary">@color/teal200</item>
    <item name="android:colorPrimaryDark">@color/teal500</item>
    <item name="android:colorAccent">@color/material_green_A200</item>
    <item name="android:statusBarColor">@color/teal500</item>
    <item name="android:navigationBarColor">@color/teal500</item>
    <item name="android:windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="android:colorButtonNormal">@color/button</item>
    <item name="colorControlNormal">@color/deeporange300</item>
    <item name="colorControlActivated">@color/deeporange500</item>
    <item name="colorControlHighlight">@color/material_green_A200</item>        
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
    <!-- All customizations that are specific to a particular API-level befor 21 can go here. -->
</style>

这是 values-v21 文件夹中的 styles.xml:

    <?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- Customize your theme using Material Design here. -->
        <item name="android:buttonStyle">@style/button</item>
        <item name="android:buttonStyleToggle">@style/togglebutton</item>
    </style>
    <style name="button" parent="@android:style/Widget.Material.Button">
        <item name="android:textColor">@color/buttontextcolor</item>
    </style>
    <style name="togglebutton" parent="@android:style/Widget.Material.Button.Toggle">
        <item name="android:textColor">@color/buttontextcolor</item>
    </style>
</resources>

这是布局文件:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/background"
    tools:context="com.skymedium.theblowdryer.MainActivity"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:background="@color/menue"
        android:id="@+id/menue" >
        <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:gravity="center_vertical"
        android:id="@+id/row1" >

            <Button
                android:id="@+id/tab"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="0.5"
                android:text="@string/jukebox" />

            <RelativeLayout
                android:gravity="center_vertical"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:layout_weight="0.5"
                android:id="@+id/subrow" >
                <ImageView
                    android:id="@+id/tooltip"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginRight="15dp"
                    android:layout_alignParentRight="true"
                    android:scaleType="fitCenter"
                    android:src="@drawable/abc_ab_share_pack_holo_dark" />
            </RelativeLayout>

        </LinearLayout>/
        <LinearLayout
        android:gravity="center_vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:id="@+id/row2" >
            <ToggleButton
            android:id="@+id/onoff"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="ToggleButton"
            android:layout_marginRight="5dp"
            android:layout_weight="0.7" />
            <SeekBar
            android:id="@+id/seekBar1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:layout_weight="0.3" />
        </LinearLayout>
    </LinearLayout>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:id="@+id/swipearea" >
        <ProgressBar
        android:id="@+id/progressBar1"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_height="wrap_content" />
        <ImageView
        android:id="@+id/imageView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scaleType="fitCenter"
        android:adjustViewBounds="true"
        android:layout_gravity="top"
        android:src="@drawable/abc_ab_share_pack_holo_dark" />

    </LinearLayout>



</LinearLayout>

我尝试设置 <item name="colorButtonNormal">@color/button_color</item>它不适用于旧的 API。

提前致谢!

Answer 1

你把它倒过来了。让我解释一下，

样式.xml

<resources>

<!--
    Base application theme, dependent on API level. This theme is replaced
    by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <!--
        Theme customizations available in newer API levels can go in
        res/values-vXX/styles.xml, while customizations related to
        backward-compatibility can go here.
    -->
    <!-- customize the color palette -->


    <!--Notice!!! No "android" prefix!-->
    <item name="colorPrimary">@color/teal200</item>
    <item name="colorPrimaryDark">@color/teal500</item>
    <item name="colorAccent">@color/material_green_A200</item>



    <item name="android:statusBarColor">@color/teal500</item>
    <item name="android:navigationBarColor">@color/teal500</item>
    <item name="android:windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="android:colorButtonNormal">@color/button</item>
    <item name="colorControlNormal">@color/deeporange300</item>
    <item name="colorControlActivated">@color/deeporange500</item>
    <item name="colorControlHighlight">@color/material_green_A200</item>        
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
    <!-- All customizations that are specific to a particular API-level befor 21 can go here. -->
</style>

样式-v21

<resources>
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- Customize your theme using Material Design here. -->


        <!--Be sure to define your colors here as well! but this time use "android:"-->
        <item name="android:colorPrimary">@color/teal200</item>
        <item name="android:colorPrimaryDark">@color/teal500</item>
        <item name="android:colorAccent">@color/material_green_A200</item>





        <item name="android:buttonStyle">@style/button</item>
        <item name="android:buttonStyleToggle">@style/togglebutton</item>
    </style>
    <style name="button" parent="@android:style/Widget.Material.Button">
        <item name="android:textColor">@color/buttontextcolor</item>
    </style>
    <style name="togglebutton" parent="@android:style/Widget.Material.Button.Toggle">
        <item name="android:textColor">@color/buttontextcolor</item>
    </style>
</resources>

< API 21 的 styles.xml 不应为您的颜色使用“android”前缀。

在 styles.xml v-21 中使用 android 前缀定义颜色。上面的 XML 应该可以工作!