openGL drawing distorted sprites (images) in psuedo-3d perspective

Question

Alright so this is going to be a doozy to explain. I'm making a very basic "pseudo-3d" racing game for Android using AndEngine (and in turn, openGL - I think). I don't believe using AndEngine really has anything to do with this problem though, because I'm directly accessing openGL functions to accomplish my drawing.

Anyways, I copy-pasta'd some code that allowed the normally 2d AndEngine to have a 3d perspective (tutorial for such can be found here. This works pretty well, and I also don't believe this has much to do with my problem, but I don't fully understand openGL so it's a little hard for me to say. Here's the code from the onLoadEngine (called when app starts) that sets up the camera with a 3d perspective:

this.mCamera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT) {
    //other methods...
    private void setFrustum(GL10 pGL) {
        // set field of view to 60 degrees
        float fov_degrees = 60;
        float fov_radians = fov_degrees / 180 * (float)Math.PI;                        

        // set aspect ratio and distance of the screen
        float aspect = this.getWidth() / (this.getHeight());
        float camZ = this.getHeight()/2 / (float)Math.tan(fov_radians/2);                              

        // set projection
        GLHelper.setProjectionIdentityMatrix(pGL);
        GLU.gluPerspective(pGL, fov_degrees, aspect, camZ/10, camZ*10); 

        // set view
        GLU.gluLookAt(pGL, 0,120f, camZ, 0, 0, 0f, 0, 1, 0); // move camera back+up
        pGL.glScalef(1,-1,1); // reverse y-axis
        pGL.glTranslatef(-CAMERA_WIDTH/2,-CAMERA_HEIGHT/2,0); // origin at top left
    }
};

Then later in the onLoadScene (where the drawing takes place), I draw a bunch of my images like so:

for (int n=0;n<=100;n++) {
    final int k = n;

    final Sprite line = new Sprite(0, 0,CAMERA_WIDTH,16f, [AndEngine texture holding road img]) {
    @Override
        protected void applyTranslation(GL10 pGL) {
            pGL.glTranslatef(this.mX, 120f, 15f*k); //16*k causes a sliver of a space between each segment
            pGL.glRotatef(90f, 1, 0, 0); //**MAY BE MY ISSUE**
        }           
    };
    scene.attachChild(line); //actually draws the image to the screen           
}

Which works pretty darn well as well, except for one thing! It distorts the shit out of my images. The images are simple pngs, both matching the CAMERA_WIDTH, and both looking similar to this:

And when I draw it without the rotate line, I get this:

Which has a decently straight middle line (tbh I'd be happy with them this way), but then you can see the edges of the road are all facing basically the exact opposite way they should be facing. I figured why not just flip them? I thought I would have to rotate them 180 degrees around the x axis, but instead that just makes them disappear, and instead I found that 90 degrees works (???). Anyways, Here's what I get:

So yeah. Here's where my problem lies - the middle lane divider is distorted as crap!! The lines marking the edge of the road line up wonderfully, but for whatever reason its really messing with that middle line. I get most of the math behind the 3d, but I really don't know what to make of this...it's almost like the image is being compressed because its being viewed at such a sharp angle, but I don't really know how the hell I could solve that without simply making it a top-down view? :S

Anyways... any ideas or guidance is welcome. Sorry this is such a long and convoluted post - it makes it hard when I really have no idea where the problem lies.

Also - It might be worth noting I have little to no experience with openGL or 3d graphics, and have even less interest in learning much about them in depth. I need a band-aid to this problem!

Answer 1

Ok so I found the solution! Turns out there is this little issue called Perspective Correct Texturing, that is basically just a flag that needs to be turned on in OpenGL to make it not skew images when they are being drawn with perspective.

Inside my Camera initializing code, I added this line to the method setFrustum(GL10 pGL):

pGL.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);

That this essentially solved the problem. Lines are as straight as ever now :) I found this out on another stackoverflow post where this answer actually wasn't what the asker wanted, but it just so happened to work for me :D The thread that led me to the answer can be found here.