E
eruess
Here's the scenario:
I've got a whole bunch (for the sake of argument, let's say thousands) of
different little 32x14 .png files that act as buttons all over a very large
website.
Each button image has 4 transparent pixels; the upper left, upper right,
lower left & lower right. This is to help give the otherwise square button
graphic a slightly rounded look to it.
Now sometimes, we want to display any given button with a red x over it, to
designate to the user the button is unavailable (or not applicable, or
whatever - it can have various meanings).
So instead of creating thousands of copies of the buttons with x's over them
in photoshop, I created 1 transparent .png file of an otherwise totally
transparent red x, which at run time and as needed, "layer" over the
appropriate button image. I then output a new "x-ed out" version of the
button with a new name.
Which, in testing, is *almost* working perfectly using this code simple
code:
(index.aspx page_load event)
-------------------------
Dim bmp As New Drawing.Bitmap(32, 14,
Drawing.Imaging.PixelFormat.Format32bppArgb)
Dim bmpButton As New Drawing.Bitmap("C:\button437.png")
Dim bmpRedX As New Drawing.Bitmap("C:\redx.png")
Dim g As Drawing.Graphics = Drawing.Graphics.FromImage(bmp)
g.DrawImage(bmpButton, 0, 0)
g.DrawImage(bmpRedX, 0, 0)
bmp.MakeTransparent(bmp.GetPixel(0,0))
bmp.Save("C:\test.png", System.Drawing.Imaging.ImageFormat.Png)
Label1.Text = "<img src=test.png>"
-------------------------
The red X image is very nicely blended over the top of the button image,
producing exactly the effect we are looking for... almost.
Remember the upper left, upper right, lower left and lower right pixels that
were transparent in the original button file? They are now WHITE, and I
can't seem to make them transparent anymore. I've tried to use the
MakeTransparent method with color.white, even referencing the upper-left
pixel directly as in the above code sample, just in case it wasn't quite
equal to white, but to no avail. The button is now nicely visually X-ed out
with the red X graphic overlay, however the button is no longer 'round'
looking and to add insult to injury, has very conspicuous white pixels at
each of it's 4 corners.
If I open test.png in photoshop 6.0, photoshop shows the 4 corner pixels as
transparent. Is this a web pallete thing? I've tried various methods but
remain stumped.
I've got a whole bunch (for the sake of argument, let's say thousands) of
different little 32x14 .png files that act as buttons all over a very large
website.
Each button image has 4 transparent pixels; the upper left, upper right,
lower left & lower right. This is to help give the otherwise square button
graphic a slightly rounded look to it.
Now sometimes, we want to display any given button with a red x over it, to
designate to the user the button is unavailable (or not applicable, or
whatever - it can have various meanings).
So instead of creating thousands of copies of the buttons with x's over them
in photoshop, I created 1 transparent .png file of an otherwise totally
transparent red x, which at run time and as needed, "layer" over the
appropriate button image. I then output a new "x-ed out" version of the
button with a new name.
Which, in testing, is *almost* working perfectly using this code simple
code:
(index.aspx page_load event)
-------------------------
Dim bmp As New Drawing.Bitmap(32, 14,
Drawing.Imaging.PixelFormat.Format32bppArgb)
Dim bmpButton As New Drawing.Bitmap("C:\button437.png")
Dim bmpRedX As New Drawing.Bitmap("C:\redx.png")
Dim g As Drawing.Graphics = Drawing.Graphics.FromImage(bmp)
g.DrawImage(bmpButton, 0, 0)
g.DrawImage(bmpRedX, 0, 0)
bmp.MakeTransparent(bmp.GetPixel(0,0))
bmp.Save("C:\test.png", System.Drawing.Imaging.ImageFormat.Png)
Label1.Text = "<img src=test.png>"
-------------------------
The red X image is very nicely blended over the top of the button image,
producing exactly the effect we are looking for... almost.
Remember the upper left, upper right, lower left and lower right pixels that
were transparent in the original button file? They are now WHITE, and I
can't seem to make them transparent anymore. I've tried to use the
MakeTransparent method with color.white, even referencing the upper-left
pixel directly as in the above code sample, just in case it wasn't quite
equal to white, but to no avail. The button is now nicely visually X-ed out
with the red X graphic overlay, however the button is no longer 'round'
looking and to add insult to injury, has very conspicuous white pixels at
each of it's 4 corners.
If I open test.png in photoshop 6.0, photoshop shows the 4 corner pixels as
transparent. Is this a web pallete thing? I've tried various methods but
remain stumped.