Button Hover Reflection

From Directorforum Collaboration Wiki

Jump to: navigation, search

Contents

Description

Apply a button hover reflection to any bitmap button on stage and adjust speed, direction and angle of the reflection effect.

Example


Code

property pSprite
property pMember
property pImage
property pEffectMember
property pEffectImage
property pSaveImage
property pFxSpeed
property pEffectSpeed
property pFxDirection
property pEffectPos
 
-- Description
 
on getBehaviorDescription me
  return \
    "Button Hover Reflection" & RETURN & \
    "Animates a reflection over a bitmap button. " & RETURN & RETURN & \
    "TIPS:" & RETURN & \
    "Add this behavior to your bitmap button and setup speed, direction & rotation of the animated reflection. " & RETURN & RETURN & \
    "PARAMETERS:" & RETURN & \
    "* Speed" & RETURN & \
    "* Direction" & RETURN & \
    "* Rotation"
end getBehaviorDescription
 
 
on getBehaviorTooltip me
  return \
    "Use with bitmap buttons." & RETURN & RETURN & \
    "Animates a reflection over a bitmap button."
end getBehaviorTooltip
 
-- Event Handlers
 
on beginSprite me
  pSprite = sprite(me.spriteNum)
  pMember = pSprite.member
  pImage = pMember.image
  pEffectImage = createReflection()
  pSaveImage = pImage.duplicate()
  pEffectSpeed = pSaveImage.width / pFxSpeed
  pEffectPos = - pSaveImage.width
end
 
on mouseWithin me
  if pEffectPos < pImage.width + pImage.height then
    pImage.copyPixels(pSaveImage, pSaveImage.rect, pSaveImage.rect)
    pImage.copyPixels(pMember.image, pSaveImage.rect, pSaveImage.rect)
    pImage.copyPixels(pEffectImage, pImage.rect + rect(pEffectPos,0,pEffectPos,0) * pFxDirection, pEffectImage.rect)
    pEffectPos = pEffectPos + pEffectSpeed
  end if
end
 
on mouseLeave
  pImage.copyPixels(pSaveImage, pSaveImage.rect, pSaveImage.rect)
  pEffectPos = - pSaveImage.width
end
 
on endSprite me
  pImage.copyPixels(pSaveImage, pSaveImage.rect, pSaveImage.rect)
end
 
-- Custom Handlers
 
on createReflection
  myImageHeight = pImage.height
  myReflectionImage = image(myImageHeight, myImageHeight, 32)
  myReflectionImage.useAlpha = TRUE
  myReflectionImage.fill(myReflectionImage.rect, rgb(255,255,255))
  myGradientLine = image(myImageHeight, 1, 8, #grayscale)
  myHalfWidth = integer(myImageHeight / 2.0)
  repeat with x = 0 to (myImageHeight - 1)
    if x < myHalfWidth then
      myColor = integer(float(x) / myHalfWidth * 75.0)
      myGradientLine.setPixel(x, 0, color(myColor))
    else
      myColor = 75 - integer((float(x) - myHalfWidth) / myHalfWidth * 75.0)
      myGradientLine.setPixel(x, 0, color(myColor))
    end if
  end repeat
  myGradientImage = image(myImageHeight, myImageHeight, 8, #grayscale)
  myGradientImage.copyPixels(myGradientLine, myGradientImage.rect, myGradientLine.rect)
  myReflectionImage.setAlpha(myGradientImage)
 
  return myReflectionImage
end
 
-- AUTHOR-DEFINED PARAMETERS --
 
on isOKToAttach (me, aSpriteType, aSpriteNum)
  case aSpriteType of
    #graphic:
      return sprite(aSpriteNum).member.type = #bitmap
    #script:
      return FALSE
  end case
end isOKToAttach
 
on getPropertyDescriptionList
    description = [:]
    description.addProp(#pFxSpeed, [#default:4, #format:#integer, #comment:"Speed", #range:[#min: 1, #max: 5]])
    description.addProp(#pFxDirection, [#default:1, #format:#integer,#comment:"Direction:", #range:[-1,1]])
    description.addProp(#fxRotation, [#default:0,#format:#integer,#comment: "Rotation:", #range:[#min: -45, #max: 45]])
    return description
end

Download

Director 11 project file - 267KB

Personal tools