[C# 윈폼] 윈폼 Custom으로 ImageButton 컨트롤 만들기

안녕하세요.

 

오늘은 C# 윈폼에서 Custom으로 직접 ImageButton 컨트롤을 만드는 방법에 대해서 알려드리려고 합니다.

 

그리고 그렇게 직접 만든 ImageButton 컨트롤을 이용하여 실제로 윈폼 프로젝트에 해당 컨트롤을 배치하여 사용하는 것까지 해보도록 할게요.

 

먼저 빈 윈폼 프로젝트를 생성해 주시기 바랍니다.

 

빈 윈폼 프로젝트 생성

위와 같이 윈폼 프로젝트를 생성 하였다면, Custom ImageButton 컨트롤을 생성할 ImageButton 클래스를 하나 생성하겠습니다.

ImageButton.cs 예제코드

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66

using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows.Forms;   namespace CustomImageButton {     public class ImageButton : Panel     {         private Image image01 = System.Drawing.SystemIcons.Hand.ToBitmap();         private Image image02 = System.Drawing.SystemIcons.Hand.ToBitmap();           [Browsable(true)]         public Image Image_01         {             get             {                 return this.image01;             }               set             {                 this.image01 = value;                 this.BackgroundImage = this.image01;             }         }           [Browsable(true)]         public Image Image_02         {             get             {                 return this.image02;             }               set             {                 this.image02 = value;             }         }           public ImageButton()         {             this.MouseDown += ImageButton_MouseDown;             this.MouseUp += ImageButton_MouseUp;               this.BackgroundImage = this.image01;             this.BackgroundImageLayout = ImageLayout.Zoom;         }           void ImageButton_MouseDown(object sender, MouseEventArgs e)         {             this.BackgroundImage = this.image02;         }           void ImageButton_MouseUp(object sender, MouseEventArgs e)         {             this.BackgroundImage = this.image01;         }     } }   Colored by Color Scripter

cs

 

여기까지 따라 하셨다면 이제 프로젝트를 한번 빌드해 주시기 바랍니다.

 

그리고, 다시 메인폼으로 돌아오셔서 도구상자를 보시게 되면 “ImageButton” 이라는 사용자 컨트롤로 내가 만든 ImageButton 컨트롤이 생성된 것을 확인하실 수 있습니다.

 

 

위와 같이 ImageButton 컨트롤이 생성된 것을 보실 수 있습니다.

 

이제 이 컨트롤을 윈폼에 배치하여 주시기 바랍니다.

 

그리고 저는 Resource 폴더에 미리 아래와 같이 Search.png, ShowOption.png 2개의 이미지 파일을 넣어 놓앟고, 이 2개의 이미지를 ImageButton 컨트롤 속성인 Image1, Image2에 저장을 해놓았습니다.

 

리소스 이미지 저장

 

ImageButton 속성

 

프로그램 실행 결과

위와 같이 ImageButton 설정을 모두 끝내고 프로그램을 실행하게 되면, 처음에는 Image01번째 이미지가 보여지다가 만약에 사용자가 마우스를 ImageButton 컨트롤에 가져다 대고 클릭을 하게 되면 Image02 이미지로 바뀌는 것을 확인하실 수 있습니다.

 

그리고, 다시 마우스 클릭을 떼면 원래 Image01 이미지로 다시 돌아오는 것을 확인하실 수 있습니다.

 

이로써 오늘은 Custom으로 직접 ImageButton 컨트롤 만드는 방법에 대해서 알아 보았습니다.

 

감사합니다.