ijzerenhein / famous-sizeconstraint Goto Github PK
View Code? Open in Web Editor NEWSizeConstraint makes it possible to set the scale, padding, max-size, min-size and aspect-ratio for famo.us renderables
License: MIT License
SizeConstraint makes it possible to set the scale, padding, max-size, min-size and aspect-ratio for famo.us renderables
License: MIT License
hi
I try scale property but don't works , could you add an example into folder examples ?
thanks
I'm trying to constrain the dimensions of a surface inside of a view to 50px less than the view's size. For example:
var sizeConstraint = new SizeConstraint({
padding: [undefined, 50]
});
var contentSurface = new Surface({
size: [500, undefined],
classes: ['scrollable'],
content: "some text",
properties: {
textAlign: 'center'
}
});
this.add(sizeConstraint);
sizeConstraint.add(contentSurface);
If I look at the yTransform of the matrix3d of the contentSurface without the sizeConstraint being applied I see that it is 300. If I apply the sizeConstraint, the height of the contentSurface is correctly reduced but the yTransform is also changed to 192.5. I can't see why this is happening and it is a change that doesn't seem to relate to any settings I've expressed.
Furthermore, if I wrap the sizeConstraint in a StateModifier to adjust the origin to the center of the containing view like this:
var centerModifier = new StateModifier({
origin: [0.5, 0.5],
});
this.add(centerModifier).add(sizeConstraint);
the modifier appears to have no effect. My surfaces are all still stuck to the left-hand size of the screen rather than being centered as desired. It appears SizeConstraint is throwing out the applied modifiers it is wrapped inside of. Use the SizeConstraint's own origin property with the same setting as I was using on the StateModifier also has no effect sadly.
hi
I try to add transform: Transform.translate(100,0,0) to your examples on the main modifier but don't works .
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.