GUI node animation programmatically when (SOLVED)

Questions
#1

I have created a GUI node - box and added texture “frog.atlas”. Even able to run animation via editor. Now, I am trying to run “frog” animation when a player tapped on node.
In the .gui_script, I received “touch” gesture and its node as well.

function on_input(self, action_id, action)

	if action_id == hash("touch") and action.pressed then 
		local frog = gui.get_node("frog") 
		if gui.pick_node(frog, action.x, action.y) then 
			print("Frog clicked - do animation. ")
			--Do Frog animation
			
		end
	end
end

As per [example],(https://www.defold.com/manuals/animation/#_gui_box_node_example),

gui.play_flipbook(frog, "frog") //is not working

FYI, I have “game” game object -> “animal.gui” -> “frog” node with “frog_animation” node.

#2

Hi!

Could you zip up your project and share it? Would be a lot easier to figure out what’s wrong :slight_smile:

#3

Are you sure you added the script to the GUI? Did you acquire input focus?

#4

Could you try this

function on_input(self, action_id, action)
    if action_id == hash("touch") and action.pressed then
        local frog = gui.get_node("frog")
        if gui.pick_node(frog, action.x, action.y) then
            print("Frog clicked - do animation. ")
            -- do Frog animation
            gui.set_texture(frog, "frog") -- atlas
            gui.play_flipbook(frog, "your-animation-id") -- image
        end
    end
end
1 Like
#5

Hey @Jerakin, Yes. I agree … but I’m afraid I can’t do that. :wink:
I hearty appreciate your extended help. However i attached outline of ‘animal.gui’

37
Screenshot 2019-06-30 at 20.38.37.png310×746 24.8 KB
45
Screenshot 2019-06-30 at 20.38.45.png317×617 19.7 KB

#6

@Ross.grams Yes, I did both.

#7

Sry, I am very new here… what should be “your-animation-id” in my case -or- else where can I find it ?

#8

I assume you’re using an animation group?

It’s basically the name of your animation. When you open an atlas and click on an image or animation group, you should see a list of properties.

These properties will be shown if you click on an animation group:

image
image.png746×734 27.8 KB

#9

Yes, it’s included -
gui.set_texture(frog, “frog”) – atlas
gui.play_flipbook(frog, “frog_animation”) – image

Thanks.

#10

What’s the end result with your code?
No print outs?

#11

No printouts !.
After clicking frog node (a first image of sprite) , it shows entire sprites (full set of frog animation frames) in the node.

#12

If you don’t get a print out here, this section isn’t called at all.

Try adding a print further up, e.g. at the start of the on_input() function.
Do you get a print out then?

#13

Hey @Mathias_Westerdahl,
I already got “Frog clicked - do animation.” printed in my console.

#14

Hi @Mathias_Westerdahl , @amel, @Jerakin,

Can any one of you kindly share me full example code -

A box - node when user taps, animation starts (uses Atlas & gui.scripts)

I :yellow_heart:appreciate all of your time & efforts for help.

#15

What I did was:

  1. Opened a blank project and removed the logo, background and main.script file
  2. Removed the logo and background images from the main.atlas and added two new images to an animation group called flash
  3. Created main.gui and main.gui_script
  4. Attached the main.gui_script file to the main.gui component
  5. Added the main.gui component to the blueprint game object in the main.collection
  6. Created a box node in main.gui, added a system font and added a texture (main.atlas)
  7. Added input focus on the GUI (main.gui_script)
function init(self)
	msg.post(".", "acquire_input_focus")
end
  1. Placed the code I sent earlier and adjusted it to this project (main.gui_script)
function on_input(self, action_id, action)
	if action_id == hash("touch") and action.pressed then
		local boxnode = gui.get_node("box")
		if gui.pick_node(boxnode, action.x, action.y) then
			print("box has been touched. ")
			-- start the animation
			gui.set_texture(boxnode, "main") -- set the texture on the gui which is an atlas
			gui.play_flipbook(boxnode, "flash") -- set the animation group or image
		end
	end
end
  1. Run it and tap on the box

602b7157439f9957ffbc3791a02b7daa

AnimationExample.zip (5.0 MB)

3 Likes
#16

@amel It worked … !! I was almost gave up until now. Thank you so much.
Mistake : Playback was set ‘None’ instead of ‘Once Forward’. and also was not sure of flipbook name in the gui_script.

2 Likes