2016-01-22 105 views
2

我正在尋找一種連接平移手勢與動畫完成百分比的方式。讓我告訴你我的意思。使用libgdx創建交互式動畫

enter image description here

該圖像表示我想執行一個動畫,即運動圖像演員或精靈。該動畫由pan手勢執行。當用戶滑動200px時,動畫完成100%,並在第6階段完成。如果用戶僅滑動100px,則完成時間爲50%,並且在階段3。如果用戶沒有執行平移手勢,則動畫停留在0%,並且處於階段1.我正在尋找關於如何開始構建這種模型的提示。我相信它被稱爲互動。你有什麼建議嗎?

+0

有滾動視圖。監視它滾動了多少。設置您的動畫以框架動畫。動畫當前幀= Math.floor(scrollview.scrollX/scrollview.totalScrollX * animation.totalFrames) – Diniden

+0

不錯。問題在於我無法預先錄製幀,因爲用戶需要自己創建它的「藍色矩形」 – brumbrum

+0

您必須更詳細地解釋您的場景。即使用戶正在製作他自己的內容,您也應該可以控制生成的幀。我不明白我的方法如何需要「預先計算」的價值。 – Diniden

回答

1

您可以使用GestureDetector來處理平移輸入。方法gestureListener.pan可以更新動畫位置參數。

private int screenPixelsToAnimationPositionRatio = 0.01f; //will need to tweak this and probably adjust it at runtime based on screen dimensions and resolution 
private float animationPosition = 0; //from 0 to 1, fraction of animation complete 

public void create() { 

    //... 

    GestureAdapter gestureAdapter = new GestureAdapter { 
     @Override 
     public boolean pan (float x, float y, float deltaX, float deltaY) { 
      animationPosition += deltaX * screenPixelsToAnimationPositionRatio; 
      animationPosition = MathUtils.clamp(animationPosition, 0, 1); 
      return true; 
     } 
    }; 

    GestureDetector gestureDetector = new GestureDetector(gestureAdapter); 
    Gdx.input.setInputProcessor(gestureDetector); //or put the detector in an InputMultiplexer with your other input listeners. 
} 

那麼你會創建一個可更新的基礎上animationPosition當前值的對象的位置和旋轉的方法。你需要找出決定你想要的運動的方程。例如,一些看起來有點像你上面說明什麼:

private void updateAnimation(){ 
    x = animationPosition * 30; 
    float y = 0, rotation = 0; 
    if (animationPosition >= 0.25f) { 
     float jumpPosition = Math.min(1, (animationPosition - 0.25f)/0.5f); 
     y = 30 * (1 - Interpolation.pow2In.apply(Math.abs(2 * jumpPosition - 1))); 
     rotation = 180 * jumpPosition; 
    } 

    mySprite.setPosition(x, y); 
    mySprite.setRotation(rotation); 
} 

然後在某處render調用此更新方法。