了解javafx中的插值方法

时间:2016-10-28 02:40:40

标签: java animation javafx interpolation

我正在尝试在JavaFX中创建动画。

我很难理解一种方法。

任何人都可以解释底部的插值方法究竟是什么吗?

更具体地说,它如何使用模数?

import javafx.animation.Interpolator;
import javafx.animation.Transition;
import javafx.geometry.Rectangle2D;
import javafx.scene.image.ImageView;
import javafx.util.Duration;

public class SpriteAnimation extends Transition {

    private  ImageView imageView;

    private  int count;            
    private  int columns;         
    private  int offsetX;         
    private  int offsetY;         
    private  int width;            
    private  int height;          
    private int lastIndex;

    public SpriteAnimation(
            ImageView imageView, 
            Duration duration, 
            int count,   int columns,
            int offsetX, int offsetY,
            int width,   int height) {

        this.imageView = imageView;       
        this.count     = count;       
        this.columns   = columns;
        this.offsetX   = offsetX;       
        this.offsetY   = offsetY;
        this.width     = width;
        this.height    = height;

        setCycleDuration(duration);  
        setInterpolator(Interpolator.LINEAR); 
    }

    protected void interpolate(double k) {
        // 
        int index = Math.min((int) Math.floor(k * count), count - 1);
        if (index != lastIndex) {

            int x = (index % columns) * width  + offsetX;
            int y = (index / columns) * height + offsetY;
            imageView.setViewport(new Rectangle2D(x, y, width, height));

            lastIndex = index;
        }
    }
}

1 个答案:

答案 0 :(得分:1)

当转换运行时,k的不同值将传递给interpolate。在动画开始时,0.0将为k传递,并在动画结束时传递1.0

int index = Math.min((int) Math.floor(k * count), count - 1);

计算index0范围内的count-1。顺便说一句:我更喜欢(int) (k * count)(int) Math.floor(k * count),因为转换为int会截断浮点值。

在更改索引时,ImageView应显示的图像部分将被修改以显示图像的相应部分。在这里,您从左到右逐行遍历精灵。

index % columns

indexcolumns的其余部分。这意味着,对于index的每个增量,结果将增加1,直到达到columns;在这种情况下,它从0开始。

由于此属性,它可用于确定要显示的图像的水平位置。你只需要乘以精灵的宽度来得到左边的x坐标。

index / columns

index除以columns而没有休息,即index / columns(index - index % columns) / columns导致相同的值。对于您添加到columns的每index,结果会增加1;当index % column0开始时,它会增加1。因此它可以用来确定精灵的y坐标;你只需要乘以一个精灵的高度。

columns = 3

的示例
index   |   index % 3  |   index / 3
--------------------------------------
  0     |     0        |     0
  1     |     1        |     0
  2     |     2        |     0
  3     |     0        |     1
  4     |     1        |     1
  5     |     2        |     1
  6     |     0        |     2
             ...
 31     |     1        |     10

这样你就按照以下顺序迭代精灵

-------------------
|  1  |  2  |  3  |
-------------------
|  4  |  5  |  6  |
-------------------
        ...
-------------------
| 31  | 32  |     |
-------------------