2013-04-09 18 views
10

Androidのキャンバスに描画されるアイテムをスクロールする基本を理解するためには、何か助けが必要です。タイムラインを作成して、0の時刻が視覚化の先頭であり、時間が増えるにつれてタイムラインが前のポイントより下に引き続きレンダリングされるようにするとします。 Androidでこれをレンダリングしたい場合は、onDraw()をオーバーライドしてキャンバス上にアイテムの束を簡単に作成することができます。しかし、視覚化が画面が許すよりも大きいとしましょう。大きなキャンバスをスクロールする

たとえば、下の最初の図の大きな黒いボックスには、キャンバス全体がレンダリングされています。私は垂直方向に上下に走る青い線と、いくつかの黄色、緑色、青色の長方形を作成します。赤いボックスは、視覚化をレンダリングしているAndroidの画面を表します。最初はすべてのアイテムが表示されますが、赤いボックス内のアイテムのみが画面に表示されます。

Before_Scroll

ユーザーがスクロールダウンしている場合に表されるように赤いボックスの境界の外になっているアイテムは、もはやvisableありながら今、最初は赤いボックスの下に現れたアイテムは、ビューにありません2番目の画像。

After_Scroll

は私がscrollablesを使用する必要があると考えているが、私は非常にこれを行うにはどのように失われています。私はこのページを読んでhttp://developer.android.com/training/custom-views/custom-drawing.html自分の顧客イメージを作成する方法とこのページhttp://developer.android.com/training/custom-views/making-interactive.htmlをインタラクティブにする方法を説明していますが、私は何か不足していると思います。

この問題を示すサンプルコードは以下の通りである(ボックスは線が行く/論理口述録音、等が存在すると仮定し、これは塩基性である):

package com.example.scrolltest; 

import com.example.scrolltest.Draw; 

import android.os.Bundle; 
import android.app.Activity; 
import android.graphics.Color; 

public class MainActivity extends Activity { 
    Draw draw; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 

    draw = new Draw(this); 
    draw.setBackgroundColor(Color.WHITE); 
    setContentView(draw); 
    } 
} 

package com.example.scrolltest; 


import android.content.Context; 
import android.graphics.Canvas; 
import android.graphics.Color; 
import android.graphics.Paint; 
import android.view.View; 


public class Draw extends View { 
    Paint paint = new Paint(); 

    public Draw(Context context) { 
     super(context);    
    } 

    @Override 
    public void onDraw(Canvas canvas) { 

     paint.setColor(Color.GREEN); 
     canvas.drawRect(30, 30, 90, 200, paint); 
     paint.setColor(Color.BLUE); 

     canvas.drawLine(100, 20, 100, 1900, paint); 

     paint.setColor(Color.GREEN); 
     canvas.drawRect(200, 2000, 400, 3000, paint); 
     } 
} 

私が理解できないことは、スクロールして画面外にある矩形にスクロールする方法です。私はこれを正しく起動または代わりにドロワブル使用する必要がある場合、私は

答えて

20

シンプルなメソッド(必要な高さがあまり大きくない場合)...にもわかりませんよ。

ScrollViewを使用して、その中に描画ビューを追加します。 onMeasureでそのビューの必要な高さを計算します。

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 

draw = new Draw(this); 
draw.setBackgroundColor(Color.WHITE); 
ScrollView scrollView = new ScrollView(this); 
scrollView.addView(draw); 
setContentView(scrollView); 
} 

public class Draw extends View { 
     Paint paint = new Paint(); 

     public Draw(Context context) { 
      super(context);    
     } 

     @Override 
     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
      // Compute the height required to render the view 
      // Assume Width will always be MATCH_PARENT. 
      int width = MeasureSpec.getSize(widthMeasureSpec); 
      int height = 3000 + 50; // Since 3000 is bottom of last Rect to be drawn added and 50 for padding. 
      setMeasuredDimension(width, height); 
     } 

     @Override 
     public void onDraw(Canvas canvas) { 

      paint.setColor(Color.GREEN); 
      canvas.drawRect(30, 30, 90, 200, paint); 
      paint.setColor(Color.BLUE); 

      canvas.drawLine(100, 20, 100, 1900, paint); 

      paint.setColor(Color.GREEN); 
      canvas.drawRect(200, 2000, 400, 3000, paint); 
      } 
    } 
+0

はどのように我々は、キャンバスに機能を追加することができますパン? –

0

オフセットX/Y値を使用することもできます。あなたはオフセット値を扱う方法

は私がCamera呼び出すクラスを使用して好むすべてかかわらず、あなた次第です。アクセスは静的でなければなりません。

public void render(Canvas c){ 
    c.drawRect(100 - offsetX, 100 - offsetY, 120 - offsetX, 120 - offsetY, Paints.BLUE); 

} 

、キャンバスをパンする:

float x, y; 
@Override 
public boolean onTouchEvent(MotionEvent ev) { 
    if(ev.getAction() == MotionEvent.ACTION_DOWN){ 
     x = ev.getX(); 
     y = ev.getY(); 
    }else if (ev.getAction() == MotionEvent.ACTION_MOVE) { 
     float currX = ev.getX(); 
     float currY = ev.getY(); 

     float newOffsetX = (x - currX), 
       newOffsetY = (y - currY); 
     //The next two if-statements are to add sensitivity to the scrolling. 
     //You can drop these if you don't plan on having touch events 
     //with pressing. Pressing works without this as well, but the canvas may move slightly 
     //I use DP to handle different screen sizes but it can be replaced with pixels. c is a context-instance 
     if (newOffsetY < Maths.convertDpToPixel(2, c) && newOffsetY > -Maths.convertDpToPixel(2, c)) 
      newOffsetY = 0; 

     if (newOffsetX < Maths.convertDpToPixel(2, c) && newOffsetX > -Maths.convertDpToPixel(2, c)) 
      newOffsetX = 0; 
     offsetX += newOffsetX; 
     offsetY += newOffsetY; 
     x = ev.getX(); 
     y = ev.getY(); 
    } 

    return true; 

} 

とサンプル・カメラ・クラス:

public class Camera{ 

    public static float offsetX, offsetY; 
    //The constructor. ix and iy is the initial offset. Useful if you are creating a game and need to change the initial offset to center around a starting position. 
    //Most of the time it will be enough to set the values to 0 
    public Camera(float ix, float iy){ 
     this.offsetX = ix; 
     this.offsetY = iy; 
    } 

} 
関連する問題