blob: fc425c8a4b73f54fefb493d5cf69a48855a8ad4a [file] [log] [blame]
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20000802//EN"
"http://www.w3.org/TR/2000/CR-SVG-20000802/DTD/svg-20000802.dtd">
<!-- ========================================================================= -->
<!-- Copyright (C) The Apache Software Foundation. All rights reserved. -->
<!-- -->
<!-- This software is published under the terms of the Apache Software License -->
<!-- version 1.1, a copy of which has been included with this distribution in -->
<!-- the LICENSE file. -->
<!-- ========================================================================= -->
<!-- ========================================================================= -->
<!-- This test validates that the fill and stroke opacity values are taken -->
<!-- into account for all the types of Paint servers -->
<!-- -->
<!-- @author vhardy@apache.org -->
<!-- @version $Id$ -->
<!-- ========================================================================= -->
<?xml-stylesheet type="text/css" href="test.css" ?>
<svg id="body" width="450" height="500" viewBox="0 0 450 500">
<title>Paint Server Opacity Test</title>
<style type="text/css"><![CDATA[
.markedPath { fill:none; stroke:black; stroke-width:.5; }
]]></style>
<g id="content">
<text class="title" x="50%" y="40">Paint Server Opacity Test</text>
<defs>
<pattern id="transparencyPattern" viewBox="0 0 10 10" x="0" y="0" width="10" height="10"
patternContentUnits="userSpaceOnUse" patternUnits="userSpaceOnUse">
<g fill="#eee" stroke="none">
<rect x="0" y="0" width="5" height="5" />
<rect x="5" y="5" width="5" height="5" />
</g>
</pattern>
<pattern id="testPattern" viewBox="0 0 20 20" x="0" y="0" width="20" height="20"
patternContentUnits="userSpaceOnUse" patternUnits="userSpaceOnUse">
<g transform="scale(2, 2)">
<g fill="crimson" stroke="none">
<rect x="0" y="0" width="5" height="5" />
<rect x="5" y="5" width="5" height="5" />
</g>
<g fill="gold" stroke="none">
<rect x="5" y="0" width="5" height="5" />
<rect x="0" y="5" width="5" height="5" />
</g>
</g>
</pattern>
<radialGradient id="testRadialGradient" gradientUnits="userSpaceOnUse" cx="10" cy="10" r="40">
<stop stop-color="crimson" offset="0" />
<stop stop-color="gold" offset=".5" />
<stop stop-color="gold" stop-opacity=".5" offset="1" />
</radialGradient>
<linearGradient id="testLinearGradient" gradientUnits="userSpaceOnUse" x1="-25" y1="0" x2="25" y2="0">
<stop stop-color="crimson" offset="0" />
<stop stop-color="gold" offset=".5" />
<stop stop-color="gold" stop-opacity=".5" offset="1" />
</linearGradient>
<circle id="filledShape" cx="0" cy="0" r="25" />
</defs>
<g transform="translate(25, 60)">
<g id="grid" stroke="black" fill="none">
<rect x="40" y="20" width="360" height="380" fill="url(#transparencyPattern)"/>
<g fill="rgb(240, 240, 240)" >
<rect x="0" y="20" width="20" height="190" />
<rect x="0" y="210" width="20" height="190" />
<rect x="20" y="20" width="20" height="63" />
<rect x="20" y="83" width="20" height="63" />
<rect x="20" y="146" width="20" height="64" />
<g transform="translate(0, 190)">
<rect x="20" y="20" width="20" height="63" />
<rect x="20" y="83" width="20" height="63" />
<rect x="20" y="146" width="20" height="64" />
</g>
<rect x="40" y="0" width="90" height="20" />
<rect x="130" y="0" width="90" height="20" />
<rect x="220" y="0" width="90" height="20" />
<rect x="310" y="0" width="90" height="20" />
</g>
<g class="label" text-anchor="middle" stroke="none" fill="black">
<text x="85" y="15">rgb</text>
<text x="175" y="15">radial grad</text>
<text x="265" y="15">linear grad</text>
<text x="355" y="15">pattern</text>
<text x="15" y="115" transform="rotate(-90, 15, 115)">fill</text>
<text x="15" y="305" transform="rotate(-90, 15, 305)">stroke</text>
<text x="35" y="51.5" transform="rotate(-90, 35, 51.5)">opaque</text>
<text x="35" y="51.5" transform="translate(0, 63) rotate(-90, 35, 51.5)">fill-opac.</text>
<text x="35" y="51.5" transform="translate(0, 126) rotate(-90, 35, 51.5)">combo</text>
<g transform="translate(0, 190)">
<text x="35" y="51.5" transform="rotate(-90, 35, 51.5)">opaque</text>
<text x="35" y="51.5" transform="translate(0, 63) rotate(-90, 35, 51.5)">fill-opac.</text>
<text x="35" y="51.5" transform="translate(0, 126) rotate(-90, 35, 51.5)">combo</text>
</g>
</g>
<line x1="130" y1="20" x2="130" y2="400" />
<line x1="130" y1="20" x2="130" y2="400" transform="translate(90, 0)"/>
<line x1="130" y1="20" x2="130" y2="400" transform="translate(180, 0)"/>
<line x1="130" y1="20" x2="130" y2="400" transform="translate(270, 0)"/>
<line x1="40" y1="83" x2="400" y2="83" />
<line x1="40" y1="83" x2="400" y2="83" transform="translate(0, 63)"/>
<line x1="40" y1="83" x2="400" y2="83" transform="translate(0, 127)"/>
<line x1="40" y1="83" x2="400" y2="83" transform="translate(0, 190)"/>
<line x1="40" y1="83" x2="400" y2="83" transform="translate(0, 253)"/>
<line x1="40" y1="83" x2="400" y2="83" transform="translate(0, 317)"/>
</g>
<!-- ==================================== -->
<!-- rgb colors -->
<!-- ==================================== -->
<!-- fill -->
<use xlink:href="#filledShape" x="85" y="51.5" fill="crimson"/>
<use xlink:href="#filledShape" x="85" y="51.5" fill="crimson" fill-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" fill="crimson" fill-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
<!-- stroke -->
<g stroke="gold" stroke-width="10" fill="none" transform="translate(0, 190)">
<use xlink:href="#filledShape" x="85" y="51.5" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
</g>
<!-- ==================================== -->
<!-- radial gradient -->
<!-- ==================================== -->
<g transform="translate(90, 0)">
<!-- fill -->
<g fill="url(#testRadialGradient)">
<use xlink:href="#filledShape" x="85" y="51.5" />
<use xlink:href="#filledShape" x="85" y="51.5" fill-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" fill-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
</g>
<!-- stroke -->
<g stroke="url(#testRadialGradient)" stroke-width="10" fill="none" transform="translate(0, 190)">
<use xlink:href="#filledShape" x="85" y="51.5" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
</g>
</g>
<!-- ==================================== -->
<!-- linear gradient -->
<!-- ==================================== -->
<g transform="translate(180, 0)">
<!-- fill -->
<g fill="url(#testLinearGradient)">
<use xlink:href="#filledShape" x="85" y="51.5" />
<use xlink:href="#filledShape" x="85" y="51.5" fill-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" fill-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
</g>
<!-- stroke -->
<g stroke="url(#testLinearGradient)" stroke-width="10" fill="none" transform="translate(0, 190)">
<use xlink:href="#filledShape" x="85" y="51.5" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
</g>
</g>
<!-- ==================================== -->
<!-- patterns -->
<!-- ==================================== -->
<g transform="translate(270, 0)">
<!-- fill -->
<g fill="url(#testPattern)">
<use xlink:href="#filledShape" x="85" y="51.5" />
<use xlink:href="#filledShape" x="85" y="51.5" fill-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" fill-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
</g>
<!-- stroke -->
<g stroke="url(#testPattern)" stroke-width="10" fill="none" transform="translate(0, 190)">
<use xlink:href="#filledShape" x="85" y="51.5" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" transform="translate(0, 63)" />
<use xlink:href="#filledShape" x="85" y="51.5" stroke-opacity=".5" opacity=".5" transform="translate(0, 126)"/>
</g>
</g>
</g>
</g>
<!-- ============================================================= -->
<!-- Batik sample mark -->
<!-- ============================================================= -->
<use xlink:href="../batikLogo.svg#Batik_Tag_Box" />
</svg>