动画 - 过渡动画简单使用 - 《Android 原生知识》

一、单个元素界面跳转

一、单个元素界面跳转

iShot2021-01-11 22.06.10.gif
具体实现：

1. 第一个 Activity ``` class TransitionDemoActivity : BaseActivity(R.layout.activity_transition_demo) {
  
  override fun initData() {
  
  }
  
  override fun initEvent() {
  
  iv_transition_demo_pic.setOnClickListener {
```
   goToDetail(it)
```
  }

}
private fun goToDetail(it: View?) {
    val paris = TransitionHelper.createSafeTransitionParticipants(this,true,
    Pair(it,ResUtils.getString(R.string.transition_demo_pic)),
    Pair(iv_transition_demo_header,ResUtils.getString(R.string.transition_demo_header)),
    Pair(tv_transition_demo_name,ResUtils.getString(R.string.transition_demo_nickname))
    )
    val intent = Intent(this,TransitionDemoDetailActivity::class.java)
    transitionTo(intent,*paris)
}
override fun initInterface() {
}

}

第一个界面布局：

<?xml version=”1.0” encoding=”utf-8”?>

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="测试单个元素跳转"
    android:layout_marginVertical="@dimen/m10"/>

baseactivity 中用到的 transitionTo()

open fun transitionTo(i: Intent?) {
    val pairs: Array<Pair<View, String>> = TransitionHelper.createSafeTransitionParticipants(this,true)
    val transitionActivityOptions: ActivityOptionsCompat =
        ActivityOptionsCompat.makeSceneTransitionAnimation(this, *pairs)
    startActivity(i, transitionActivityOptions.toBundle())
}
open fun transitionTo(i: Intent?,vararg pairs: Pair<View, String>) {
    //val pairs: Array<Pair<View, String>> = TransitionHelper.createSafeTransitionParticipants(this,true)
    val transitionActivityOptions: ActivityOptionsCompat =
        ActivityOptionsCompat.makeSceneTransitionAnimation(this, *pairs)
    startActivity(i, transitionActivityOptions.toBundle())
}


- 2. 详情界面
activity:

class TransitionDemoDetailActivity: BaseActivity(R.layout.activity_transition_demo_detail) { override fun initData() {

}
override fun initIsToolbar(): Boolean {
    return false
}
override fun initEvent() {
    iv_transition_demo_detail_back.setOnClickListener {
        onBackPressed()
    }
}
override fun initInterface() {
    //可以设置动画时间
    window.enterTransition.duration = 500
}

}

xml:

<?xml version=”1.0” encoding=”utf-8”?>

<ImageView
    android:id="@+id/iv_transition_demo_detial_pic"
    android:layout_width="match_parent"
    android:layout_height="@dimen/m300"
    android:src="@mipmap/wuhuang"
    android:scaleType="centerCrop"
    android:transitionName="@string/transition_demo_pic"/>
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="测试过渡元素,详情界面"
    android:layout_marginTop="@dimen/m15"/>


- 3. 用到的关键点 transitionName

<string name="transition_demo_pic">transition_demo_pic</string>
<string name="transition_demo_header">transition_demo_header</string>
<string name="transition_demo_nickname">transition_demo_nickname</string>

<a name="BIpy2"></a>
## 二、列表跳转
![iShot2021-01-11 22.13.18.gif](https://cdn.nlark.com/yuque/0/2021/gif/1624725/1610374551713-0eaedd9d-229b-4627-ae21-77d0a9083484.gif#align=left&display=inline&height=1094&margin=%5Bobject%20Object%5D&name=iShot2021-01-11%2022.13.18.gif&originHeight=1094&originWidth=634&size=4734453&status=done&style=none&width=634)
- 1. activity

class TransitionDemoListActivity: BaseActivity(R.layout.activity_transition_demolist) {

val mAdapter by lazy { TransitionDemoListAdapter() }
override fun initData() {
    val list = arrayListOf<String>("1","1","1","1","1","1","1","1","1","1","1","1","1","1","1")
    mAdapter.setList(list)
}
override fun initEvent() {
}
override fun initInterface() {
    rv_transition_demolist_list?.run {
        layoutManager = GridLayoutManager(this@TransitionDemoListActivity,2)
        adapter = mAdapter
    }
}

}

class TransitionDemoListAdapter : BaseQuickAdapter(R.layout.item_transition_demolist){ override fun convert(holder: BaseViewHolder, item: String) {

    val ivPic = holder.getView<View>(R.id.iv_item_transition_demolist_pic)
    val ivHeader = holder.getView<View>(R.id.iv_item_transition_demolist_header)
    val tvName = holder.getView<View>(R.id.tv_item_transition_demolist_name)
    holder.itemView.setOnClickListener {
        goToDetail(ivPic,ivHeader,tvName)
    }
}
private fun goToDetail(ivPic: View, ivHeader: View, tvName: View) {
    val intent = Intent(context,TransitionDemoDetailActivity::class.java)
    val pairs = TransitionHelper.createSafeTransitionParticipants(
        context as Activity,true,
        Pair(ivPic,ResUtils.getString(R.string.transition_demo_pic)),
        Pair(ivHeader,ResUtils.getString(R.string.transition_demo_header)),
        Pair(tvName,ResUtils.getString(R.string.transition_demo_nickname))
    )
    transitionTo(intent, *pairs)
}
 fun transitionTo(i: Intent?,vararg pairs: Pair<View, String>) {
    //val pairs: Array<Pair<View, String>> = TransitionHelper.createSafeTransitionParticipants(this,true)
    val transitionActivityOptions: ActivityOptionsCompat =
        ActivityOptionsCompat.makeSceneTransitionAnimation(context as Activity, *pairs)
    context.startActivity(i, transitionActivityOptions.toBundle())
}

}


- 2. xml

<?xml version=”1.0” encoding=”utf-8”?>

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/rv_transition_demolist_list"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

详情页同上。
<a name="SNoJL"></a>
## 三、用到的工具类

package com.kiwilss.xview.help

import android.R import android.app.Activity import android.view.View import androidx.core.util.Pair import java.util.*

/**

Helper class for creating content transitions used with [android.app.ActivityOptions]. / internal object TransitionHelper { /*
- Create the transition participants required during a activity transition while
- avoiding glitches with the system UI. *
- @param activity The activity used as start for the transition.
- @param includeStatusBar If false, the status bar will not be added as the transition
- participant.
- @return All transition participants. */ fun createSafeTransitionParticipants( activity: Activity, includeStatusBar: Boolean, vararg otherParticipants: Pair ): Array> { // Avoid system UI glitches as described here: // https://plus.google.com/+AlexLockwood/posts/RPtwZ5nNebb val decor = activity.window.decorView var statusBar: View? = null if (includeStatusBar) {
```
 statusBar = decor.findViewById(R.id.statusBarBackground)
```
  } val navBar =
```
 decor.findViewById<View>(R.id.navigationBarBackground)
```
  // Create pair of transition participants. val participants: MutableList> =
```
 ArrayList(3)
```
  addNonNullViewToTransitionParticipants(statusBar, participants) addNonNullViewToTransitionParticipants(navBar, participants) // only add transition participants if there’s at least one none-null element if (!(otherParticipants.size == 1
```
         && otherParticipants[0] == null)
```
  ) {
```
 participants.addAll(listOf(*otherParticipants))
```
  } return participants.toTypedArray() }
  
  private fun addNonNullViewToTransitionParticipants( view: View?, participants: MutableList> ) { if (view == null) {
```
 return
```
  } participants.add(
```
 Pair(
     view,
     view.transitionName
 )
```
  ) } } ```