rotate a button's icon without rotating the whole button | rotate imagetexture

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By lettucing

i’m making a factory game, i want to only use one texture and rotate it depending on the conveyor and machine’s direction

and i don’t know how to set the button’s icon to be rotated

how can i rotate an imagetexture so that its facing the correct direction, or how do i rotate the icon for the button without rotating the whole button

the only time rotation worked was when i used a progresstexture instead of a sprite

lettucing | 2022-03-16 00:59

:bust_in_silhouette: Reply From: Zylann

The first thing that comes to mind is that you should definitely use a separate node if you want only the icon to rotate. The internal things of a Button node are not as customizable as a regular node. You could in theory have 4 versions of the same texture if you only rotate by 90 degrees and modify it each time you rotate, but that sounds like a hassle (or not, pick what you like). You can use a button with a child Sprite or TextureRect so you have full control over it.

if i do add a texturerect as a child, how do i make the button be the correct size, since the button also changes text

i assume i’d just leave a placeholder icon and then use the texturerect for the rotated stuff

lettucing | 2022-03-16 22:12

oh yeah

this, i use a custom bg texture, and because i have text i don’t know how i should align it relative to the button’s position

lettucing | 2022-03-16 22:26

:bust_in_silhouette: Reply From: codelyok13
var texture = button.texture
var image = texture.get_data()
#Perform transformation on image
var image_texture = ImageTexture.new()
image_texture.create_from_image(image)
button.texture = image_texture

Hope this puts you on the right track since I don’t really know how to perform transformations on PoolByteArray.

Also, you can try moving to GOOST which is basically like early C++ where it provides additional functionality on top of a GODOT base.
GOOST Rotate Image - Basically, what you need to make what I wrote work easily

Edit: Fixing an issue in the code.

:bust_in_silhouette: Reply From: lettucing

like Zylann said on their answer i used a texturerect for the icon

what i did was place the texturerect on top, then, since i’m using a custom theme override, i scaled the icon to be the correct size, and set its margin to be the button’s style margin, this would make it always stay in the same place

code:

	get_node("TextureRect").texture.set_size_override(Vector2(32,32)) # set size override, this works for imagetextures

	get_node("TextureRect").rect_pivot_offset = Vector2(get_node("TextureRect").texture.get_size().x/2, get_node("TextureRect").texture.get_size().y/2) # set the pivot to be on the center

	get_node("TextureRect").margin_bottom = get_stylebox("normal").margin_bottom
	get_node("TextureRect").margin_top = get_stylebox("normal").margin_top
	get_node("TextureRect").margin_left = get_stylebox("normal").margin_left
	get_node("TextureRect").margin_right = get_stylebox("normal").margin_right