How to implement the effect of the appearance and disappearance of text with a move up? (SOLVED)

Questions
#1

example from github benjames

I studied the source code and only realized that the partial effect is run from the file
/game/object/snowball.script at line 28 - particlefx.play("#points")

this show 25 or 50 points after break snowball

local function hitball(self)
	if self.split then data.score = data.score + 50
	else data.score = data.score + 25
	end

	particlefx.play("#points") -- this line

	explode(self)

	data.hits = data.hits + 1
	if data.hits >= TOKEN_FREQ then
		data.hits = 0
		factory.create("#token-factory")
	end
end

but I don’t understand how this effect is created, etc.

Maybe there is a simpler example somewhere. I want to use it in my project. But I can’t take a ready-made (((

#2

This is the game btw: Snowline by Ben James

#3

The 25 and 50 are part of a tilesource:

And it looks like there is one particle effect set to spawn the 25 image and one to spawn the 50:

The particle effects are configured to spawn a single particle (ie the 25 or 50 image). And the 25.particlefx and 50.particlefx are attached to either snowball-m.go or snowball.go with both of them using the same snowball.script:

#4

I’m trying to figure it out. Thank you. but nothing is clear

#5

ok. works fine.
but i have a some little question.
may i use not image? i want use a gui text node.
it`s posible?

#6

Yes, in that case you need to create a gui node using gui.new_text_node(), set the font and text and then use gui.animate() to move it, and use the callback function to delete the node.

You can also use a game object with a label component, and animate go.animate().

#7

without partical fx?

#8

Well, yes, you mentioned that you “want to use a gui text node”. You can’t use a gui text node in a particle fx.

#9

I just need to show the damage - 3 numbers and so that they go up and disappear

#10

Here’s an untested snippet of code. Use it as inspiration!

-- create a text node
local text = "100"
local start_pos = vmath.vector3(10, 100, 0)
local node = gui.new_text_node(pos, text)

-- set the font to use
gui.set_font(node, "NAME OF FONT")

-- move the text node 50 pixels up in 1.5 seconds
-- fade out the text node at the same time
-- delete the node when done
local duration = 1.5
local delay = 0
gui.animate(node, "color.z", 0, gui.EASING_LINEAR, duration, delay)
gui.animate(node, "position.y", start_pos.y + 50, gui.EASING_INOUTQUAD, duration, delay, function()
	gui.delete(node)
end)

Edit: You may also need to set font color and text node size

3 Likes
#11

I put together an example project animating gui text on mouse click position. Although @britzl 's snippet is really clean and simple and you should definitely use that as inspiration. I went with gui.clone and adding nodes to a table before deleting them more complicated but you may find it useful anyway.

GUI Text Fade Example.zip (3.5 KB)

2 Likes
#12

Thanks a lot. this is what you need.
ezgif.com-crop

gui.animate(clone_node, "position.y", mouse_position.y + 80, gui.EASING_OUTSINE, duration, delay, nil, gui.PLAYBACK_ONCE_FORWARD)
gui.animate(clone_node, "color", text_fade_color, gui.EASING_OUTQUART, 2.5, delay, finished_animating, gui.PLAYBACK_ONCE_PINGPONG)
1 Like