color

colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>

    <color name="white">#FFFFFF</color>
    <color name="grey">#cccccc</color>
    <color name="grey_700">#646464</color>
    <color name="black">#000000</color>

    <color name="sunshine_light_blue">#ff64c2f4</color>
    <color name="sunshine_blue">#ff1ca8f4</color>
    <color name="sunshine_dark_blue">#0288D1</color>
</resources>

fragment_detail.xml

<!-- Master layout. -->
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:gravity="center_vertical"
        android:orientation="vertical"
        android:padding="16dp">

        <!-- Header: Day, Date -->
        <TextView
            android:id="@+id/detail_day_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-condensed"
            android:textColor="@color/black"
            android:textSize="24sp"/>

        <TextView
            android:id="@+id/detail_date_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-condensed"
            android:textColor="@color/grey_700"
            android:textSize="16sp"/>

        <!-- Main content: high, low, art, weather state -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="16dp"
            android:gravity="center_horizontal"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="left"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/detail_high_textview"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:fontFamily="sans-serif-light"
                    android:textSize="96sp"/>

                <TextView
                    android:id="@+id/detail_low_textview"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:textColor="@color/grey_700"
                    android:textSize="48sp"/>
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center_horizontal"
                android:orientation="vertical">

                <ImageView
                    android:id="@+id/detail_icon"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

                <TextView
                    android:id="@+id/detail_forecast_textview"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:textAppearanceLarge"
                    android:textColor="@color/grey_700"/>
            </LinearLayout>
        </LinearLayout>

        <!-- Humidity, wind, pressure -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginRight="0dp"
            android:layout_marginTop="16dp"
            android:orientation="vertical">

            <TextView
                android:id="@+id/detail_humidity_textview"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textAppearance="?android:textAppearanceLarge"/>

            <TextView
                android:id="@+id/detail_pressure_textview"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="4dp"
                android:textAppearance="?android:textAppearanceLarge"/>

            <TextView
                android:id="@+id/detail_wind_textview"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="4dp"
                android:textAppearance="?android:textAppearanceLarge"/>
        </LinearLayout>
    </LinearLayout>
</ScrollView>

fragment_detail_wide.xml

<!-- Master layout. -->
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fillViewport="true">

    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:orientation="horizontal"
        android:padding="16dp" >

        <LinearLayout
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:minWidth="56dp"
            android:orientation="vertical" >

            <!-- Header: Day, Date -->
            <TextView
                android:fontFamily="sans-serif-condensed"
                android:id="@+id/detail_day_textview"
                android:layout_height="wrap_content"
                android:minWidth="120dp"
                android:layout_width="wrap_content"
                android:textSize="24sp" />

            <TextView
                android:fontFamily="sans-serif-condensed"
                android:id="@+id/detail_date_textview"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:textColor="@color/grey_700"
                android:textSize="20sp" />

        </LinearLayout>

        <!-- Main content: high, low, art, weather state -->
        <LinearLayout
            android:layout_height="wrap_content"
            android:layout_marginLeft="16dp"
            android:layout_width="wrap_content"
            android:orientation="vertical">

            <TextView
                android:fontFamily="sans-serif-light"
                android:id="@+id/detail_high_textview"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:textSize="96sp" />

            <TextView
                android:id="@+id/detail_low_textview"
                android:layout_height="wrap_content"
                android:layout_marginLeft="8dp"
                android:layout_width="wrap_content"
                android:textColor="@color/grey_700"
                android:textSize="48sp" />

            <!-- Humidity, wind, pressure -->
            <TextView
                android:fontFamily="sans-serif-condensed"
                android:id="@+id/detail_humidity_textview"
                android:layout_height="wrap_content"
                android:layout_marginTop="4dp"
                android:layout_width="wrap_content"
                android:textAppearance="?android:textAppearanceLarge" />

            <TextView
                android:fontFamily="sans-serif-condensed"
                android:id="@+id/detail_pressure_textview"
                android:layout_height="wrap_content"
                android:layout_marginTop="4dp"
                android:layout_width="wrap_content"
                android:textAppearance="?android:textAppearanceLarge" />

            <TextView
                android:fontFamily="sans-serif-condensed"
                android:id="@+id/detail_wind_textview"
                android:layout_height="wrap_content"
                android:layout_marginTop="4dp"
                android:layout_width="wrap_content"
                android:textAppearance="?android:textAppearanceLarge" />
        </LinearLayout>

        <LinearLayout
            android:gravity="center_horizontal"
            android:layout_height="wrap_content"
            android:layout_marginLeft="16dp"
            android:layout_width="wrap_content"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/detail_icon"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content" />

            <TextView
                android:fontFamily="sans-serif-condensed"
                android:id="@+id/detail_forecast_textview"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:textColor="@color/grey_700"
                android:textAppearance="?android:textAppearanceLarge"/>
        </LinearLayout>
    </LinearLayout>
