LoginSignup
7
8

More than 5 years have passed since last update.

画面遷移時のアニメーション設定

Posted at

最近投稿頻度が多めです。
新しいことを覚えたので早速記事にしたいと思います。

画面遷移時のアニメーション設定

について解説していこうと思います。
本来Activityを切り替えると下から別Activityが出てきますが、右から左に画面が出てくるように変更したいと思い色々調べてできたので記事にしました。
イメージは下記のURLからみることができます。
https://media.giphy.com/media/wJ63LgRpC4zDxst0SN/giphy.gif
github
https://github.com/minton0721/SlideProject
こちらをダウンロードすることで実際の挙動を確認することができると思います。

STEP1 Styles.xmlの編集

styles.xml
<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
        <!-- styleが適用されたtheme -->
    <style name="Animation" parent="AppTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
        <item name="android:windowAnimationStyle">@style/AnimationActivity</item>
    </style>
    <!-- Activityをアニメーションさせるためのstyle -->
    <style name="AnimationActivity" parent="android:Animation.Activity">
        <item name="android:activityOpenEnterAnimation">@anim/open_enter</item>
        <item name="android:activityOpenExitAnimation">@anim/open_exit</item>
        <item name="android:activityCloseEnterAnimation">@anim/close_enter</item>
        <item name="android:activityCloseExitAnimation">@anim/close_exit</item>
    </style>

ActivityのアニメーションはwindowAnimationStyle要素なので、追記して行きます。
OpenEnterとOpenExitがActivity表示時、CloseExitとCloseEnterがActivity消失時。
それぞれに今のActivityと次のActivityがあるので合計4つ指定することになります。

STEP2 4つのファイルを作る

先ほどの状態のままですと、指定したファイルがないのでエラーが発生してしまいます。
animをいうディレクトリを作りそこに4つのファイルを作ります。

anim/open_enter.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="100%"
        android:toXDelta="0%"
        android:duration="300"
        android:fillAfter="true"
        android:fillEnabled="true"/>
</set>
anim/open_exit.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0%"
        android:toXDelta="-100%"
        android:duration="300"
        android:fillAfter="true"
        android:fillEnabled="true"/>
</set>
anim/close_enter.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="-100%"
        android:toXDelta="0%"
        android:duration="300"
        android:fillAfter="true"
        android:fillEnabled="true"/>
</set>
anim/close_exit.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0%"
        android:toXDelta="100%"
        android:duration="300"
        android:fillAfter="true"
        android:fillEnabled="true"/>
</set>

STEP3 manifests.xmlの編集

manifests.xml
<application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Animation"> <!-- ←ここの部分をThemeからAnimationに変更 -->

Activityの切り替えの方法を変えるだけならこの通りにやればできるはず!
参考URL
http://furudate.hatenablog.com/entry/2013/06/12/214126

とっても参考になりました。
ありがとうございます!!

7
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
8