Actual Android layout is different from designer

Question

According to this post, I know how to change the action bars' color. So I have the following styles.xml file:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
    </style>

    <style name="MyActionBar" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">#AFB42B</item>
    </style>

    <style name="MyTheme" parent="@android:style/Theme.Holo.Light">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
    </style>
</resources>

And this is the layout file:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:paddingLeft="@dimen/activity_horizontal_margin"
                android:paddingRight="@dimen/activity_horizontal_margin"
                android:paddingTop="@dimen/activity_vertical_margin"
                android:paddingBottom="@dimen/activity_vertical_margin"
                tools:context=".MainActivity"
                android:orientation="vertical"
                android:background="#CDDC39"
              android:gravity="right">

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:inputType="numberDecimal"
        android:ems="10"
        android:id="@+id/text_field"
        android:hint="Enter Amount"
        android:textSize="15pt"
        android:autoText="false"
        android:background="#F0F4C3"
        android:padding="10dp"
        android:layout_margin="10dp"
        android:textColor="#212121"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Convert it!"
        android:id="@+id/button"
        android:layout_margin="10dp"
        android:padding="25dp"
        android:textColor="#212121"/>

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/scrollView">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="Please Enter Amount"
            android:id="@+id/textView"
            android:textSize="10pt"
            android:typeface="monospace"
            android:textColor="#212121"/>
    </ScrollView>
</LinearLayout>

And in the designer, I selected the corresponding theme and it looks good. In the designer, the action bar is green and other stuff is also looking good. However, when I run this app on my phone, the action bar is black and a suppose-to-be-green button (the button with the text "Convert it!") is in its default color. My phone is using Android 4.3 if that matters.

Question: Why is the actual layout different from the designer? Is that because of the Android version? How can I fix it?

Answer 1

Make sure you specify the theme of your activity in the manifest file

<activity
   android:theme="@style/MyTheme">