</ScrollView>

fragment_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    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"
    tools:context=".ForecastFragment">

    <ListView
        android:id="@+id/listview_forecast"
        style="@style/ForecastListStyle"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:divider="@null"/>

</FrameLayout>

list_item_forecast.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:background="@drawable/touch_selector"
              android:gravity="center_vertical"
              android:minHeight="?android:attr/listPreferredItemHeight"
              android:orientation="horizontal">

    <FrameLayout
        android:layout_width="60dp"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/list_item_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"/>

    </FrameLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="7"
        android:orientation="vertical">

        <TextView
            android:id="@+id/list_item_date_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-condensed"
            android:textSize="20sp"/>

        <TextView
            android:id="@+id/list_item_forecast_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-condensed"
            android:textAppearance="?android:textAppearanceSmall"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="5"
        android:orientation="vertical">

        <TextView
            android:id="@+id/list_item_high_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:fontFamily="sans-serif-condensed"
            android:textAppearance="?android:textAppearanceLarge"/>

        <TextView
            android:id="@+id/list_item_low_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:fontFamily="sans-serif-condensed"
            android:textAppearance="?android:textAppearanceSmall"/>
    </LinearLayout>
</LinearLayout>

list_item_forecast_today.xml

<!-- Layout for weather forecast list item for today -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:background="@drawable/today_touch_selector"
              android:gravity="center_vertical"
              android:minHeight="?android:attr/listPreferredItemHeight"
              android:orientation="horizontal">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="16dp"
        android:layout_marginLeft="60dp"
        android:layout_marginTop="16dp"
        android:layout_weight="7"
        android:orientation="vertical">

        <TextView
            android:id="@+id/list_item_date_textview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-condensed"
            android:textAppearance="?android:textAppearanceLarge"
            android:textColor="@color/white"/>

        <TextView
            android:id="@+id/list_item_high_textview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-light"
            android:textColor="@color/white"
            android:textSize="72sp"/>

        <TextView
            android:id="@+id/list_item_low_textview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:textColor="@color/white"
            android:textSize="36sp"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="16dp"
        android:layout_weight="5"
        android:gravity="center_horizontal|bottom"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/list_item_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"/>

        <TextView
            android:id="@+id/list_item_forecast_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:fontFamily="sans-serif-condensed"
            android:textAppearance="?android:textAppearanceLarge"
            android:textColor="@color/white"/>
    </LinearLayout>

</LinearLayout>

today_touch_selector-v21.xml

<!--v21-->
<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <ripple android:color="@color/grey"/>
    </item>

    <item android:drawable="@color/sunshine_light_blue"
          android:state_activated="true"/>

    <item android:drawable="@color/sunshine_light_blue"
          android:state_selected="true"/>

    <item android:drawable="@color/sunshine_blue"/>
</selector>

today_touch_selector.xml

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/sunshine_light_blue"
          android:state_pressed="true"/>

    <item android:drawable="@color/sunshine_light_blue"
          android:state_activated="true"/>

    <item android:drawable="@color/sunshine_light_blue"
          android:state_selected="true"/>

    <item android:drawable="@color/sunshine_blue"/>
</selector>