溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

Android怎么實(shí)現(xiàn)自定義View仿探探卡片滑動(dòng)效果

發(fā)布時(shí)間:2021-03-10 15:43:10 來源:億速云 閱讀:255 作者:TREX 欄目:移動(dòng)開發(fā)

這篇文章主要講解了“Android怎么實(shí)現(xiàn)自定義View仿探探卡片滑動(dòng)效果”,文中的講解內(nèi)容簡單清晰,易于學(xué)習(xí)與理解,下面請(qǐng)大家跟著小編的思路慢慢深入,一起來研究和學(xué)習(xí)“Android怎么實(shí)現(xiàn)自定義View仿探探卡片滑動(dòng)效果”吧!

Android自定義View仿探探卡片滑動(dòng)這種效果網(wǎng)上有很多人已經(jīng)講解了實(shí)現(xiàn)思路,大多都用的是RecyclerView來實(shí)現(xiàn)的,但是我們今天來換一種實(shí)現(xiàn)思路,只用一個(gè)自定義的ViewGroup來搞定這個(gè)實(shí)現(xiàn)。

下面我們先看一下實(shí)現(xiàn)的效果: 

Android怎么實(shí)現(xiàn)自定義View仿探探卡片滑動(dòng)效果

這個(gè)自定義View用法也很簡單,首先從github上下載或者fork這個(gè)項(xiàng)目,在布局中添加:

<com.liyafeng.view.swipecard.SwipeCardLayout
 android:id="@+id/scl_layout"
 android:layout_width="match_parent"
 android:layout_height="match_parent"/>

是的,沒有一點(diǎn)廢話,自定義屬性可以根據(jù)自己的需求來添加。下面是代碼中初始化:

public class SwipeCardActivity extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_swipe_card);
 SwipeCardLayout scl_layout=(SwipeCardLayout)findViewById(R.id.scl_layout);

 Queue<CardEntity> data = new LinkedList<>();
 CardEntity cardEntity1 = new CardEntity(R.drawable.f1, "這里是美麗的湖畔");
 CardEntity cardEntity2 = new CardEntity(R.drawable.f2, "這里游泳比較好");
 CardEntity cardEntity3 = new CardEntity(R.drawable.f3, "向往的藍(lán)天白云");
 CardEntity cardEntity4 = new CardEntity(R.drawable.f4, "繁華的都市");
 CardEntity cardEntity5 = new CardEntity(R.drawable.f5, "草原象征著理想");
 data.add(cardEntity1);
 data.add(cardEntity2);
 data.add(cardEntity3);
 data.add(cardEntity4);
 data.add(cardEntity5);
 scl_layout.setAdapter(new SwipeCardLayout.CardAdapter<CardEntity>(data) {
  @Override
  public View bindLayout() {
  return LayoutInflater.from(SwipeCardActivity.this).inflate(R.layout.card_layout,null);
  }

  @Override
  public void bindData(CardEntity data, View convertView) {

  ImageView iv_card = (ImageView)convertView.findViewById(R.id.iv_card);
  TextView tv_card = (TextView) convertView.findViewById(R.id.tv_card);
  iv_card.setImageResource(data.resId);
  tv_card.setText(data.content);
  }
 });
 scl_layout.setOnSwipeListener(new SwipeCardLayout.OnSwipeListener() {
  @Override
  public void onSwipe(int type) {
  switch (type) {
   case SwipeCardLayout.TYPE_RIGHT:
   Toast.makeText(SwipeCardActivity.this, "right", Toast.LENGTH_SHORT).show();

   break;
   case SwipeCardLayout.TYPE_LEFT:
   Toast.makeText(SwipeCardActivity.this, "left", Toast.LENGTH_SHORT).show();
   break;
  }
  }
 });
 }

 class CardEntity {

 public CardEntity(int resId, String content) {
  this.resId = resId;
  this.content = content;
 }

 public int resId;
 public String content;
 }
}

這里必須要用一個(gè)隊(duì)列來添加數(shù)據(jù),顯示的順序就是隊(duì)列的順序。完整的代碼已經(jīng)上傳github

接下來簡單說一下實(shí)現(xiàn)原理,我們用兩個(gè)自定義的ViewGroup來定義兩個(gè)Card,一個(gè)在上,一個(gè)在下,且重寫它的onTouchEvent()方法,來實(shí)現(xiàn)跟隨手指來滑動(dòng)。當(dāng)我們松開手指的時(shí)候,如果Card移動(dòng)的距離短,那么就執(zhí)行動(dòng)畫將Card重置到原來位置,如果移動(dòng)的距離比較遠(yuǎn),我們就執(zhí)行動(dòng)畫將Card移出屏幕,當(dāng)動(dòng)畫結(jié)束后,我們將下面的Card通過View的bringToFront()方法移動(dòng)到上層,而剛剛移出屏幕的那個(gè)Card就會(huì)到下層,然后再將它重置到起始位置即可。
這樣我們通過兩個(gè)Card交替來實(shí)現(xiàn)了視圖的復(fù)用,這是這個(gè)控件的核心部分。


感謝各位的閱讀,以上就是“Android怎么實(shí)現(xiàn)自定義View仿探探卡片滑動(dòng)效果”的內(nèi)容了,經(jīng)過本文的學(xué)習(xí)后,相信大家對(duì)Android怎么實(shí)現(xiàn)自定義View仿探探卡片滑動(dòng)效果這一問題有了更深刻的體會(huì),具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是億速云,小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章,歡迎關(guān)注!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI