最近參加了一個小比賽，選了天氣預報APP這個題目，最初選擇它，是想練練網路資料獲取和資料解析方面的知識，後來發現倒是學到了不少介面的東西。下面我來一步步講解一下我是怎麼完成的吧~
首先，天氣預報最直觀的部分應該就是天氣顯示介面了，這裡，我想做成可以有上下滑動的效果的介面，因此我使用了RecyclerView控制元件，它的使用方式為：
1.首先在自己的專案中新增依賴（Android Studio）
file–>project structure–>找到相應的專案–>dependencies–>”+”–>找到recyclerview–>點選OK即可。

2.建立xml佈局 layout_main.xml，在佈局中使用RecyclerView控制元件即可。
layout_main.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.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width
 
="match_parent"
        android:layout_height="match_parent"
        android:background="#0000">

</FrameLayout>

3.設定好了佈局後，下面就可以去MainActivity.java檔案中去操作它了。

//1. 獲取控制元件
RecyclerView mRecyclerView = view.findViewById(R.id.recyclerView);
//2. 設定控制元件中item的排列方向 
LinearLayoutManager layoutManager = new LinearLayoutManager(MainActivity.this
 
);
//設定為垂直排列，即上下排列
layoutManager.setOrientation(OrientationHelper.VERTICAL);

4.獲取了recyclerview之後，我們需要知道，我們之所以選擇一個可滑動的控制元件，就是想讓它能夠完成滑動效果，因此在該控制元件內，我又寫了兩個佈局來填充該控制元件。分別是content_weather_info.xml和content_life_info.xml

content_weather_info.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="match_parent"
    android:orientation="vertical">

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

        <TextView
            android:id="@+id/temperature"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="3"
            android:gravity="center|bottom"
            android:textColor="@color/textColor"
            android:textSize="100sp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2"
            android:orientation="horizontal"
            android:gravity="center|top">

            <TextView
                android:id="@+id/weatherType"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/textColor"
                android:textSize="25sp"
                android:layout_marginEnd="10dp"
                android:layout_marginTop="7dp"/>

            <TextView
                android:layout_width="2dp"
                android:layout_height="30dp"
                android:background="@color/textColor" />

            <TextView
                android:id="@+id/quality"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/textColor"
                android:textSize="25sp"
                android:layout_marginStart="10dp"
                android:layout_marginTop="7dp"/>
        </LinearLayout>
    </LinearLayout>

    <ListView
        android:id="@+id/weather_list"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3"
        android:divider="@null"
        android:fastScrollEnabled="false"/>



</LinearLayout>

content_life_info.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="match_parent">

    <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:numColumns="4"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="10dp">

    </GridView>

    <TextView
        android:id="@+id/tv_tips"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/tips"
        android:layout_margin="10dp"
        android:textSize="15sp"
        android:typeface="serif"
        android:textColor="@color/textColor"
        android:layout_marginStart="10dp"
        android:layout_below="@id/gridView"/>

    <ListView
        android:id="@+id/list_life_info"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentBottom="true"
        android:layout_below="@id/tv_tips">

    </ListView>


</RelativeLayout>

5.接下來我們需要為recyclerview設定介面卡。

/**
 * Created by zhaoxin on 17/9/1.
 * recyclerView的介面卡
 */
public class MyRecyclerAdapter extends RecyclerView.Adapter {

    //上下文
    private Context mContext;
    //載入佈局的物件
    private LayoutInflater mInflater;
    //兩個常量分別代表recyclerView中新增的佈局
    private static final int CONTENT_WEATHER_INFO = 1;
    private static final int CONTENT_LIFE_INFO = 2;

    //通過構造器初始化成員變數
    public MyRecyclerAdapter(Context context) {
        this.context = context;
    }

    /**
     * 建立ViewHolder,如果有多個不同的佈局，需要與getItemViewType配合使用
     */
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

        //通過判斷view的型別建立不同的viewHolder
        if (viewType == CONTENT_WEATHER_INFO) {

            return new MyContentWeatherInfo(mInflater.inflate(R.layout.content_weather_info, parent, false));

        } else {
            return new MyContentLifeInfo(mInflater.inflate(R.layout.content_life_info, parent, false));
        }
    }

    /**
     * 用來判斷當前的view是哪一個佈局
     */
    @Override
    public int getItemViewType(int position) {
        return position == 0 ? CONTENT_WEATHER_INFO : CONTENT_LIFE_INFO;
    }


    /**
     * 繫結每一個ViewHolder，併為其包含的控制元件設定資料
     */
    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {

    }

    /**
     * 顯示佈局的個數
     */
    @Override
    public int getItemCount() {
        return 2;
    }


    private class MyContentWeatherInfo extends RecyclerView.ViewHolder {
        private TextView mTvTemperature;
        private TextView mTvWeatherType;
        private TextView mTvQuality;
        private ListView mWeatherList;

        MyContentWeatherInfo(View itemView) {
            super(itemView);
            mTvTemperature = itemView.findViewById(R.id.temperature);
            mTvWeatherType = itemView.findViewById(R.id.weatherType);
            mTvQuality = itemView.findViewById(R.id.quality);
            mWeatherList = itemView.findViewById(R.id.weather_list);


        }
    }

    private class MyContentLifeInfo extends RecyclerView.ViewHolder {
        private GridView mGridView;
        private ListView mListView;

        MyContentLifeInfo(View itemView) {
            super(itemView);
            mGridView = itemView.findViewById(R.id.gridView);
            mListView = itemView.findViewById(R.id.list_life_info);
        }
    }
}

然後在MainActivity.java檔案中將建立的介面卡設定到recyclerview的控制元件上即可。

MyRecyclerAdapter mMyRecyclerAdapter = new MyRecyclerAdapter(MainActivity.this); mRecyclerView.setLayoutManager(layoutManager);
mRecyclerView.setAdapter(mMyRecyclerAdapter);

至此，天氣顯示介面就可以實現上下滑動的效果了。