I'm trying to allow the user to pan a 2D scene by using the touch screen. I have tried several methods including translating the projection matrix, translating the view matrix and haven't found anything that will work. With these methods, the screen either pans extremely fast, or doesn't pan the amount that the user has moved with their finger. The closest I've got is the following:

public void onDrawFrame(GL10 glUnused) {

    // Projection matrix setup
    Matrix.frustumM(projectionMatrix, 0, -mSurfaceRatio * zoomFactor, // Left
        mSurfaceRatio * zoomFactor, // Right
        -1 * zoomFactor, // Bottom
        zoomFactor, // Top
        3, // Near
        7); // Far

    // panning
    Matrix.translateM(projectionMatrix, 0, mPositionX, mPositionY, 0);

    for (IDrawable drawable : mDrawables) {
        drawable.Draw(maPositionHandle, maTextureHandle, mvpMatrixHandle, mvpMatrix, viewMatrix, projectionMatrix);

Gesture Detector:

public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
    float distanceY) {

    boolean panned = false;

    float currentZoomFactor = renderer.getZoomFactor();

    if (distanceX != 0) {
        renderer.mPositionX += -1f * (distanceX * (3.1f /renderer.mSurfaceWidth) * currentZoomFactor * renderer.mSurfaceRatio); 
        panned = true;

    if (distanceY != 0) {
        renderer.mPositionY += (distanceY * (3.8f /renderer.mSurfaceHeight) * currentZoomFactor * renderer.mSurfaceRatio); 
        panned = true;

    if (panned)

    return panned;

Code for calculating the surface:

public void onSurfaceChanged(GL10 glUnused, int width, int height)
    GLES20.glViewport(0, 0, width, height);
    mSurfaceRatio = (float)width / height;
    mSurfaceWidth = (float)width;
    mSurfaceHeight = (float)height;

This code will pan somewhat correctly, but I just guessed at the 3.1f and 3.8f to make it look right. By somewhat I mean that when the device (Xoom tablet) is held long-wise the area pans correctly in the x direction, but in the y direction, the scene will lag behind where the user's finger is moving.

Could someone help me with this? Thanks!

  • \$\begingroup\$ I changed the calculations to: 'positionX += -1F * (distanceX * Math.PI * zoomFactor * 1f / surfaceHeight)' and 'positionY += distanceY * Math.PI * zoomFactor * 1f / surfaceHeight' and it seems to work as well as I need it to. Hopefully this will either help someone, or someone will correct the math. Thanks \$\endgroup\$ May 22, 2012 at 19:45
  • \$\begingroup\$ may I know why you did u use scroll instead of dragging the GLSurfaceView()? \$\endgroup\$ Nov 8, 2013 at 12:22
  • \$\begingroup\$ Thanks a lot, you saved me matt. I implemented on drag instead of scroll, but one big worry is Matrix gets translated beyond its boundary too. I think you know of it, it translates black matrix part too, how did u restrict it? Thanks in advance \$\endgroup\$ Nov 8, 2013 at 12:35
  • \$\begingroup\$ thanks @Matt Becker for your suggestion but I am not sure how to implement it, can you post some code for that, what I am able to achieve is panning, but how to restrict panning out of that matrix is required for me now. \$\endgroup\$ Nov 11, 2013 at 5:59
  • \$\begingroup\$ I wish I could buddy, but I haven't worked on Android since shortly after this question. iOS only since. And I miss it. \$\endgroup\$ Nov 12, 2013 at 19:04


You must log in to answer this question.

Browse other questions tagged .