安卓當(dāng)下最流行的吸頂效果的實現(xiàn)（上）

作者：佚名 2017-01-13 11:10:41

移動開發(fā) Android

今天讓我使用ItemDecoration來完成可推動的懸浮導(dǎo)航欄的效果。

開始逐漸領(lǐng)略到ItemDecoration的美~

今天讓我使用 ItemDecoration 來完成可推動的懸浮導(dǎo)航欄的效果，最終實現(xiàn)的效果如下圖：

具體實現(xiàn)步驟如下：

根據(jù)我前面的文章所講的RecyclerView的基本使用，我們先來完成基本的recyclerView：

第一步：布局里寫一個RecyclerView

第二步：實例化

recyclerView = (RecyclerView) findViewById(R.id.recyclerView);

第三步：獲取所需的數(shù)據(jù) (這里我們來個真實點的情景，去聯(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進行聯(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進行解析 
     * 
     * @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)航欄：

接下文

責(zé)任編輯：龐桂玉來源：安卓開發(fā)精選

Android 吸頂效果開發(fā)