Android實(shí)現(xiàn)當(dāng)下最流行的吸頂效果

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

創(chuàng)新互聯(lián)專注于洪江企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站建設(shè),商城開(kāi)發(fā)。洪江網(wǎng)站建設(shè)公司,為洪江等地區(qū)提供建站服務(wù)。全流程定制網(wǎng)站，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)

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

Android 實(shí)現(xiàn)當(dāng)下最流行的吸頂效果

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

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

第一步：布局里寫一個(gè)RecyclerView

第二步：實(shí)例化

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

第三步：獲取所需的數(shù)據(jù) (這里我們來(lái)個(gè)真實(shí)點(diǎn)的情景，去聯(lián)網(wǎng)請(qǐng)求數(shù)據(jù))

/**
 * 聯(lián)網(wǎng)請(qǐ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)請(qǐ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生成對(duì)應(yīng)的bean類 
 JSONObject jsonObject = parseObject(json); 
 
 String data = jsonObject.getString("data"); 
 JSONObject dataObj = JSON.parseObject(data); 
 
 String coming = dataObj.getString("coming"); 
 List comingslist = parseArray(coming, WaitMVBean.DataBean.ComingBean.class); 
 
 //測(cè)試是否解析數(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 comingslist; 
 private final Context mContext; 
 private final LayoutInflater mLayoutInflater; 
 public MyRecyclerAdapter(Context mContext, List 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ā)下圖片無(wú)法打開(kāi)是，做個(gè)字符串替換即可 
 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"?>

第五步：一定不能忘！??！

recycleView不僅要設(shè)置適配器還要設(shè)置布局管理者,否則圖片不顯示

GridLayoutManager manager = new GridLayoutManager(this, 1); 
 recyclerView.setLayoutManager(manager);

此時(shí)RecyclerView簡(jiǎn)單的完成效果如下：

Android 實(shí)現(xiàn)當(dāng)下最流行的吸頂效果

下面開(kāi)始做可推動(dòng)的懸浮導(dǎo)航欄：

第一步：首先我們來(lái)寫一個(gè)類，它起標(biāo)記的作用，來(lái)放每一個(gè)item的對(duì)應(yīng)的懸浮欄的字符串

public class NameBean { 
 String name; 
 public String getName() { 
 return name; 
 } 
 public void setName(String name) { 
 this.name = name; 
 } 
}

第二步：自定義一個(gè)SectionDecoration 類繼承 RecyclerView的ItemDecoration

public class SectionDecoration extends RecyclerView.ItemDecoration { 
 private static final String TAG = "SectionDecoration"; 
 private List dataList; 
 private DecorationCallback callback; 
 private TextPaint textPaint; 
 private Paint paint; 
 private int topGap; 
 private int alignBottom; 
 private Paint.FontMetrics fontMetrics; 
 public SectionDecoration(List dataList, Context context, DecorationCallback decorationCallback) { 
 Resources res = context.getResources(); 
 this.dataList = dataList; 
 this.callback = decorationCallback; 
 //設(shè)置懸浮欄的畫筆---paint 
 paint = new Paint(); 
 paint.setColor(res.getColor(R.color.colorGray)); 
 //設(shè)置懸浮欄中文本的畫筆 
 textPaint = new TextPaint(); 
 textPaint.setAntiAlias(true); 
 textPaint.setTextSize(DensityUtil.dip2px(context, 14)); 
 textPaint.setColor(Color.DKGRAY); 
 textPaint.setTextAlign(Paint.Align.LEFT); 
 fontMetrics = new Paint.FontMetrics(); 
 //決定懸浮欄的高度等 
 topGap = res.getDimensionPixelSize(R.dimen.sectioned_top); 
 //決定文本的顯示位置等 
 alignBottom = res.getDimensionPixelSize(R.dimen.sectioned_alignBottom); 
 } 
 @Override 
 public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) { 
 super.getItemOffsets(outRect, view, parent, state); 
 int pos = parent.getChildAdapterPosition(view); 
 Log.i(TAG, "getItemOffsets：" + pos); 
 String groupId = callback.getGroupId(pos); 
 if (groupId.equals("-1")) return; 
 //只有是同一組的第一個(gè)才顯示懸浮欄 
 if (pos == 0 || isFirstInGroup(pos)) { 
 outRect.top = topGap; 
 if (dataList.get(pos).getName() == "") { 
 outRect.top = 0; 
 } 
 } else { 
 outRect.top = 0; 
 } 
 } 
 @Override 
 public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) { 
 super.onDraw(c, parent, state); 
 int left = parent.getPaddingLeft(); 
 int right = parent.getWidth() - parent.getPaddingRight(); 
 int childCount = parent.getChildCount(); 
 for (int i = 0; i < childCount; i++) { 
 View view = parent.getChildAt(i); 
 int position = parent.getChildAdapterPosition(view); 
 String groupId = callback.getGroupId(position); 
 if (groupId.equals("-1")) return; 
 String textLine = callback.getGroupFirstLine(position).toUpperCase(); 
 if (textLine == "") { 
 float top = view.getTop(); 
 float bottom = view.getTop(); 
 c.drawRect(left, top, right, bottom, paint); 
 return; 
 } else { 
 if (position == 0 || isFirstInGroup(position)) { 
  float top = view.getTop() - topGap; 
  float bottom = view.getTop(); 
  //繪制懸浮欄 
  c.drawRect(left, top - topGap, right, bottom, paint); 
  //繪制文本 
  c.drawText(textLine, left, bottom, textPaint); 
 } 
 } 
 } 
 } 
 @Override 
 public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) { 
 super.onDrawOver(c, parent, state); 
 int itemCount = state.getItemCount(); 
 int childCount = parent.getChildCount(); 
 int left = parent.getPaddingLeft(); 
 int right = parent.getWidth() - parent.getPaddingRight(); 
 float lineHeight = textPaint.getTextSize() + fontMetrics.descent; 
 String preGroupId = ""; 
 String groupId = "-1"; 
 for (int i = 0; i < childCount; i++) { 
 View view = parent.getChildAt(i); 
 int position = parent.getChildAdapterPosition(view); 
 preGroupId = groupId; 
 groupId = callback.getGroupId(position); 
 if (groupId.equals("-1") || groupId.equals(preGroupId)) continue; 
 String textLine = callback.getGroupFirstLine(position).toUpperCase(); 
 if (TextUtils.isEmpty(textLine)) continue; 
 int viewBottom = view.getBottom(); 
 float textY = Math.max(topGap, view.getTop()); 
 //下一個(gè)和當(dāng)前不一樣移動(dòng)當(dāng)前 
 if (position + 1 < itemCount) { 
 String nextGroupId = callback.getGroupId(position + 1); 
 //組內(nèi)最后一個(gè)view進(jìn)入了header 
 if (nextGroupId != groupId && viewBottom < textY) { 
  textY = viewBottom; 
 } 
 } 
 //textY - topGap決定了懸浮欄繪制的高度和位置 
 c.drawRect(left, textY - topGap, right, textY, paint); 
 //left+2*alignBottom 決定了文本往左偏移的多少（加-->向左移） 
 //textY-alignBottom 決定了文本往右偏移的多少 (減-->向上移) 
 c.drawText(textLine, left + 2 * alignBottom, textY - alignBottom, textPaint); 
 } 
 } 
 /**
 * 判斷是不是組中的第一個(gè)位置
 *
 * @param pos
 * @return
 */ 
 private boolean isFirstInGroup(int pos) { 
 if (pos == 0) { 
 return true; 
 } else { 
 // 因?yàn)槭歉鶕?jù) 字符串內(nèi)容的相同與否 來(lái)判斷是不是同意組的，所以此處的標(biāo)記id 要是String類型 
 // 如果你只是做聯(lián)系人列表，懸浮框里顯示的只是一個(gè)字母，則標(biāo)記id直接用 int 類型就行了 
 String prevGroupId = callback.getGroupId(pos - 1); 
 String groupId = callback.getGroupId(pos); 
 //判斷前一個(gè)字符串 與 當(dāng)前字符串 是否相同 
 if (prevGroupId.equals(groupId)) { 
 return false; 
 } else { 
 return true; 
 } 
 } 
 } 
 //定義一個(gè)借口方便外界的調(diào)用 
 interface DecorationCallback { 
 String getGroupId(int position); 
 String getGroupFirstLine(int position); 
 } 
}

