Databases
StackOverflow2013
Postsdbo
POContinuously scroll one large seamless image in any direction
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POContinuously scroll one large seamless image in any direction
    primarykey
    data
    text
    <p>The issue is gaming related, but I think it could be applied to other use cases.</p> <p>I have a seamless image larger than the screen. About twice as big. The goal is to have this image scrollable in any direction on a surface. This is for Android.</p> <p>I've seen a few questions/answers regarding images in general, but not seamless images. </p> <p>The difference here, and the question I have is how to handle scrolling when at some points, there can be 4 separate pieces of the image on display (when the user scrolls halfway through the image diagonally).</p> <p>It's pretty obvious how to do it when you want to scroll an image edge to edge. Use a world value, and use a rectangle to display a sort of 'viewport' of where you are.</p> <p>Something like:</p> <pre><code>Rect oRect1 = new Rect(dWorldX, dWorldY, dWorldX + canvas.getWidth(), dWorldY + canvas.getHeight()); Rect oRect2 = new Rect(0, 0, canvas.getWidth(), canvas.getHeight()); canvas.drawBitmap(largeBitmapTexture, oRect1, oRect2, new Paint()); </code></pre> <p>But when the bitmap is seamless and continuously scrolling, this presents a programming challenge for me. Do I use a bunch of if statements? Is there a more efficient way of doing something like this? </p> <p>edit: A few more thoughts. One complication here is that the world (x,y) is infinitely large. Because of this, I have to use divisions of the screen width and height to display what needs to be displayed. I was originally considering just having 4 iterations of Rect since there would never be more than 4 pieces of the image on the screen. If that makes any sense. I guess I'm just a little fuzzy about how to calculate.</p> <p>edit: Here is the code I have now, with suggestions from @glowcoder. </p> <pre><code>public void draw(Canvas canvas){ int iImagesOverX=0; int iImagesOverY=0; iImagesOverX = (int)dX / mCloud.getIntrinsicWidth(); iImagesOverY = (int)dY / mCloud.getIntrinsicHeight(); mCloud.setBounds(iImagesOverX * (int)mCloud.getIntrinsicWidth() , iImagesOverY * (int)mCloud.getIntrinsicHeight() , (iImagesOverX * (int)mCloud.getIntrinsicWidth()) + mCloud.getIntrinsicWidth() , (iImagesOverY * (int)mCloud.getIntrinsicHeight()) + mCloud.getIntrinsicHeight() ); Log.d(TAG, "bounds:"+ mCloud.getBounds()); mCloud.draw(canvas); mCloud.setBounds((iImagesOverX + 1) * (int)mCloud.getIntrinsicWidth() , iImagesOverY * (int)mCloud.getIntrinsicHeight() , ((iImagesOverX + 1) * (int)mCloud.getIntrinsicWidth()) + mCloud.getIntrinsicWidth() , (iImagesOverY * (int)mCloud.getIntrinsicHeight()) + mCloud.getIntrinsicHeight() ); mCloud.draw(canvas); mCloud.setBounds((iImagesOverX + 1) * (int)mCloud.getIntrinsicWidth() , (iImagesOverY + 1)* (int)mCloud.getIntrinsicHeight() , ((iImagesOverX + 1) * (int)mCloud.getIntrinsicWidth()) + mCloud.getIntrinsicWidth() , ((iImagesOverY + 1) * (int)mCloud.getIntrinsicHeight()) + mCloud.getIntrinsicHeight() ); mCloud.draw(canvas); mCloud.setBounds((iImagesOverX) * (int)mCloud.getIntrinsicWidth() , (iImagesOverY + 1)* (int)mCloud.getIntrinsicHeight() , ((iImagesOverX) * (int)mCloud.getIntrinsicWidth()) + mCloud.getIntrinsicWidth() , ((iImagesOverY + 1) * (int)mCloud.getIntrinsicHeight()) + mCloud.getIntrinsicHeight() ); mCloud.draw(canvas); Log.d(TAG, "imagesoverx:"+ iImagesOverX); } </code></pre> <p>I had to add dX and dY to the bounds to get the images to move. However, once you go one 'tile' over to the right, the third tile does not appear.</p> <p>So this is partly working, but not quite where I need to be. There are 4 panels, but only because of the 4 instances of bounds and draw. I need these 4 panels to draw where they need to be no matter where we are with x and y.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USSalx
    1. USSalx
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POContinuously scroll one large seamless image in any direction
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POContinuously scroll one large seamless image in any direction
      1. USdenis.solonenko
      1. VTFavorite
    3. VO
      singulars
      1. POContinuously scroll one large seamless image in any direction
      1. This table or related slice is empty.
      1. VTUpMod
    1. CO"preVents a programming challenge" or "preSents a programming challenge"?
      singulars
      1. POContinuously scroll one large seamless image in any direction
      1. USBlessed Geek
    2. COpresents. thank you for that.
      singulars
      1. POContinuously scroll one large seamless image in any direction
      1. USSalx
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload