xmlgraphics-batik-users mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Todd Wilson <todd_wil...@byu.edu>
Subject Using transparency over an underlying component
Date Tue, 12 Mar 2002 21:58:49 GMT

We're building a client-side Java app in which we'd like to use SVG 
images, but seem to be having difficulty with the transparency feature. 
  Just to emphasize up front--what we're building is pure client-side 
Java; that is, no web browser, no Adobe SVG Viewer, etc.

Transparency within an SVG seems to work just fine, meaning shapes 
overlaying each other where "fill:none" can be designated in order to 
allow some shapes visible through other shapes.  However, we're hoping 
to accomplish basically what a transparent GIF allows--portions of an 
image are transparent and allow whatever the SVG is rendred on top of to 
show through the image.  So, for example, I could render an SVG on top 
of a JFrame or JPanel that has a blue background, and portions of that 
blue background would be visible through the SVG because portions of the 
SVG are transparent.

Here's our shot at this--

<?xml version="1.0" encoding="iso-8859-1"?>
<svg width="300" height="200">
   <rect x="50" y="50" width="100" height="50" style="fill:none; 

Notice the style attribute contains "fill:none" which, as we understand 
it, will make its fill transparent.

import javax.swing.*;
import java.awt.event.*;
import java.awt.*;

import org.apache.batik.swing.*;
import org.apache.batik.swing.gvt.*;

public class TransTest extends JFrame
   public TransTest()
     // Kill the app when the window closes.
     this.addWindowListener( new WindowAdapter() { public void 
windowClosing( WindowEvent e ) { System.exit( 0 ); } } );

     // Create an SVG canvas.
     JSVGCanvas svgCanvas = new JSVGCanvas();

     // Make sure that the canvas isn't opaque.
     svgCanvas.setOpaque( false );
     System.out.println( "isOpaque: " + svgCanvas.isOpaque() );

     // Tell the canvas where to find the SVG.
     svgCanvas.setURI( "file:/path/to/svg/test.svg" );

     // Turn the background of the frame a bright blue so that if the
     // SVG is transparent the blue will shine through.
     this.getContentPane().setBackground( Color.blue );

     // Add the SVG to the frame.
     this.getContentPane().add( svgCanvas );

     // Make the frame visible and pack it so that it can be
     // displayed.
     this.setVisible( true );

   public static void main( String[] args )
     TransTest transTest = new TransTest();

We've tried to make the class as simple as possible, but notice that it 
does set the background of the JFrame to blue, so the blue should be 
visible through the SVG, if the transparency is working as we'd like it to.

When the class is compiled and run the SVG is renderd on the JFrame just 
fine, but the background is white instead of blue.

We read in an earlier post to this list that the type of transparency 
we're trying for works in IE with the Adobe SVG Viewer, and that the 
transparency is accomplished using "fill:none" in the style attribute.

Is there another way we should be rendering the SVG images aside from 
using JSVGCanvas?  Is there something else we're missing?  Is the type 
of transparency we're hoping to use even possible with SVG in the 
current version of Batik?

Many thanks in advance to anyone willing to lend a hand.


Todd Wilson

P.S. We've been watching the list for a while and have searched the 
archive for a solution to our problem, but haven't had any luck.  I 
apologize in advance if this problem has been previously posted and 

To unsubscribe, e-mail: batik-users-unsubscribe@xml.apache.org
For additional commands, e-mail: batik-users-help@xml.apache.org

View raw message