新建一个title.xml作为头布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<Button
android:id="@+id/nav_button"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="10dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
/>
<TextView
android:id="@+id/title_city"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textSize="20sp"
android:textColor="#fff"
android:layout_centerInParent="true"/>
<TextView
android:id="@+id/title_update_time"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerVertical="true"
android:textSize="16sp"
android:textColor="#fff"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"/>
</RelativeLayout>
然后新建一个now.xml当前天气信息布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_margin="15dp" >
<TextView
android:id="@+id/degree_text"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textSize="60sp"
android:textColor="#fff"
android:layout_gravity="end" />
<TextView
android:id="@+id/weather_info_text"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textSize="20sp"
android:textColor="#fff"
android:layout_gravity="end" />
</LinearLayout>
然后新建forecast.xml作为未来几天天气信息的布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="vertical"
android:background="#8000"
android:layout_margin="15dp" >
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginLeft="15dp"
android:textSize="20sp"
android:textColor="#fff"
android:text="预报" />
<LinearLayout
android:id="@+id/forecast_layout"
android:orientation="vertical"
android:layout_height="wrap_content"
android:layout_width="match_parent" >
</LinearLayout>
</LinearLayout>
然后需要定义一个未来天气信息的子项布局forecast_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_margin="15dp"
android:layout_height="wrap_content"
android:layout_width="match_parent" >
<TextView
android:id="@+id/date_text"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:textColor="#fff" android:layout_weight="2"
android:layout_gravity="center_vertical" />
<TextView
android:id="@+id/info_text"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:textColor="#fff"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:gravity="center"/>
<TextView
android:id="@+id/max_text"
android:layout_height="wrap_content"
android:layout_width="0dp" android:textColor="#fff"
android:layout_weight="1"
android:layout_gravity="center"
android:gravity="right"/>
<TextView
android:id="@+id/min_text"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:textColor="#fff"
android:layout_weight="1"
android:layout_gravity="center"
android:gravity="right"/>
</LinearLayout>
然后新建aqi.xml作为空气质量的布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="vertical"
android:background="#8000"
android:layout_margin="15dp">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginLeft="15dp"
android:textSize="20sp"
android:textColor="#fff"
android:text="空气质量" />
<LinearLayout
android:layout_margin="15dp"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_centerInParent="true">
<TextView
android:id="@+id/aqi_text"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textSize="40sp"
android:textColor="#fff"
android:layout_gravity="center" />
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:textColor="#fff"
android:text="AQI指数" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_centerInParent="true">
<TextView
android:id="@+id/pm25_text"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:textSize="40sp"
android:textColor="#fff"/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:textColor="#fff"
android:text="PM2.5指数"/>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
然后新建suggestion.xml作为生活建议的布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_margin="15dp"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="vertical"
android:background="#8000" >
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginLeft="15dp"
android:textSize="20sp"
android:textColor="#fff" android:text="生活建议" />
<TextView
android:id="@+id/comfort_text"
android:layout_margin="15dp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textColor="#fff" />
<TextView
android:id="@+id/car_wash_text"
android:layout_margin="15dp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textColor="#fff"/>
<TextView
android:id="@+id/sport_text"
android:layout_margin="15dp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textColor="#fff" />
</LinearLayout>
最后我们需要把它引入到activity_weather.xml中
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/bing_pic_img"
android:scaleType="centerCrop"
/>
<android.support.v4.widget.DrawerLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/drwaer_layout"
>
<android.support.v4.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/swipe_refresh"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/weather_layout"
android:scrollbars="none"
android:overScrollMode="never"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
>
<include layout="@layout/title"/>
<include layout="@layout/now"/>
<include layout="@layout/forecast"/>
<include layout="@layout/aqi"/>
<include layout="@layout/suggestion"/>
</LinearLayout>
</ScrollView>
</android.support.v4.widget.SwipeRefreshLayout>
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/choose_area_fragment"
android:name="com.example.dong.myapplication.ChooseAreaFragment"
android:layout_gravity="start"
/>
</android.support.v4.widget.DrawerLayout>
</FrameLayout>