移動先の位置から移動するプログラム

4つのボタン（うえ、した、ひだり、みぎ）を押したら猫の画像が一定の距離を移動するアニメーションをつけました。開始の位置が常に一定のため、最初の位置からの移動しかできません。移動先の場所からさらに移動させるプログラムをつけたいです。

MainActivity.java

java
1public class MainActivity extends AppCompatActivity {
2
3    private ImageView imageView;
4    private TranslateAnimation translateAnimation;
5    private TranslateAnimation translateAnimation2;
6    private TranslateAnimation translateAnimation3;
7    private TranslateAnimation translateAnimation4;
8
9
10
11    @Override
12    protected void onCreate(Bundle savedInstanceState) {
13        super.onCreate(savedInstanceState);
14        setContentView(R.layout.activity_main);
15
16        imageView = (ImageView)findViewById(R.id.imageView);
17
18        Button btn1 = (Button)findViewById(R.id.button1);
19        btn1.setOnClickListener(new View.OnClickListener() {
20            public void onClick(View view) {
21                startTranslateUp();
22            }
23        });
24        Button btn2 = (Button)findViewById(R.id.button2);
25        btn2.setOnClickListener(new View.OnClickListener() {
26            public void onClick(View view) {
27                startTranslateDown();
28            }
29        });
30        Button btn3 = (Button)findViewById(R.id.button3);
31        btn3.setOnClickListener(new View.OnClickListener() {
32            public void onClick(View view) {
33                startTranslateLeft();
34            }
35        });
36        Button btn4 = (Button)findViewById(R.id.button4);
37        btn4.setOnClickListener(new View.OnClickListener() {
38            public void onClick(View view) {
39                startTranslateRight();
40            }
41        });
42
43    }
44
45    private void startTranslateUp(){
46        // 設定を切り替え可能
47        int type = 0;
48        if(type == 0){
49            // TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue)
50            translateAnimation = new TranslateAnimation(
51                    Animation.ABSOLUTE, 0.0f,
52                    Animation.ABSOLUTE, 0.0f,
53                    Animation.ABSOLUTE, 0.0f,
54                    Animation.ABSOLUTE, -300.0f);
55        }
56        else if(type == 1){
57            translateAnimation = new TranslateAnimation(
58                    Animation.RELATIVE_TO_SELF, 0.0f,
59                    Animation.RELATIVE_TO_SELF, 0.0f,
60                    Animation.RELATIVE_TO_SELF, 0.0f,
61                    Animation.RELATIVE_TO_SELF, 1.8f);
62        }
63        else if(type ==2){
64            translateAnimation = new TranslateAnimation(
65                    Animation.RELATIVE_TO_PARENT, 0.0f,
66                    Animation.RELATIVE_TO_PARENT, 0.0f,
67                    Animation.RELATIVE_TO_PARENT, 0.0f,
68                    Animation.RELATIVE_TO_PARENT, 0.6f);
69        }
70
71        // animation時間 msec
72        translateAnimation.setDuration(1000);
73        // 繰り返し回数
74        translateAnimation.setRepeatCount(0);
75        // animationが終わったそのまま表示にする
76        translateAnimation.setFillAfter(true);
77        //アニメーションの開始
78        imageView.startAnimation(translateAnimation);
79    }
80
81    private void startTranslateDown(){
82        // 設定を切り替え可能
83        int type = 0;
84        if(type == 0){
85            // TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue)
86            translateAnimation2 = new TranslateAnimation(
87                    Animation.ABSOLUTE, 0.0f,
88                    Animation.ABSOLUTE, 0.0f,
89                    Animation.ABSOLUTE, 0.0f,
90                    Animation.ABSOLUTE, 300.0f);
91        }
92        else if(type == 1){
93            translateAnimation2 = new TranslateAnimation(
94                    Animation.RELATIVE_TO_SELF, 0.0f,
95                    Animation.RELATIVE_TO_SELF, 0.0f,
96                    Animation.RELATIVE_TO_SELF, 0.0f,
97                    Animation.RELATIVE_TO_SELF, 1.8f);
98        }
99        else if(type ==2){
100            translateAnimation2 = new TranslateAnimation(
101                    Animation.RELATIVE_TO_PARENT, 0.0f,
102                    Animation.RELATIVE_TO_PARENT, 0.0f,
103                    Animation.RELATIVE_TO_PARENT, 0.0f,
104                    Animation.RELATIVE_TO_PARENT, 0.6f);
105        }
106
107        // animation時間 msec
108        translateAnimation2.setDuration(1000);
109        // 繰り返し回数
110        translateAnimation2.setRepeatCount(0);
111        // animationが終わったそのまま表示にする
112        translateAnimation2.setFillAfter(true);
113        //アニメーションの開始
114        imageView.startAnimation(translateAnimation2);
115    }
116    private void startTranslateLeft(){
117        // 設定を切り替え可能
118        int type = 0;
119        if(type == 0){
120            // TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue)
121            translateAnimation3 = new TranslateAnimation(
122                    Animation.ABSOLUTE, 0.0f,
123                    Animation.ABSOLUTE, -300.0f,
124                    Animation.ABSOLUTE, 0.0f,
125                    Animation.ABSOLUTE, 0.0f);
126        }
127        else if(type == 1){
128            translateAnimation3 = new TranslateAnimation(
129                    Animation.RELATIVE_TO_SELF, 0.0f,
130                    Animation.RELATIVE_TO_SELF, 0.0f,
131                    Animation.RELATIVE_TO_SELF, 0.0f,
132                    Animation.RELATIVE_TO_SELF, 1.8f);
133        }
134        else if(type ==2){
135            translateAnimation3 = new TranslateAnimation(
136                    Animation.RELATIVE_TO_PARENT, 0.0f,
137                    Animation.RELATIVE_TO_PARENT, 0.0f,
138                    Animation.RELATIVE_TO_PARENT, 0.0f,
139                    Animation.RELATIVE_TO_PARENT, 0.6f);
140        }
141
142        // animation時間 msec
143        translateAnimation3.setDuration(1000);
144        // 繰り返し回数
145        translateAnimation3.setRepeatCount(0);
146        // animationが終わったそのまま表示にする
147        translateAnimation3.setFillAfter(true);
148        //アニメーションの開始
149        imageView.startAnimation(translateAnimation3);
150    }
151    private void startTranslateRight(){
152        // 設定を切り替え可能
153        int type = 0;
154        if(type == 0){
155            // TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue)
156            translateAnimation4 = new TranslateAnimation(
157                    Animation.ABSOLUTE, 0.0f,
158                    Animation.ABSOLUTE, 300.0f,
159                    Animation.ABSOLUTE, 0.0f,
160                    Animation.ABSOLUTE, 0.0f);
161        }
162        else if(type == 1){
163            translateAnimation4 = new TranslateAnimation(
164                    Animation.RELATIVE_TO_SELF, 0.0f,
165                    Animation.RELATIVE_TO_SELF, 0.0f,
166                    Animation.RELATIVE_TO_SELF, 0.0f,
167                    Animation.RELATIVE_TO_SELF, 1.8f);
168        }
169        else if(type ==2){
170            translateAnimation4 = new TranslateAnimation(
171                    Animation.RELATIVE_TO_PARENT, 0.0f,
172                    Animation.RELATIVE_TO_PARENT, 0.0f,
173                    Animation.RELATIVE_TO_PARENT, 0.0f,
174                    Animation.RELATIVE_TO_PARENT, 0.6f);
175        }
176
177        // animation時間 msec
178        translateAnimation4.setDuration(1000);
179        // 繰り返し回数
180        translateAnimation4.setRepeatCount(0);
181        // animationが終わったそのまま表示にする
182        translateAnimation4.setFillAfter(true);
183        //アニメーションの開始
184        imageView.startAnimation(translateAnimation4);
185    }
186    }