第三步：在向list集合中先把每一個(gè)item的起“標(biāo)記”作用的字符串都加進(jìn)去

setPullAction(comingslist);

private void setPullAction(List comingslist) { 
 dataList = new ArrayList<>(); 
 for (int i = 0; i < comingslist.size(); i++) { 
 NameBean nameBean = new NameBean(); 
 String name0 = comingslist.get(i).getComingTitle(); 
 nameBean.setName(name0); 
 dataList.add(nameBean); 
 } 
 }

第四步：在setAdapter() 前，為RecyclerView添加ItemDecoration:

recyclerView.addItemDecoration(new SectionDecoration(dataList,mContext, new SectionDecoration.DecorationCallback() { 
 //返回標(biāo)記id (即每一項(xiàng)對(duì)應(yīng)的標(biāo)志性的字符串) 
 @Override 
 public String getGroupId(int position) { 
  if(dataList.get(position).getName()!=null) { 
  return dataList.get(position).getName(); 
  } 
  return "-1"; 
 } 
  //獲取同組中的第一個(gè)內(nèi)容 
 @Override 
 public String getGroupFirstLine(int position) { 
  if(dataList.get(position).getName()!=null) { 
  return dataList.get(position).getName(); 
  } 
  return ""; 
 } 
 }));

這樣就完成了~

再看一眼最終效果感受一下：

Android 實(shí)現(xiàn)當(dāng)下最流行的吸頂效果

以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持創(chuàng)新互聯(lián)！

網(wǎng)頁(yè)標(biāo)題：Android實(shí)現(xiàn)當(dāng)下最流行的吸頂效果
瀏覽路徑：http://weahome.cn/article/ippjgo.html

真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

Android實(shí)現(xiàn)當(dāng)下最流行的吸頂效果

其他資訊

網(wǎng)站制作

企業(yè)服務(wù)

網(wǎng)站建設(shè)

服務(wù)器托管