Calculate the x and y position of a child display object relative to the parent.
Relationships: center, left, right, top, or bottom
Get a calculation by passing in the display object or passing in numbers.
If you pass in the display objects, the x and/or y positions of the child will get set.
You have the option to add the child to the parent.
This library works with any javascript display objects that have these properties/methods: x, y, width, height, addChild. You can use it with frameworks like PIXI and Phaser.
alignX(parent, child, alignX = 0, padding = 0, addChild = false)
alignY(parent, child, alignY = 0, padding = 0, addChild = false)
alignXandY(parent, child, alignX = 0, alignY = 0, paddingX = 0, paddingY = 0, addChild = false)
x = (parentWidth * 0.5) - (childWidth * 0.5) + padding;
y = (parentHeight * 0.5) - (childHeight * 0.5) + padding;
x = padding;
y = padding;
if (parentWidth > childWidth) {
x = parentWidth - childWidth - padding;
} else {
x = -(childWidth - parentWidth) - padding;
}
if (parentHeight > childHeight) {
y = parentHeight - childHeight - padding;
} else {
y = -(childHeight - parentHeight) - padding;
}
The functions in the Align library are static. This mean you do not need to instantiate the class. You can just call it like: LibraryName.functionName().
In your index.html, add a script tag to include the version of the align.min.js file that you want from the dist/ directory. You will be able to use the library within your code without needing to import it.
myFunc() {
let parent = new Sprite();
let child = new Sprite();
Align.alignX(parent, child, Align.CENTER, 5, true);
}
The tests are here.
Please open an issue if you find any bugs. We will fix the issue and add a test for it.
Please download or clone the repo and open /docs/index.html in a web browser
PhaserSignals - A library for Phaser. Add any listener to any signal. Dispatch any signal anywhere/anytime.
AssetLoader - A library for Phaser. Load assets externally from a json file.
More coming soon...
This project used the webpack-library-starter project
My name is Genell Radley. I am a game developer w/7yr professional experience writing games in Flash, Unity and HTML5. I believe in unit testing and documenting my code well. I am very excited to share my code here with you on GitHub. I hope you will contribute.
Please see my github profile and linkedin profile.