Some weeks ago I asked on Twitter and on OpenUI5 Slack channel if someone needed an external JS library wrapped in a custom-lib. One of the first replays was talking about Masonry, a stunning library to create cascading grid layout.
And here we are, this is the first of a series of on-demand openui5 custom library ;)
What is Masonry?
Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet.
Final result first
If you want to checkout the current demo (I’m planning to add more user case) you can check it out here: https://stermi.github.io/openui5-masonry/test/demo/
Usage
Configure manifest.json
Add the library to sap.ui5 dependencies list and configure the resourceRoots to point where you uploaded the custom library.
Add the custom control inside an XML View
Add the library to sap.ui5 dependencies list and configure the resourceRoots to point where you uploaded the custom library.
xmlns:df="it.designfuture.masonry"And than you can simply add the MasonryLayout custom control
Properties
Aggregations
Events
Public Methods
Build
If you would like to extend and customize the control, you can easily do that but re-building the code with just a simple Grunt command:
npm install
grunt build
