[webkit-help] Need help regarding layouting and painting part

Julien Chaffraix julien.chaffraix at gmail.com
Wed Feb 13 08:45:50 PST 2013

> I want to put any kind of Box2d effect on html element. These things I want
> to do with css extension. Till now I have done how to get value from css
> wrapper and able to store in own created Box2d module. But this value, I
> want to apply on any kind of html element or page. Say for example, if I
> apply the Box2d effect on Html tag or any html page then Box2d effect will
> be applied on that element or page. Now I am facing problem, how to animate
> the object with box2d effect, I mean, Layouting and Painting part. Please
> let me know how I can proceed.

Looking at the demo, they are using animations to avoid relaying out
the whole page and keep it snappy. It's probably the right way to go
but understand that in doing so, your new elements won't impact
regular elements' layout in your page as they animate (transformations
are paint time only operations). That's also probably the easiest way
to get where you want to go. I would look at how to we do animations
(see Source/WebCore/page/animations/*) and try to do something similar
by you would need to hook the box2D logic.

The other option would be a custom renderer (RenderObject) which would
solve the interaction with the rest of the page but would mean a lot
more complexity. Understand that if you take this route, it will take
at least several months for someone unfamiliar with WebKit rendering.

> Please let me know if you guys have any
> change list related to adding any css properties with its full
> implementation.

That doesn't happen in practice as it would be too big to review. I
usually ask people to break the CSS side vs the rendering side of a
change so that they can be reviewed independently.

You can look at the regions, exclusions and grid layout changes for
some idea of how to implement the CSS + rendering side, just pick a
property and start looking in the history.

Here is a recent example to add some new CSS properties:

Hope it helps,

More information about the webkit-help mailing list