Quick Links: Download Gideros Studio | Gideros Documentation | Gideros community chat | DONATE
Custom hero clothes with TNTAnimator class? — Gideros Forum

Custom hero clothes with TNTAnimator class?

Apollo14Apollo14 Member
edited July 2018 in Code snippets
Hi guys!
IMO customizable skin system is extremely important part of game design. Currently in many game genres it is pretty much mandatory. There was discussion on forum about customizing hero clothes.

I've managed to create setup, using TNT Animator class.
But I'm not sure, if it is even optimal to do it this way.

For tiny games it may work well. But what if we have, let's say 20 skins and 10 advanced hero animations. There will be 20 huge texturepacks with all the consequences. And besides hero we may need to customize other stuff.

I've attached whole gproj with textures.
Can you take a look and suggest some improvements?
Thanks!


P. S. And how to properly use CTNTAnimator:free() function? I've tried to free my 'hero.anim' tnt object before switching to another skin, always got errors.

main.lua:
application:setBackgroundColor(0x2c3e50); application:setKeepAwake(true)
 
--***Add 3 texture packs with skins:
local skin1texturePack = TexturePack.new("pics/skin1.txt", "pics/skin1.png")
local skin2texturePack = TexturePack.new("pics/skin2.txt", "pics/skin2.png")
local skin3texturePack = TexturePack.new("pics/skin3.txt", "pics/skin3.png")
animLoader1 = CTNTAnimatorLoader.new(); animLoader1:loadAnimations("pics/skin1.tan", skin1texturePack, true)
animLoader2 = CTNTAnimatorLoader.new(); animLoader2:loadAnimations("pics/skin2.tan", skin2texturePack, true)
animLoader3 = CTNTAnimatorLoader.new(); animLoader3:loadAnimations("pics/skin3.tan", skin3texturePack, true)
 
--Add hero to stage:
local hero=Hero.new();
stage:addChild(hero); hero:setPosition(205,290)
 
--Add 3 buttons (R-G-B) to stage:
local redBtn=colorfulBtn.new("0xe74c3c",40,"R",hero)
local greenBtn=colorfulBtn.new("0x27ae60",190,"G",hero)
local blueBtn=colorfulBtn.new("0x3498db",340,"B",hero)
 
--Move our hero's y-position with sine waves:
local t,speed=1,.1
stage:addEventListener(Event.ENTER_FRAME, function()
	t+=.3
	hero:setY(30*math.sin(t*speed)+290)
end)

hero.lua:
Hero=Core.class(Sprite)
 
function Hero:init()
	self.anim = CTNTAnimator.new(animLoader1)
	self.anim:setAnimation("FLY")
	self.anim:addToParent(self)
	self.anim:playAnimation()
end

colorfulBtn.lua:
colorfulBtn=Core.class(Sprite)
function colorfulBtn:init(btnColor,xPosition,letter,hero)
	self:setPosition(xPosition,550); stage:addChild(self)
	self.pixel=Pixel.new(btnColor,1,100,50); self:addChild(self.pixel)
	self.letter=TextField.new(nil, letter); self:addChild(self.letter)
	self.letter:setTextColor(0xffffff);self.letter:setScale(4.5);self.letter:setPosition(40,42)
 
	self:addEventListener(Event.MOUSE_DOWN, function(event)
		if self.pixel:hitTestPoint(event.x,event.y) then
			event:stopPropagation()
			self:setAlpha(.7)
		end
	end)
 
	self:addEventListener(Event.MOUSE_UP, function(event)
		self:setAlpha(1)
		if self.pixel:hitTestPoint(event.x,event.y) then
			event:stopPropagation()
			if letter=="G" then
				print"gotta change skin to green"
				hero.anim = CTNTAnimator.new(animLoader2)
				hero.anim:setAnimation("FLY")
				hero.anim:addToParent(hero)
			elseif letter=="B" then
				print"gotta change skin to blue"
				collectgarbage()
				hero.anim = CTNTAnimator.new(animLoader3)
				hero.anim:setAnimation("FLY")
				hero.anim:addToParent(hero)
			elseif letter=="R" then
				print"gotta change skin to red"
				hero.anim = CTNTAnimator.new(animLoader1)
				hero.anim:setAnimation("FLY")
				hero.anim:addToParent(hero)
			end
		end
	end)
end
zip
zip
customSkinsExampleTNT.zip
78K
> Newcomers roadmap: from where to start learning Gideros
"What one programmer can do in one month, two programmers can do in two months." - Fred Brooks
“The more you do coding stuff, the better you get at it.” - Aristotle (322 BC)

Comments

  • olegoleg Member
    edited July 2018
    I do not know how to say it in English


    1- можна скіни робити не в png а у svg http://docs.giderosmobile.com/reference/gideros/Path2D#Path2D

    2 - можна колір міняти режимами накладення накладаючи зверху маску лише тії частини тіла якій треба змінити колір

    по конкретно твоїй мухі:
    1. розділи муху на частини - 1-крило 2-тіло кольорове, 3.тіло інші деталі
    додаєш всі частини в спрайт окремии бітмапами
    на крило чипляєш якір в місце його приєднання до спини і робиш анімаці. поворота крила синусом і ентерфрейм

    колір тіла міняєш трансформколор
    інше крило робиш з тої самої текстури фліпнувши його
    бінго..

    11111111.PNG
    622 x 603 - 41K
    222222222222.PNG
    983 x 565 - 188K

    Likes: Apollo14

    my games:
    https://play.google.com/store/apps/developer?id=razorback456
    мій блог по гідерос https://simartinfo.blogspot.com
    Слава Україні!
    +1 -1 (+1 / -0 )Share on Facebook
  • Apollo14Apollo14 Member
    edited July 2018
    1. розділи муху на частини - 1-крило 2-тіло кольорове, 3.тіло інші деталі
    додаєш всі частини в спрайт окремии бітмапами
    на крило чипляєш якір в місце його приєднання до спини і робиш анімаці. поворота крила синусом і ентерфрейм
    this could work for me, but I'm scared to imagine how much time it will take to monkey-code so many animations (I'm not doing mini-game from flash portal era)

    though for many game objects this method will actually be useful

    @oleg did you use TNT Animator for Gideros? Don't you like it?
    > Newcomers roadmap: from where to start learning Gideros
    "What one programmer can do in one month, two programmers can do in two months." - Fred Brooks
    “The more you do coding stuff, the better you get at it.” - Aristotle (322 BC)
  • olegoleg Member
    edited July 2018
    я використовую власний редактор, також можна використовувати live coding від ZeroBrane.
    а кодом анімуати дуже просто - звичайний копіпаст формули і коректування якорів, швидкості і амплітуди

    ps\\ велику гру зробити не проблема, проблема в тому що займатись однією грою 2 роки надоїсть =)
    my games:
    https://play.google.com/store/apps/developer?id=razorback456
    мій блог по гідерос https://simartinfo.blogspot.com
    Слава Україні!
Sign In or Register to comment.