漸變動畫(也叫消失)通常指漸漸的淡出某個UI組件,同時同步地淡入另一個。當App想切換內容或View的情況下,這種動畫很有用。漸變簡短不易察覺,同時又提供從一個界面到下一個之間流暢的轉換。如果在需要轉換的時候沒有使用任何動畫效果,這會使得轉換看上去感到生硬而倉促。在這裏我詳細的講解具體實現,並附上源代碼。
這個實例實際上設計三個文件layout/activity_crossfade.xml、menu/activity_crossfade.xml、MainActivity
現在我附上三個文件的源碼,在註釋中講解功能
layout/activity_crossfade.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView style="?android:textAppearanceMedium"
android:lineSpacingMultiplier="1.2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/lorem_ipsum"
android:padding="16dp"/>
</ScrollView>
<ProgressBar
android:id="@+id/loading_spinner"
style="?android:progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
<!--android:textAppearanceMedium以及?android:progressBarStyleLarge均爲android相關的
內置樣式,具體參見android官方參考手冊-->
</FrameLayout>
menu/activity_crossfade.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="@+id/animation"
android:title="@string/action_animation"
app:showAsAction="ifRoom"/>
</menu>
MainActivity.java
package com.example.power.mytest;
import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import java.util.zip.Inflater;
public class MainActivity extends AppCompatActivity {
private View mContentView;
private View mLoadingView;
private int mShortAnimationDuration;
/*我們先定義兩個View,一個int,其中mShortAnimationDuration用於保存
* 動畫的持續時間,時間我們定爲android內置的值config_shortAnimTime,
* 這個屬性爲動畫定義了一個標準的“短”持續時間。對於細微或者快速發
* 生的動畫,這是個很理想的持續時段。也可以根據實際需求使用
* config_longAnimTime或config_mediumAnimTime。*/
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_crossfade);
mContentView = findViewById(R.id.content);
mLoadingView = findViewById(R.id.loading_spinner);
mContentView.setVisibility(View.GONE);
/*首先設置TextView的可見性爲View.GONE,這樣防止view再佔
據佈局的空間,而且也能在佈局計算中將其忽略,加速處理過程。*/
mShortAnimationDuration = getResources().getInteger(
android.R.integer.config_shortAnimTime
);
crossfade();
}
private void crossfade(){
mContentView.setAlpha(0f);
mContentView.setVisibility(View.VISIBLE);
/*以上兩步之後,TextView已經可見,並佔據了佈局空間,只是被
* 設置爲透明*/
/*在mShortAnimationDuration時間內,TextView從0f變到1f*/
mContentView.animate()
.alpha(1f)
.setDuration(mShortAnimationDuration)
.setListener(null);
/*在mShortAnimationDuration時間內,ProgressBar從1f變到0f,但
* 可能因爲時間較短,progressbar還未來得及看清楚就已經消失,
* 注意需要將Progressbar設置爲View.GONE,以不佔據佈局空間*/
mLoadingView.animate()
.alpha(0f)
.setDuration(mShortAnimationDuration)
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
mLoadingView.setVisibility(View.GONE);
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater menuInflater = getMenuInflater();
menuInflater.inflate(R.menu.activity_crossfade, menu);
return super.onCreateOptionsMenu(menu);
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
case R.id.animation:
crossfade();
return true;
default:
return super.onOptionsItemSelected(item);
}
}
}
只需將上述源碼黏貼與相應文件即可,查看具體效果,相關細節慢慢體會。