安卓當(dāng)下最流行的吸頂效果的實現(xiàn)(上)
開始逐漸領(lǐng)略到ItemDecoration的美~
今天讓我 使用 ItemDecoration 來完成 可推動的懸浮導(dǎo)航欄的效果,最終實現(xiàn)的效果如下圖:
具體實現(xiàn)步驟如下:
根據(jù)我前面的文章所講的RecyclerView的基本使用,我們先來完成基本的recyclerView:
第一步:布局里寫一個RecyclerView
第二步:實例化
- recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
第三步:獲取所需的數(shù)據(jù) (這里我們來個真實點(diǎn)的情景,去聯(lián)網(wǎng)請求數(shù)據(jù))
- /**
- * 聯(lián)網(wǎng)請求所需的url
- */
- public String url="http://api.meituan.com/mmdb/movie/v2/list/rt/order/coming.json?ci=1&limit=12&token=&__vhost=api.maoyan.com&utm_campaign=AmovieBmovieCD-1&movieBundleVersion=6801&utm_source=xiaomi&utm_medium=android&utm_term=6.8.0&utm_content=868030022327462&net=255&dModel=MI%205&uuid=0894DE03C76F6045D55977B6D4E32B7F3C6AAB02F9CEA042987B380EC5687C43&lat=40.100673&lng=116.378619&__skck=6a375bce8c66a0dc293860dfa83833ef&__skts=1463704714271&__skua=7e01cf8dd30a179800a7a93979b430b2&__skno=1a0b4a9b-44ec-42fc-b110-ead68bcc2824&__skcy=sXcDKbGi20CGXQPPZvhCU3%2FkzdE%3D";
- //聯(lián)網(wǎng)獲取數(shù)據(jù)
- getDataFromNet();
- /**
- * 使用okhttpUtils進(jìn)行聯(lián)網(wǎng)請求數(shù)據(jù)
- */
- private void getDataFromNet() {
- OkHttpUtils.
- get()
- .url(url)
- .build()
- .execute(new StringCallback() {
- @Override
- public void onError(okhttp3.Call call, Exception e, int id) {
- Log.e("TAG", "聯(lián)網(wǎng)失敗" + e.getMessage());
- }
- @Override
- public void onResponse(String response, int id) {
- Log.e("TAG", "聯(lián)網(wǎng)成功==" + response);
- //聯(lián)網(wǎng)成功后使用fastjson解析
- processData(response);
- }
- });
- }
- /**
- * 使用fastjson進(jìn)行解析
- *
- * @param json
- */
- private void processData(String json) {
- //這里使用GsonFormat生成對應(yīng)的bean類
- JSONObject jsonObject = parseObject(json);
- String data = jsonObject.getString("data");
- JSONObject dataObj = JSON.parseObject(data);
- String coming = dataObj.getString("coming");
- List<WaitMVBean.DataBean.ComingBean> comingslist = parseArray(coming, WaitMVBean.DataBean.ComingBean.class);
- //測試是否解析數(shù)據(jù)成功
- // String strTest = comingslist.get(0).getCat();
- // Log.e("TAG", strTest + "222");
- //解析數(shù)據(jù)成功,設(shè)置適配器-->
- }
- }
第四步:解析數(shù)據(jù)成功后,創(chuàng)建并設(shè)置適配器,并傳遞相關(guān)數(shù)據(jù)
- //解析數(shù)據(jù)成功,設(shè)置適配器
- MyRecyclerAdapter adapter = new MyRecyclerAdapter( mContext,comingslist);
- recyclerView.setAdapter(adapter);
適配器:
- public class MyRecyclerAdapter extends RecyclerView.Adapter {
- private final List<WaitMVBean.DataBean.ComingBean> comingslist;
- private final Context mContext;
- private final LayoutInflater mLayoutInflater;
- public MyRecyclerAdapter(Context mContext, List<WaitMVBean.DataBean.ComingBean> comingslist) {
- this.mContext = mContext;
- this.comingslist = comingslist;
- mLayoutInflater = LayoutInflater.from(mContext);
- }
- @Override
- public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
- return new MyViewHolder(mLayoutInflater.inflate(R.layout.date_item, null));
- }
- @Override
- public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
- MyViewHolder myholder = (MyViewHolder) holder;
- myholder.setData(position);
- }
- @Override
- public int getItemCount() {
- return comingslist.size();
- }
- class MyViewHolder extends RecyclerView.ViewHolder {
- private TextView mv_name;
- private TextView mv_dec;
- private TextView mv_date;
- private ImageView imageView;
- public MyViewHolder(View itemView) {
- super(itemView);
- mv_name = (TextView) itemView.findViewById(R.id.mv_name);
- mv_dec = (TextView) itemView.findViewById(R.id.mv_dec);
- mv_date = (TextView) itemView.findViewById(R.id.mv_date);
- imageView = (ImageView) itemView.findViewById(R.id.image);
- }
- public void setData(int position) {
- WaitMVBean.DataBean.ComingBean coming = comingslist.get(position);
- String name = coming.getNm();
- mv_name.setText(name);
- String date = coming.getShowInfo();
- mv_date.setText(date);
- String dec = coming.getScm();
- mv_dec.setText(dec);
- //注:當(dāng)你發(fā)下圖片無法打開是,做個字符串替換即可
- String imagUrl = coming.getImg();
- String newImagUrl = imagUrl.replaceAll("w.h", "50.80");
- //使用Glide加載圖片
- Glide.with(mContext)
- .load(newImagUrl)
- .into(imageView);
- }
- }
- }
item的布局:
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:background="#ffffff"
- android:gravity="center_vertical"
- android:orientation="horizontal">
- <ImageView
- android:id="@+id/image"
- android:layout_width="70dp"
- android:layout_height="110dp"
- android:layout_marginBottom="5dp"
- android:layout_marginLeft="10dp"
- android:layout_marginRight="8dp"
- android:layout_marginTop="5dp" />
- <LinearLayout
- android:layout_width="0dp"
- android:layout_height="wrap_content"
- android:layout_marginLeft="6dp"
- android:layout_weight="1"
- android:orientation="vertical">
- <TextView
- android:id="@+id/mv_name"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="神奇動物在哪裏"
- android:textColor="#000000"
- android:textSize="15sp" />
- <LinearLayout
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:orientation="horizontal">
- <TextView
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="觀眾"
- android:textColor="#55000000"
- android:textSize="14sp" />
- <TextView
- android:id="@+id/tv_people"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="9.0 "
- android:textColor="#FFCE42"
- android:textSize="18sp" />
- <TextView
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text=" | 專業(yè)"
- android:textColor="#55000000"
- android:textSize="14sp" />
- <TextView
- android:id="@+id/tv_professional"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="6.7"
- android:textColor="#FFCE42"
- android:textSize="18sp" />
- </LinearLayout>
- <TextView
- android:id="@+id/mv_dec"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_marginTop="8dp"
- android:text="神奇動物城,法師顯超能"
- android:textColor="#99000000"
- android:textSize="11sp" />
- <TextView
- android:id="@+id/mv_date"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_marginTop="10dp"
- android:text="今天165家影院放映2088場"
- android:textColor="#99000000"
- android:textSize="11sp" />
- </LinearLayout>
- </LinearLayout>
第五步:一定不能忘!!!
recycleView不僅要設(shè)置適配器還要設(shè)置布局管理者,否則圖片不顯示
- GridLayoutManager manager = new GridLayoutManager(this, 1);
- recyclerView.setLayoutManager(manager);
此時RecyclerView簡單的完成效果如下:
下面開始做 可推動的 懸浮導(dǎo)航欄:
接下文