Auto merge of #10331 - pcwalton:simplify-complex-clipping-regions, r=glennw

gfx: Simplify complex clipping regions as we construct them.

This allows WebRender to correctly render complex clipping regions that
can be reduced to single rounded rectangles. WebRender still can't
render rounded rectangles with arbitrary intersections yet, but this
allows it to handle many more cases.

Closes servo/webrender#241.

r? @glennw

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="35" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/10331)
<!-- Reviewable:end -->
This commit is contained in:
bors-servo 2016-04-02 05:03:07 +05:30
commit 4e21517796
4 changed files with 116 additions and 1 deletions

View file

@ -827,6 +827,18 @@
"url": "/_mozilla/css/border_radius_elliptical_a.html"
}
],
"css/border_radius_in_border_radius_a.html": [
{
"path": "css/border_radius_in_border_radius_a.html",
"references": [
[
"/_mozilla/css/border_radius_in_border_radius_ref.html",
"=="
]
],
"url": "/_mozilla/css/border_radius_in_border_radius_a.html"
}
],
"css/border_radius_overlapping_a.html": [
{
"path": "css/border_radius_overlapping_a.html",
@ -7249,6 +7261,18 @@
"url": "/_mozilla/css/border_radius_elliptical_a.html"
}
],
"css/border_radius_in_border_radius_a.html": [
{
"path": "css/border_radius_in_border_radius_a.html",
"references": [
[
"/_mozilla/css/border_radius_in_border_radius_ref.html",
"=="
]
],
"url": "/_mozilla/css/border_radius_in_border_radius_a.html"
}
],
"css/border_radius_overlapping_a.html": [
{
"path": "css/border_radius_overlapping_a.html",

View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="match" href="border_radius_in_border_radius_ref.html">
<style>
html, body {
margin: 0;
padding: 0;
}
.green {
overflow: hidden;
border-radius: 50px;
background: green;
padding: 50px;
width: 100px;
}
.red {
background: red;
border-radius: 50%;
width: 100px;
height: 100px
}
</style>
<div class="green"><div class="red"></div></div>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<meta charset="utf-8">
<style>
html, body {
margin: 0;
padding: 0;
}
.green {
position: absolute;
border-radius: 50px;
background: green;
padding: 50px;
width: 100px;
height: 100px;
}
.red {
position: absolute;
top: 50px;
left: 50px;
width: 100px;
height: 100px;
background: red;
border-radius: 50%;
}
</style>
<div class="green"></div><div class="red"></div>