The first step is to build the scene that will be animated. Create a new project called Sunset. Make sure that your minimum API level is set to 21, and use the empty activity template and AndroidX artifacts.
A sunset by the sea should be colorful, so it will help to start by naming a few colors. Open the colors.xml file in your res/values folder and add the following values to it.
Listing 31.1 Adding sunset colors (res/values/colors.xml)
<resources>
<color name="colorPrimary">#008577</color>
<color name="colorPrimaryDark">#00574B</color>
<color name="colorAccent">#D81B60</color>
<color name="bright_sun">#fcfcb7</color>
<color name="blue_sky">#1e7ac7</color>
<color name="sunset_sky">#ec8100</color>
<color name="night_sky">#05192e</color>
<color name="sea">#224869</color>
</resources>
Rectangular views will make for a fine impression of the sky and the sea. But, outside of Minecraft, people will not buy a rectangular sun, no matter how much you argue in favor of its technical simplicity. So, in the res/drawable/ folder, add an oval shape drawable for a circular sun called sun.xml.
Listing 31.2 Adding a sun XML drawable (res/drawable/sun.xml)
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="@color/bright_sun" />
</shape>
When you display this oval in a square view, you will get a circle. People will nod their heads in approval and then think about the real sun up in the sky.
Next, build the entire scene out in a layout file. Open res/layout/activity_main.xml, delete the current contents, and add the following.
Listing 31.3 Setting up the layout (res/layout/activity_main.xml)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/scene"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="@+id/sky"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.61"
android:background="@color/blue_sky">
<ImageView
android:id="@+id/sun"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/sun" />
</FrameLayout>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.39"
android:background="@color/sea" />
</LinearLayout>
Check out the preview. You should see a daytime scene of the sun in a blue sky over a dark blue sea. Take a moment to run Sunset to make sure everything is hooked up correctly before moving on. It should look like Figure 31.1. Ahhh.
