Thread Tools Display Modes
03-01-22, 02:02 PM   #1
Benalish
A Flamescale Wyrmkin
 
Benalish's Avatar
Join Date: Dec 2012
Posts: 122
Fading animation

Hello there. I'm trying to copy the same animation as the buffs when are about to expire.
This is my attempt:

Lua Code:
  1. local f = CreateFrame('Button', 'MyButtonName', UIParent)
  2. f:SetPoint('CENTER')
  3. f:SetSize(128, 128)
  4.  
  5. local tex = f:CreateTexture(nil, "BACKGROUND")
  6. tex:SetAllPoints()
  7. tex:SetTexture(1, 1, 1, 0.5)
  8.  
  9. f.flasher = f:CreateAnimationGroup()
  10.  
  11. f.flasher:SetLooping("BOUNCE")
  12.  
  13. f.flasher:SetScript(
  14.     "OnFinished",
  15.     function(self, requested)
  16.         if requested then
  17.             self:Hide()
  18.         end
  19.     end
  20. )
  21.  
  22. local fadeIn = f.flasher:CreateAnimation("Alpha")
  23. fadeIn:SetDuration(0.5)
  24. fadeIn:SetChange(0.5)
  25. fadeIn:SetOrder(1)
  26.  
  27. local fadeOut = f.flasher:CreateAnimation("Alpha")
  28. fadeOut:SetDuration(0.5)
  29. fadeOut:SetChange(-0.5)
  30. fadeOut:SetOrder(2)
  31. fadeOut:SetEndDelay(1)
  32.  
  33. f.flasher:Play()

The animation from "fadeIn" to "fadeOut" works well, but the transition from "fadeOut" to "fadeIn" seems too sharp.

Any suggestions?

Last edited by Benalish : 03-01-22 at 03:40 PM.
  Reply With Quote
03-01-22, 09:50 PM   #2
Kanegasi
A Molten Giant
 
Kanegasi's Avatar
AddOn Author - Click to view addons
Join Date: Apr 2007
Posts: 666
When expiring buffs flash, Blizzard doesn't use any animation functions, they just change the alpha every frame. Here's the complete math behind it if you want to try matching it with animations or just use it:

Lua Code:
  1. function BuffFrame_OnUpdate(self, elapsed)
  2.     if ( self.BuffFrameUpdateTime > 0 ) then
  3.         self.BuffFrameUpdateTime = self.BuffFrameUpdateTime - elapsed
  4.     else
  5.         self.BuffFrameUpdateTime = self.BuffFrameUpdateTime + 0.2
  6.     end
  7.  
  8.     self.BuffFrameFlashTime = self.BuffFrameFlashTime - elapsed
  9.     if ( self.BuffFrameFlashTime < 0 ) then
  10.         local overtime = -self.BuffFrameFlashTime
  11.         if ( self.BuffFrameFlashState == 0 ) then
  12.             self.BuffFrameFlashState = 1
  13.             self.BuffFrameFlashTime = 0.75
  14.         else
  15.             self.BuffFrameFlashState = 0
  16.             self.BuffFrameFlashTime = 0.75
  17.         end
  18.         if ( overtime < self.BuffFrameFlashTime ) then
  19.             self.BuffFrameFlashTime = self.BuffFrameFlashTime - overtime
  20.         end
  21.     end
  22.  
  23.     if ( self.BuffFrameFlashState == 1 ) then
  24.         self.BuffAlphaValue = (0.75 - self.BuffFrameFlashTime) / 0.75
  25.     else
  26.         self.BuffAlphaValue = self.BuffFrameFlashTime / 0.75
  27.     end
  28.     self.BuffAlphaValue = (self.BuffAlphaValue * (1 - 0.3)) + 0.3
  29. end

Then they use AuraButton#:SetAlpha(BuffFrame.BuffAlphaValue) in the individual OnUpdate functions for each icon if timeLeft < 31 seconds, which means all expiring buffs pulse in sync with each other.

Last edited by Kanegasi : 03-01-22 at 09:53 PM.
  Reply With Quote
03-02-22, 05:07 AM   #3
Benalish
A Flamescale Wyrmkin
 
Benalish's Avatar
Join Date: Dec 2012
Posts: 122
Magnificent, isn't?

Lua Code:
  1. local f = CreateFrame('Button', 'MyButtonName', UIParent)
  2. f:SetPoint('CENTER')
  3. f:SetSize(128, 128)
  4.  
  5. local tex = f:CreateTexture(nil, "BACKGROUND")
  6. tex:SetAllPoints()
  7. tex:SetTexture(1, 1, 1, 0.5)
  8.  
  9. f.flasher = f:CreateAnimationGroup()
  10.  
  11.  
  12. f.flasher.opacity = -0.5
  13.  
  14. f.flasher:SetLooping("BOUNCE")
  15.  
  16. f.flasher:SetScript(
  17.     "OnFinished",
  18.     function(self, requested)
  19.         if requested then
  20.             self:Hide()
  21.         end
  22.     end
  23. )
  24.  
  25. f.flasher:SetScript(
  26.     "OnLoop",
  27.     function()
  28.         f.flasher.opacity = (f.flasher.opacity == -0.5) and 0.5 or -0.5
  29.     end
  30. )
  31.  
  32. local fade = f.flasher:CreateAnimation("Alpha")
  33. fade:SetDuration(0.5)
  34. fade:SetChange(f.flasher.opacity)
  35. fade:SetOrder(1)
  36.  
  37. f.flasher:Play()

Last edited by Benalish : 03-02-22 at 10:48 AM.
  Reply With Quote
03-02-22, 03:57 PM   #4
Fizzlemizz
I did that?
 
Fizzlemizz's Avatar
Premium Member
AddOn Author - Click to view addons
Join Date: Dec 2011
Posts: 1,871
It looks like (for using Animations at least) you want something more like:

Lua Code:
  1. local f = CreateFrame('Button', 'MyButtonName', UIParent)
  2. f:SetPoint('CENTER')
  3. f:SetSize(128, 128)
  4.  
  5. f.tex = f:CreateTexture(nil, "BACKGROUND")
  6. f.tex:SetAllPoints()
  7. f.tex:SetAtlas("bags-icon-consumables", true)    
  8. f.flasher = f:CreateAnimationGroup()
  9. f.flasher:SetToFinalAlpha(true)
  10. f.flasher:SetLooping("REPEAT")
  11. local anim = f.flasher:CreateAnimation("Alpha") -- fade out
  12. anim:SetChildKey("tex")
  13. anim:SetOrder(1)
  14. anim:SetDuration(2)
  15. anim:SetFromAlpha(1)
  16. anim:SetToAlpha(0.1)
  17. anim:SetSmoothing("NONE")
  18.  
  19. anim = f.flasher:CreateAnimation("Alpha") -- fade in
  20. anim:SetChildKey("tex")
  21. anim:SetOrder(2)
  22. anim:SetDuration(2)
  23. anim:SetFromAlpha(0.1)
  24. anim:SetToAlpha(1)
  25.  
  26. f.flasher:Play()
__________________
Fizzlemizz
Maintainer of Discord Unit Frames and Discord Art.
Author of FauxMazzle, FauxMazzleHUD and Move Pad Plus.
  Reply With Quote

WoWInterface » Developer Discussions » Lua/XML Help » Fading animation

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off