Jump to content

[1.7.10] How to Rotate a texture inside your GUI


Thornack

Recommended Posts

I have a GUI where I used the keyTyped function to change a value called angle. This value is changed when you press the a or d keys on the keyboard or when you hold them down the value changes alot faster. This angle is displayed in the GUI and can be seen to update while your in the GUI (everytime i hit the keys you see the value change). I wish to use this to rotate the GUI texture live. Any ideas as to how I can achieve this functionality?

 

my GUI has two images the background (I want that to remain stationary) and the foreground (i want this to rotate around its center when I press or hold down the a or d keys).

 

@Override
    public void drawScreen(int mouseX, int mouseY, float p_73863_3_){
    	 super.drawScreen(mouseX, mouseY, p_73863_3_);

//This draws the angle that is changed
    	 this.drawCenteredString(this.fontRendererObj, "angle: " + this.currentAngle, this.width / 2, 10, 0xFFFFFF);

//Background texture is bound and a textured rectangle is drawn for this GUI part
    	this.mc.getTextureManager().bindTexture(guiBackgroundTexture);
    	this.drawTexturedRect(this.guiRect, this.guiBackground, this.textureCoordsBackground, this.guiBackgroundTextureSize);

//Foreground texture (I want to rotate this) is bound and a textured rectangle is drawn for this GUI part
    	this.mc.getTextureManager().bindTexture(guiForegroundTexture);
    	this.drawTexturedRect(this.guiRect, this.guiForeground, this.textureCoordsForeground, this.guiForegroundTextureSize);
}

 

This is how I change the angle

@Override
protected void keyTyped(char key, int event){
    	super.keyTyped(key, event);
    	
  	    //While the user presses the specified keyboard key once this code causes the currentAngle to change
    	if(key=='a'||key=='A'){
    	this.currentAngle--;
    	}
    	else if (key=='d'||key=='D'){
    	this.currentAngle++;
    	}
    	//While you hold down the specified keyboard key this code causes the currentAngle to change 
    	Keyboard.enableRepeatEvents(true);
    	if(Keyboard.isRepeatEvent()){
    	
    	if(Keyboard.isKeyDown(Keyboard.KEY_A) == true){
    		this.currentAngle--;
    	}
    	else if(Keyboard.isKeyDown(Keyboard.KEY_D) == true){
    		this.currentAngle++;
    	}
}}

 

any help is appreciated

Link to comment
Share on other sites

Isolate the code where you render your texture.

 

Push the matrix before, perform the rotation, then pop the matrix after.

 

Your code would look something like this:

 

GL11.glPushMatrix();
GL11.glRotatef(angle, x, y, z);

//Render anything you want to render here

GL11.glPopMatrix(); // This resets all the transforms you did after GL11.glPushMatrix

 

Just in case you don't know the arguments for rotate, angle is self explanatory, but x, y, and z specify the vector that is perpendicular to the plane of rotation. For 2D images, you would set x = 0, y = 0, z = 1.

 

(For more information about the OpenGL functions, I have examples of their usage here.)

Link to comment
Share on other sites

Do you mean

 

@Override

    public void drawScreen(int mouseX, int mouseY, float p_73863_3_){

    super.drawScreen(mouseX, mouseY, p_73863_3_);

 

//This draws the angle that is changed

    this.drawCenteredString(this.fontRendererObj, "angle: " + this.currentAngle, this.width / 2, 10, 0xFFFFFF);

 

//Background texture is bound and a textured rectangle is drawn for this GUI part

    this.mc.getTextureManager().bindTexture(guiBackgroundTexture);

    this.drawTexturedRect(this.guiRect, this.guiBackground, this.textureCoordsBackground, this.guiBackgroundTextureSize);

 

GL11.glPushMatrix();

GL11.glRotatef(this.angle, 84,0,  84);

//Foreground texture (I want to rotate this) is bound and a textured rectangle is drawn for this GUI part

    this.mc.getTextureManager().bindTexture(guiForegroundTexture);

    this.drawTexturedRect(this.guiRect, this.guiForeground, this.textureCoordsForeground, this.guiForegroundTextureSize);

GL11.glPopMatrix(); // This resets all the transforms you did after GL11.glPushMatrix

}

 

I tried this and the texture seems to be rotated by the upper left corner, I need some way to rotate it around its very middle

 

 

 

Link to comment
Share on other sites

Yes, that's the basic idea. I forgot to account for the location of the origin though. To deal with it, instead of just rotating, translate it to the upper left, perform the rotation, then translate it back.

 

I.e.

glPushMatrix();
glTranslatef(x, y, 0);
glRotate(ang, xR, yR, zR);
glTranslatef(-x, -y, 0);

//rendering

glPopMatrix();

Unfortunately, you will probably need to guess and check values of x and y. It shouldn't be too bad if you run your mod in debug mode though.

Link to comment
Share on other sites

For those of you whom need more explanation You dont actually need to guess the coordinates for x and y you can calculate them in the following way see the comment in the code

@Override
    public void drawScreen(int mouseX, int mouseY, float p_73863_3_){
    // ...other stuff
// what you want -> 
GL11.glPushMatrix();
    	
GL11.glTranslatef(233f, 127f, 0); 

// these two positions can be calculated by taking the parameter from your guiBackground image Rectangle corner Coord(x,y)= 155,30 and adding the width/2 = (156/2 for my case) and height/2 = (195/2 for my case) of this background to its Rectangle corner coordinate giving (156/2) + 155 = 233 and (195/2) + 30 = 127 where 233,127 are the coordinates you want inside your GL11.glTranslate(). Also note, the axises are 45 degrees off of a traditional Cartesian Coordinate system so that is why I use the 45. and no guessing is needed.

    	GL11.glRotatef(this.currentAngle, 0, 0,45);
    	GL11.glTranslatef(-233f, -127f, 0f);


//Foreground texture (I want to rotate this) is bound and a textured rectangle is drawn for this GUI part
       this.mc.getTextureManager().bindTexture(guiForegroundTexture);
       this.drawTexturedRect(this.guiRect, this.guiForeground, this.textureCoordsForeground, this.guiForegroundTextureSize);
GL11.glPopMatrix(); // This resets all the transforms you did after GL11.glPushMatrix
}

That rotates the GUI around the center at the position that I wanted (the center of my background)

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Announcements



×
×
  • Create New...

Important Information

By using this site, you agree to our Terms of Use.