How to make image button

Question

I was wondering how could I do this. I know I can use the button component but it has the little gray stuff around it when I give it a image. With image button how could I show another image for the hover effect

Answer 1

You want to create a button with no border but displays different images when the user hovers over it with the mouse? Here's how you can do it:

1. Add an ImageList control to your form at add two images, one for the button's normal appearance and one for when the mouse is hovering over.

2. Add your button and set the following properties:
   FlatStyle = Flat
   FlatAppearance.BorderColor (and maybe MouseOverBackColor & MouseDownBackColor) to your form's background color
   ImageList = the ImageList you added to the form
   ImageIndex to the index value of your normal image

Code the MouseHover and MouseLeave events for the button like this:

// ImageList index value for the hover image.
private void button1_MouseHover(object sender, EventArgs e) => button1.ImageIndex = 1;

// ImageList index value for the normal image.
private void button1_MouseLeave(object sender, EventArgs e) => button1.ImageIndex = 0;

I believe that will give you the visual effect you're looking for.

Answer 2

Small summary (Border, MouseDownBackColor, MouseOverBackColor)

FlatApperance

BorderColor = Black or what ever you want
BorderSize = can be set to 0
MouseDownBackColor = Transparent
MouseOverBackColor = Transparent

Text = none

For MouseDown:

// ImageList index value for the mouse down image.
private void button1_MouseDown(object sender, MouseEventArgs e) => button1.ImageIndex = 2;