12
Android Studio 2.0 beta 6

我正在尝试使用 ViewPropertyAnimatorImageView (ivSettings)在工具栏中移动 a ,使其距离右侧 20dp,距离顶部 20dp,即当前位置。并移动ImageView (ivSearch)并从左侧和顶部

imageViews 包含在一个Toolbar.

这是初始状态,我想将图标移动到工具栏内的上角。

在此处输入图像描述

我正在使用的代码是获取宽度,然后减去一个值以使 ivSettings 从右侧变为 20dp。

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

你应该可以使用translationXtranslationY属性来达到你想要的效果。这些属性充当视图原始 X 和 Y 坐标的偏移量。

本质上,translationX 会将视图从其 X 坐标向右移动以获得正值,向左移动以获取负值。类似地,translationY 将视图从其 Y 坐标移向底部(正值)和顶部(负值)。

谈到您的问题,我假设您要到达的最终位置是搜索图标的左上角,以及设置图标的右上角,每个视图的填充为零。

对于搜索图标,我建议您首先将其放在工具栏的左上角。然后将 translationX 和 translationY 都设置为 20p。这应该将搜索图标放在与您的图像相同的位置。要将搜索图标移动到左上角,您只需将平移 X 和 Y 从 20dp 设置为 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

我认为问题在于 Animator 方法期望这些值是原始像素值。看起来代码只能在中等密度屏幕上按您的意图工作。例如,一个 hdpi 屏幕将需要 30px 而不是 20px 位于同一位置。在更高密度的屏幕上,存在的代码会将图标推向更靠近边缘的位置......

这意味着我们需要将预期的 dp 值转换为原始像素值并将其用于动画。有一种方便的方法可以将 dp 转换为 px,以便在每个设备上都正确。我假设您希望齿轮的左侧距离右侧 160dp(注意我特意说的是齿轮的左侧,因为 160dp 值还应该包括齿轮图像的宽度,因为 x 属性是从图像的左侧)。所以 160dp = 齿轮图像宽度 + 所需的右边距距离。假设你有一个名为 ic_gear 的资源: Drawable drawable = getResources().getDrawable(R.drawable.ic_gear); 浮动位图宽度 = 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 回答