Android Developers:2つのビューのグラデーション
4761 ワード
フェードインフェードアウトアニメーション(グラデーションとも呼ばれる)は、UIコンポーネントをフェードアウトしながら、別のUIコンポーネントをフェードアウトします.このアニメーションは、アプリケーションでコンテンツやビューを切り替えたい場合に役立ちます.フェードアウトは微妙で短いですが、1つの画面から次の画面へのスムーズな移行をサポートします.それらを使用しないときは、移行は常に硬く、急いでいると感じます.
次は、進捗インジケータからテキストコンテンツのグラデーションの例です.
完全な作業例をスキップして表示したい場合は、このインスタンスアプリケーションをダウンロードして実行し、グラデーション例を選択します.次のファイルのコード実装を表示します.
src/CrossfadeActivity.java
layout/activity_crossfade.xml
menu/activity_crossfade.xml
ビューの作成
————————————————————————————————————————————-------------------------------------------------------——
グラデーションしたいビューを2つ作成します.次の例では、プロシージャインジケータとスライドテキストビューを作成します.
アニメーションの設定
——————————————————————————————————————————————————————————————————————
アニメーションを設定するには:
グラデーションしたいビューのメンバー変数を作成します.後でアニメーション中にビューを変更するときにこれらの参照が必要です.
フェードアウトしたビューの可視性をGONEに設定します.ビューがレイアウトコントロールを占有することを阻止し、レイアウト計算で無視し、処理時間を短縮します.
メンバー変数にconfig_をキャッシュするshortAnimTimeシステムのプロパティ.このアトリビュートは、標準の[短い](Short)アニメーションの期間を設定します.この時間は微妙なアニメーションやよく起こるアニメーションに理想的です.使いたいならconfig_longAnimTimeとconfig_mediumAnimTimeも有効です.
次の例では、Activityのコンテンツビューとして前のコードブロックのレイアウトを使用します.
フェードアウトビュー
——————————————————————————————————————————————————--------------———————————
この試みは正しい設定であり、次の操作を実行することで漸入漸出します.
グラデーションビューでは、0から可視VISIBLEまでの透明度値を設定.(GONEに初期化されたことを覚えておいてください)このビューは表示されますが、完全に透明です.
グラデーションビューでは、透明な値を0から1にプッシュします.このとき、このグラデーションビューに対して、透明値を1から0に押す.
アニメイトでAnimatorListenerでnonAnimationEnd()メソッドを使用して、GONEにフェードアウトされたビューの可視性を設定します.Alpha値が0の場合でも、このビューの可視性をGONEに設定すると、ビューがレイアウトスペースを占有するのを阻止し、レイアウト計算機で無視して処理を高速化します.
次の方法では、これを実行する方法の例を示します.
次は、進捗インジケータからテキストコンテンツのグラデーションの例です.
完全な作業例をスキップして表示したい場合は、このインスタンスアプリケーションをダウンロードして実行し、グラデーション例を選択します.次のファイルのコード実装を表示します.
src/CrossfadeActivity.java
layout/activity_crossfade.xml
menu/activity_crossfade.xml
ビューの作成
————————————————————————————————————————————-------------------------------------------------------——
グラデーションしたいビューを2つ作成します.次の例では、プロシージャインジケータとスライドテキストビューを作成します.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
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" />
</FrameLayout>
アニメーションの設定
——————————————————————————————————————————————————————————————————————
アニメーションを設定するには:
グラデーションしたいビューのメンバー変数を作成します.後でアニメーション中にビューを変更するときにこれらの参照が必要です.
フェードアウトしたビューの可視性をGONEに設定します.ビューがレイアウトコントロールを占有することを阻止し、レイアウト計算で無視し、処理時間を短縮します.
メンバー変数にconfig_をキャッシュするshortAnimTimeシステムのプロパティ.このアトリビュートは、標準の[短い](Short)アニメーションの期間を設定します.この時間は微妙なアニメーションやよく起こるアニメーションに理想的です.使いたいならconfig_longAnimTimeとconfig_mediumAnimTimeも有効です.
次の例では、Activityのコンテンツビューとして前のコードブロックのレイアウトを使用します.
public class CrossfadeActivity extends Activity {
private View mContentView;
private View mLoadingView;
private int mShortAnimationDuration;
...
@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);
// Initially hide the content view.
mContentView.setVisibility(View.GONE);
// Retrieve and cache the system's default "short" animation time.
mShortAnimationDuration = getResources().getInteger(
android.R.integer.config_shortAnimTime);
}
フェードアウトビュー
——————————————————————————————————————————————————--------------———————————
この試みは正しい設定であり、次の操作を実行することで漸入漸出します.
グラデーションビューでは、0から可視VISIBLEまでの透明度値を設定.(GONEに初期化されたことを覚えておいてください)このビューは表示されますが、完全に透明です.
グラデーションビューでは、透明な値を0から1にプッシュします.このとき、このグラデーションビューに対して、透明値を1から0に押す.
アニメイトでAnimatorListenerでnonAnimationEnd()メソッドを使用して、GONEにフェードアウトされたビューの可視性を設定します.Alpha値が0の場合でも、このビューの可視性をGONEに設定すると、ビューがレイアウトスペースを占有するのを阻止し、レイアウト計算機で無視して処理を高速化します.
次の方法では、これを実行する方法の例を示します.
private View mContentView;
private View mLoadingView;
private int mShortAnimationDuration;
...
private void crossfade() {
// Set the content view to 0% opacity but visible, so that it is visible
// (but fully transparent) during the animation.
mContentView.setAlpha(0f);
mContentView.setVisibility(View.VISIBLE);
// Animate the content view to 100% opacity, and clear any animation
// listener set on the view.
mContentView.animate()
.alpha(1f)
.setDuration(mShortAnimationDuration)
.setListener(null);
// Animate the loading view to 0% opacity. After the animation ends,
// set its visibility to GONE as an optimization step (it won't
// participate in layout passes, etc.)
mHideView.animate()
.alpha(0f)
.setDuration(mShortAnimationDuration)
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
mHideView.setVisibility(View.GONE);
}
});
}