行動規範の内容に同意します

回答2件

xmlではなく、JavaコードでTranslateAnimationをに使った方が早いと思いますよ。

投稿2017/10/19 16:30

yona

総合スコア18155

S.I

2017/10/19 16:37

わかりました。試してみます。

S.I

2017/10/20 08:16

TranslateAnimationで書き直しました。それぞれのボタンを押した移動先からさらに移動するためにはどう記述したらよいでしょうか…

yona

2017/10/20 13:08

移動先からさらに移動するTranslateAnimationを作成し実行してください。

行動規範の内容に同意します

ベストアンサー

こうしたらどう？という案ですが。

まず、猫の位置を管理する変数xと変数yを用意します。どこを原点とするかは設計思想次第ですが、ここでは左上を(0, 0)としましょう（その方が計算しやすいので）。ボタンを押す度に、方向に応じてxまたはyを加減算します。ただし、マスの端に到達しているときには計算しません。

アニメーションにはObjectAnimatorを用いたらどうでしょうか。こんな感じのメソッドを用意します。

Java
1    void animationImageView(String property, float start, float end) {
2        ImageView imageView1 = findViewById(R.id.imageView1);
3        ObjectAnimator animator = ObjectAnimator.ofFloat(imageView1, property, start, end);
4        animator.setDuration(1000);
5        animator.start();
6    }

アニメーションが横方向のときは"translationX"を、縦方向のときは"translationY"という文字列を、引数propertyに与えます。startとendは、その方向に移動する開始位置と終了位置です。これを、xまたはyを用いて計算によって求めます。

例えば、「うえ」ボタンを押したときには、

Java
1    if (y > 0) {
2        float start = 300.0f * y;
3        float end = start - 300.0f; // 終了位置を300.0減らした位置に
4        animationImageView("translationY", start, end);
5        y--;
6    }

「した」ボタンを押したときには、

Java
1    if (y < 3) {
2        float start = 300.0f * y;
3        float end = start + 300.0f; // 終了位置を300.0増やした位置に
4        animationImageView("translationY", start, end);
5        y++;
6    }

のような感じになるんじゃないでしょうか。同じ要領で「ひだり」「みぎ」も実装すれば、それっぽくなるかなあと。

短時間で雑に考えたので抜けがあるかもしれませんが。

本題とは関係ない部分についてですがちょっと補足。

Java
1        ImageView imageView1 = findViewById(R.id.imageView1);

Android Support Library 26.0.0以上を適用すると、findViewByIdの結果をキャストせずに代入できるようになりました（長年不評だったところをようやく改めたということ）。その前提でサンプルを書いたので上記のようになっています。

（10/25 00:08追記）
文章だけで説明するのが難しいので、ざっくり作成したコードを載せます（ここまでするのはやり過ぎだと他の回答者様に怒られてしまうかもしれないけど）。一応ここではfindViewByIdのキャストは入れました。

このコードでは、縦4マス、横3マスの盤上を猫が移動するものとしています。開始時の猫の位置は左上としているので、xとyの初期値は0としています。

基本的には、ボタンを押して猫を移動させる度にxまたはyを1ずつ増やしています。しかし、猫が端に到達したときにボタンを押したときには効かないようにする処理が必要です。そのためにif文を入れています。

yが0のときは猫が一番上にいるときなので、「うえ」を押したときにyが0より大きいときだけ処理を実行するように、if (y > 0)という条件を入れています。

yが3のときは猫が一番下にいるときなので、「した」を押したときにyが3より小さいときだけ処理を実行するように、if (y < 3)という条件を入れています。

ひだり、みぎについても考え方は同じです。

このコードを見て、イメージを掴んで欲しいなあと。

Java
1public class MainActivity extends AppCompatActivity {
2    final static float TRANSLATE_X = 300.0f;    // 1回の操作でX軸方向にいくつ動かすか
3    final static float TRANSLATE_Y = 300.0f;    // 1回の操作でY軸方向にいくつ動かすか
4
5    // 盤面上の開始座標を初期値として設定する
6    private int x = 0;
7    private int y = 0;
8
9    @Override
10    protected void onCreate(Bundle savedInstanceState) {
11        super.onCreate(savedInstanceState);
12        setContentView(R.layout.activity_main);
13
14        Button button1 = (Button) findViewById(R.id.button1);  // うえ
15        Button button2 = (Button) findViewById(R.id.button2);  // した
16        Button button3 = (Button) findViewById(R.id.button3);  // ひだり
17        Button button4 = (Button) findViewById(R.id.button4);  // みぎ
18
19        button1.setOnClickListener(new View.OnClickListener() {
20            @Override
21            public void onClick(View v) {
22                // 「うえ」を押したときの処理
23                if (y > 0) {
24                    float start = TRANSLATE_Y * y;
25                    float end = start - TRANSLATE_Y;
26                    animationImageView("translationY", start, end);
27                    y--;
28                }
29            }
30        });
31        button2.setOnClickListener(new View.OnClickListener() {
32            @Override
33            public void onClick(View v) {
34                // 「した」を押したときの処理
35                if (y < 3) {
36                    float start = TRANSLATE_Y * y;
37                    float end = start + TRANSLATE_Y;
38                    animationImageView("translationY", start, end);
39                    y++;
40                }
41            }
42        });
43        button3.setOnClickListener(new View.OnClickListener() {
44            @Override
45            public void onClick(View v) {
46                // 「ひだり」を押したときの処理
47                if (x > 0) {
48                    float start = TRANSLATE_X * x;
49                    float end = start - TRANSLATE_X;
50                    animationImageView("translationX", start, end);
51                    x--;
52                }
53            }
54        });
55        button4.setOnClickListener(new View.OnClickListener() {
56            @Override
57            public void onClick(View v) {
58                // 「みぎ」を押したときの処理
59                if (x < 2) {
60                    float start = TRANSLATE_X * x;
61                    float end = start + TRANSLATE_X;
62                    animationImageView("translationX", start, end);
63                    x++;
64                }
65            }
66        });
67    }
68
69    void animationImageView(String property, float start, float end) {
70        ImageView imageView1 = (ImageView) findViewById(R.id.imageView1);
71        ObjectAnimator animator = ObjectAnimator.ofFloat(imageView1, property, start, end);
72        animator.setDuration(1000);
73        animator.start();
74    }
75}