fuhouyin/MaterialFX
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
MaterialFX/wiki/Ripple Generator.md
palexdev 8313709240 ♻️ Minor changes 
📝 Added Wiki pages to the project
📝 Update README
📝 Added CHANGELOG

Signed-off-by: palexdev <alessandro.parisi406@gmail.com>
2022-01-22 17:12:42 +01:00

6.5 KiB
Raw Permalink Blame History

Ripple Generator

MFXCircleRippleGenerators

  • Style Class: mfx-ripple-generator

Properties

Property Description Type
region The region on which the ripple will be generated Region
clipSupplier The current generator's clip Supplier.
This is responsible for creating the clip node of the generator, which is built and set everytime the ripple is generated, before the animation is started, and defines the bounds beyond which the ripple must not go.
Although the supplier accepts any Shape it is highly recommended to build clips using the RippleClipTypeFactory		 Supplier
rippleSupplier The generator's ripple supplier.
This Supplier is responsible for creating the ripple shape before the animation is played		 Supplier
positionFunction The generator's ripple position function.
This Function is responsible for computing the ripple's x and y coordinates before the animation is played. The function takes a MouseEvent as the input (since in most controls the coordinates are the x and y coordinates of the mouse event) and returns a PositionBean		 Function
animateBackground Specifies if the background of the region should be animated too.
The animation generally consists in temporarily adding a shape to the generator, set its fill same as the ripple color, and manipulate its opacity with a timeline		 Boolean
animateShadow Specifies if the DropShadow effect of the region should be animates too.
Mostly used for MFXButtons		 Boolean
checkBounds Specifies if the method isWithinBounds(MouseEvent) should be called before generating the ripple.
The purpose of this property is to disable/bypass the bounds check, it may happen in some cases that the check must be disabled to make the generator work properly. An example is the MFXCheckboxSkin		 Boolean
depthLevelOffset Specifies by how many levels the shadow should be increased.
For example if the DropShadow effect is of DepthLevel.LEVEL1 and the offset is set to 2 then the shadow will shift to DepthLevel.LEVEL3, (reverted at the end of the animation of course)		 Integer

Styleable Properties

Property Description CSS Property Type Default Value
animationSpeed Specifies the speed on the ripples' animation.
This is done by setting the animations rate property		 -mfx-animation-speed Double 1.0
autoClip Specifies whether the generator should try to buildClip() automatically, this means also trying to fetch the background/border radius.
EXPERIMENTAL, may not work in all situations		 -mfx-auto-clip Boolean false
backgroundOpacity Specifies the strength of the background animation -mfx-background-opacity Double 0.3
rippleColor Specifies the ripples' color -mfx-ripple-color Color Color.LIGHTGRAY
rippleOpacity Specifies the initial ripple's opacity -mfx-ripple-opacity Double 1.0
rippleRadius Specifies the ripples' initial radius -mfx-ripple-radius Double 10.0
paused Property to enable/disable the ripple generator -mfx-paused Boolean false