We Keep Coding

PictureBox Image Painted two times issue

I am loading multiple images into a pictureBox and is trying to centre it at the bottom. I am using the below function:
public void toogleImage(Boolean visible, Bitmap img)
{
if (visible)
{
pict_statusCenter.Show();
pict_statusCenter.Image = img;
}
else
{
pict_statusCenter.Hide();
}
}
After reading several Q&A such as here, I have updated the paint event as below:
private void pict_statusCenter_Paint(object sender, PaintEventArgs e)
{
var g = e.Graphics;
g.DrawImage(pict_statusCenter.Image,
(pict_statusCenter.Width - pict_statusCenter.Image.Width) / 2,
pict_statusCenter.Height - pict_statusCenter.Image.Height);
}
The image is now painted at the right location of the picture box. The problem is that a duplicate of the image is painted in the top left corner. I am a bit lost, any clue?
Second question: my image is actually a gif. During debugging, I noticed that each gif update fires a paint event. Is that normal? Is this the right way to do it?
Thanks for your kind assistance.

Ok, I finally did a simple padding:
pict_statusCenter.Padding = new Padding(
(pict_statusCenter.Width - pict_statusCenter.Image.Width)/2,
(pict_statusCenter.Height- pict_statusCenter.Image.Height),
(pict_statusCenter.Width - pict_statusCenter.Image.Width)/2,
0);

Best way to make images scrollable that where painted on the control

I draw images (lets say 200x200) on control in C# depending on how many there are (could be over 100) they get drawn offscreen since they are stacked one above the other. What is the best way to make a dynamic scroll so that i can scroll to the ones that are offscreen.
I was thinking of using a Panel and painting them on there and then just place the Panel on the control. But with the panel being transparent and the control on which the panel is sitting is changing its image (its a map that you can move with draging) the panel lags behind when drawing and creates a ugly jitter effect.
So are there any good solutions where i wont need to implement the whole logic of a scroller myself for such a solution?

PictureBox is doublebuffered and will take care of the flicker.
For your case don't draw onto a control, no matter which, but instead draw into a PictureBox's Image.
Put the PictureBox inside an autoscroll panel and make it a large as the Size you need. No jitter, smooth scrolling..
Here is an example. It randomly draws around 200 small images into the Image of a PictureBox. I create the Image with a large size and I put the PB into a Panel:
Random R = new Random();
private void button1_Click(object sender, EventArgs e)
{
panel1.AutoScroll = true;
pictureBox1.Parent = panel1;
pictureBox1.Location = Point.Empty;
pictureBox1.Image = new Bitmap(3000, 500);
pictureBox1.ClientSize = pictureBox1.Image.Size;
var imgFiles = Directory.GetFiles(#"D:\scrape\", "*.png");
foreach(string file in imgFiles)
{
using (Graphics G = Graphics.FromImage(pictureBox1.Image))
using (Bitmap bmp = new Bitmap(file))
{
if (bmp.Size.Width < 300)
{
for (int i = 0; i < 10; i++ )
G.DrawImage(bmp, R.Next(2500), R.Next(400));
}
}
}
}
You can easily adapt it to your own project, I'm sure..

Image background after insert into RichTextBox

I insert images into RichTextBox from app resources. Image format PNG, background is transparent. After insert, background of image is gray. How i can set background of image to transparent?
My current code:
private Hashtable icons = null;
private void LoadIcons()
{
icons = new Hashtable(3);
icons.Add("[inf]", Properties.Resources.inf);
icons.Add("[ok]", Properties.Resources.ok);
icons.Add("[err]", Properties.Resources.err);
}
private void SetIcons()
{
richTextBox.ReadOnly = false;
foreach (string icon in icons.Keys)
{
while (richTextBox.Text.Contains(icon))
{
IDataObject tmpClibboard = Clipboard.GetDataObject();
int index = richTextBox.Text.IndexOf(icon);
richTextBox.Select(index, icon.Length);
Clipboard.SetImage((Image)icons[icon]);
richTextBox.Paste();
Clipboard.SetDataObject(tmpClibboard);
}
}
richTextBox.ReadOnly = true;
}
private void richTextBox_TextChanged(object sender, EventArgs e)
{
SetIcons();
}

I have the same problem and my solution was to create new empty bitmap with your icon size and then set its background to richtextbox background color. After that, I drawed with graphics object the icon on the previous bitmap.
Here's the code:
Create a bitmap with the size of your icon (here, warning from ressource file)
Bitmap img = new Bitmap(Icons.warning.Width, Icons.warning.Height);
Create graphic object from this bitmap
Graphics graphics = Graphics.FromImage(img);
Set the background of the bitmap on richtextbox background
graphics.Clear(richTextBox.BackColor);
Then overlay your icon on the bitmap
graphics.DrawImage(Icons.warning,Point.Empty);
ps: Sorry for my bad english ;)
Peace :)

There is no such thing as true transparency in a WinForms Control. Transparent mode inherits the default background of its parent. The way I have worked around it in the past has been to use the OnPaint event and then use the Graphics.DrawString method to position the text where I want it.
Try
Alpha blend controls

How to move an image in picturebox using mouse events

