4

I have recently been trying to implement my first Android game using a similar approach to the infamous LunarLander. I am rendering the graphics myself without the aid of a game engine, and that seems to be the most complicated part of the endeavor so far.

The Problem

I am determining the width of the screen, and forwarding that information into an algorithm that determines the maximum number of images that can be rendered horizontally given the width and some other margin values (see calculateMaxBeadsInWidth() below). However, the mathematics seem to not be matching up to the values computed by the algorithm. Basically, it is determining that only X amount of images can be displayed, when in actuality X + 2 images can easily be displayed on the screen.

The Calculations

I have parsed many debug outputs that show that the actual width of the screen is 800 pixels, and the image width is 44 pixels. So, given that the margin is 100 pixels (50 pixels on the far left and 50 pixels on the far right), that leaves 700 pixels to work with. Now, floor(700 / 44) = 15, so only 15 images are shown. But there is clearly space for more (see pictures)!!

The Code

My algorithm:

private int calculateMaxBeadsInWidth() {

    float eff_width = screenWidth - (BOARD_MARGIN_HORIZONTAL * 2);

    return (int) (eff_width / bead_width);
}

Note that the value of BOARD_MARGIN_HORIZONTAL is 50.0f.

Some Pictures

This is what is being produced by my algorithm:

enter image description here

However, as you can see it is obvious that you could easily fit at least 2 more beads towards the end of the lines (on the right). For instance, this picture shows what happens when I hard code the number of beads in one row to two more than the algorithm is producing:

enter image description here

Here is the image with the margins detailed with red lines. As you can see there is still plenty of space:

enter image description here

Supplemental Information

I am testing this application on the Google Nexus 7.

I am using getResources().getDisplayMetrics().widthPixels; to obtain the width of the screen. Perhaps the issue is here?

My Question

Are there some resolution values that I am not taking into consideration here that are affecting the results? Why is this being computed so inaccurately?

If you need any more information I will gladly provide it, any help would be appreciated greatly!

Squagem
  • 724
  • 4
  • 17
  • I ran into a problem similar to this when I forgot to take into account pixel densities. Not sure if this is relevant to what you're doing, but it might be worth looking into. – jprofitt Jan 22 '13 at 04:01
  • Yes, that is what I was considering. Pixel densities and resolution anomalies might be contributing to the loss of space. I am apprehensive to pursue this route unless I am very sure that this is the case, however, because of the complexity involved in rendering the graphics independent of pixel densities. – Squagem Jan 22 '13 at 04:05
  • [Check out these answers](http://stackoverflow.com/questions/4605527/converting-pixels-to-dp-in-android) to get some quick conversion methods. – jprofitt Jan 22 '13 at 04:07
  • Very interesting post - bookmarked! I tried implementing these methods but alas, they simply either inflated or deflated my images dramatically. I think this was a good avenue to pursue, and I will continue testing until I can find the solution! – Squagem Jan 22 '13 at 04:28

1 Answers1

2

Your margins are the wrong value. You uploaded full-size images, but if you draw vertical lines @ 50px and 750px, they intersect the drawing area. So, you are either using the wrong value in your calculations, or somewhere else you are drawing in what is supposed to be margin.

enter image description here

iagreen
  • 31,470
  • 8
  • 76
  • 90
  • Could you rephrase that slightly? I'm confused as to what you mean. Let me draw some lines in the meantime, though. – Squagem Jan 22 '13 at 04:58
  • @Squagem see image edit, I think that explains it. Red lines are where you have your margins set (50px from left and 50px from right) – iagreen Jan 22 '13 at 04:59
  • @Squagem It appears the images on the left are being drawn with their centers on the edge of the margin, and it should be they are drawn with their left edge on the margin. – iagreen Jan 22 '13 at 05:04
  • Hmm, I have implemented the lines at the margins as you said (see edited answer, 3rd picture) and although they *are* being drawn with their centers on the margin, this does not explain the loss of the two extra columns? Or am I still missing something? – Squagem Jan 22 '13 at 05:09
  • Oh, I see what you are saying. Since the red line (margin) intersects the 2 beads in the drawing, then they will NOT be counted by my algorithm, thus explaining why I am 2 beads short. The margins are not being accounted for in the drawing portion of the game loop. – Squagem Jan 22 '13 at 05:13
  • 1
    @Squagem Yes, it explains it. Your eyes might also be tricking you -- 700 / 44 = 15.9, so when you even out the margins the empty space on the left will be 90% of a bead, which will probably look like one could fit, but it won't fit exactly. – iagreen Jan 22 '13 at 05:13
  • @Squagem Yes,that is another way of looking at it! – iagreen Jan 22 '13 at 05:15
  • Thank you very much! It would appear that this is the issue. I will need to rework my game engine to accomodate for the margins properly. Good eye! – Squagem Jan 22 '13 at 05:27