12
Android Studio 2.0 beta 6

ViewPropertyAnimator を使用しImageView (ivSettings)てツールバー内を移動し、現在の場所から右から 20 dp、上から 20 dp になるようにしようとしています。ImageView (ivSearch)左と上から 20 dp を移動します。

imageViews は に含まれていToolbarます。

これは初期状態で、アイコンをツールバー内の上隅に移動したいと考えています。

ここに画像の説明を入力

私が使用しているコードは、これで幅を取得し、値を減算して ivSettings を右から 20 dp にします。

final DisplayMetrics displayMetrics = new DisplayMetrics();
getActivity().getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
final float widthPx = displayMetrics.widthPixels;

ivSearch.animate()
    .setInterpolator(new AccelerateInterpolator())
    .x(20)
    .y(20)
    .setDuration(250)
    .start();

ivSettings.animate()
    .setInterpolator(new AccelerateInterpolator())
    .x(widthPx - 160)
    .y(20)
    .setDuration(250)
    .start();

ただし、これを別の画面サイズで試してみたところ、正確な幅の計算ができません。これを行うより良い方法はありますか?

提案に感謝します

4

2 に答える 2

7

translationXおよびtranslationYプロパティを使用して、必要な効果を得ることができるはずです。これらのプロパティは、ビューの元の X および Y 座標からのオフセットとして機能します。

基本的に、translationX はビューを X 座標から正の値の場合は右に、負の値の場合は左に移動します。同様に、translationY は、ビューを Y 座標から正の値の場合は下に、負の値の場合は上に移動します。

あなたの質問に来て、到達したい最終的な位置は、検索アイコンの左上隅と、各ビューのパディングがゼロの設定アイコンの右上隅であると想定しています。

検索アイコンについては、ツールバーの左上隅に配置することから始めることをお勧めします。次に、translationX と translationY の両方を 20p に設定します。これにより、検索アイコンが画像と同じ場所に配置されます。検索アイコンを左上に移動するには、translationX & Y を 20 dp から 0 dp にアニメーション化するだけです。

設定アイコンについても同じことを繰り返しますが、translationX を -20dp に、translationY を 20dp に設定します。このようにして、画像と同じ位置に配置されます。両方の値を 0 にアニメートして、目的のアニメーションを実現します。

参考までにアニメーションコードを載せておきます。

ivSearch.animate()
    .setInterpolator(new AccelerateInterpolator())
    .translationX(0) // Takes value in pixels. From 20dp to 0dp
    .translationY(0) // Takes value in pixels. From 20dp to 0dp
    .setDuration(250)
    .start();

ivSettings.animate()
    .setInterpolator(new AccelerateInterpolator())
    .translationX(0) // Takes value in pixels. From -20dp to 0dp
    .translationY(0) // Takes value in pixels. From 20dp to 0dp
    .setDuration(250)
    .start();

// To get pixels from dp
float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, getResources().getDisplayMetrics());

このアプローチの優れた点は、親の次元を知る必要がなくなったことです。気にするのは、 と で指定したオフセットだけtranslationXですtranslationY

于 2016-03-12T18:11:29.387 に答える
5

問題は、アニメーターのメソッドが値が生のピクセル値であることを期待していることだと思います。コードは、中密度の画面で意図したとおりにしか機能しないようです。たとえば、hdpi スクリーンは、同じ場所に配置するために 20px ではなく 30px を必要とします。より高密度の画面では、コードが存在するため、アイコンが端に近づきます...

つまり、予想される dp 値を生のピクセル値に変換し、それらをアニメーションに使用する必要があります。すべてのデバイスで正しくなるように、dp を px に変換する便利な方法があります。歯車の左側を右から 160 dp にしたいことを想定しています (160 dp の値には x プロパティとして歯車の画像の幅も含める必要があるため、歯車の左側を具体的に言っていることに注意してください。画像左から)。したがって、160dp = 歯車の画像の幅 + 必要な右余白の距離。ic_gear というリソースがあるとします。 Drawable drawable = getResources().getDrawable(R.drawable.ic_gear); float bitmapWidth = getIntrinsicWidth();

float rawPX20DPValue = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, getResources().getDisplayMetrics());

float rawPXLeftOffset = rawPX20DPValue + bitmapWidth;

ivSearch.animate()
    .setInterpolator(new AccelerateInterpolator())
    .x(rawPX20DPValue)
    .y(rawPX20DPValue)
    .setDuration(250)
    .start();


ivSettings.animate()
    .setInterpolator(new AccelerateInterpolator())
    .x(widthPx - rawPXLeftOffset)
    .y(rawPX20DPValue)
    .setDuration(250)
    .start();

また、最終結果にも影響を与える可能性があるため、移動する前にギアと検索アイコンのオフセット (パディング) を確認してください。

于 2016-03-11T13:17:15.100 に答える