i am trying to move a image in picture box. i added panel to my application and also added picture box in panel. i opened an image.if the image size is big.i want to see the particular portion of image. so how can i move the image up and down (without using scroll bars) to see the particular portion of image?

You can add controls like move left, move right, move up, move down with associated actions to move the image within your picturebox. An example of how to do this for moving the image to the right is shown below. You can implement these action with mouse down and mouse up events so that the user just presses the appropriate buttons to move the picture as he wants. Also note that once you reach the maximum dimensions of the image, you can change the rectangular region to that within image bounds.
int ff = 0; //number of positions to move
Bitmap b2;
private void button1_Click(object sender, EventArgs e)
{
if (ff == 0) { b2 = new Bitmap(pictureBox1.Image);} //original image as bitmap b2
Bitmap b1 = new Bitmap(pictureBox1 .Width ,pictureBox1.Height ); //new bitmap with rectangular region of original image
Rectangle r1 = new Rectangle(ff++, 0, pictureBox1.Width, pictureBox1.Height );
Graphics g = Graphics.FromImage(b1);
g.DrawImage(b2, 0, 0, r1, GraphicsUnit.Pixel);
g.Dispose();
pictureBox1.Image = null;
pictureBox1.Image = (Image)b1;
pictureBox1.Refresh();
}

Not sure if it really answers your question, but this seems like a fun reason to play with Reactive Extensions (Rx). This video demonstrates nicely how well this stuff works with asynchronous events like mouse-input.

C#, how to make a picture background transparent?

I have a picturebox with a png in it. Yet even when I set the BackColor to Transparent, it is not transparent. Any ideas what might be wrong? :)
Thanks!

I have also faced the problem regarding transparent pictures.
you have to Draw it through code.
See my question A PictureBox Problem
EDIT:
In paint event (Control containing Background Image)
write this
//If added your image in project's resources get from there OR your Image location
Image img = yourNamespace.Properties.Resources.yourPicture;
e.Graphics.DrawImage(img,50,50,100,100);

Your PNG file should also have the transparent background. This is can be done while creating the image(png) files.

You really have to draw it through code. Place a pictureBox on your form, set sizeMode and docking as you like. Then you may fire the following function on the pictureBox's PAINT event:
public void LogoDrawTransparent(PaintEventArgs e)
{
// Create a Bitmap object from an image file.
Image myImg;
Bitmap myBitmap;
try
{
myImg = cls_convertImagesByte.GetImageFromByte(newImg);
myBitmap = new Bitmap(myImg); // #"C:\Temp\imgSwacaa.jpg");
// Get the color of a background pixel.
Color backColor = myBitmap.GetPixel(0, 0); // GetPixel(1, 1);
Color backColorGray = Color.Gray;
Color backColorGrayLight = Color.LightGray;
Color backColorWhiteSmoke = Color.WhiteSmoke;
Color backColorWhite = Color.White;
Color backColorWheat = Color.Wheat;
// Make backColor transparent for myBitmap.
myBitmap.MakeTransparent(backColor);
// OPTIONALLY, you may make any other "suspicious" back color transparent (usually gray, light gray or whitesmoke)
myBitmap.MakeTransparent(backColorGray);
myBitmap.MakeTransparent(backColorGrayLight);
myBitmap.MakeTransparent(backColorWhiteSmoke);
// Draw myBitmap to the screen.
e.Graphics.DrawImage(myBitmap, 0, 0, pictureBox1.Width, pictureBox1.Height); //myBitmap.Width, myBitmap.Height);
}
catch
{
try { pictureBox1.Image = cls_convertImagesByte.GetImageFromByte(newImg); }
catch { } //must do something
}
}
This is my class that is referenced in the above function:
class cls_convertImagesByte
{
public static Image GetImageFromByte(byte[] byteArrayIn)
{
MemoryStream ms = new MemoryStream(byteArrayIn);
Image returnImage = Image.FromStream(ms);
return returnImage;
}
public static byte[] GetByteArrayFromImage(System.Drawing.Image imageIn)
{
MemoryStream ms = new MemoryStream();
imageIn.Save(ms, System.Drawing.Imaging.ImageFormat.Gif);
return ms.ToArray();
}
}
Thanks. chagbert.

From what I learned I can't do it within a windows form, as it doesn't have layers for the images. So guess will have to make it as WPF. :)

How did you create the background? Is that set by setting the Form.BackgroundImage?
If that background (the paper like image) is a container control, the transparency should just work.
However, If you are placing two PictureBox objects on top of eachother this doesn't work. The transparent area takes on the color of its parent object. If you have two PictureBox objects they both will have the Form as their parent. If this is your situation, it can be solved by setting the transparent image's Parent property to be the background image.
private void Form1_Load(object sender, EventArgs e)
{
transparentPictureBox.Parent = backgroundPictureBox;
}
When changing the Parent property, the Location of the tranparentPictureBox will become relative to its new parent. You'd have to subtract the x and y coordinates of the background image from the transparent image. See my answer on A PictureBox Question for an example with a screen shot.
AFAIK, you can not set the Parent in the Designer, only in code. Therefore, the Designer will still not show a transparent image, but at runtime it should.
The same problem occurs if you place a transparent Label on top of a PictureBox object.