Mini Paint w C#

Autor: Marcin Hałaczkiewicz Opublikowano: 1 czerwca 2006 Odsłon: 93 950

Skomentuj

Tym razem napiszemy prostą aplikację w stylu MS Paint. Zapoznamy się z podstawowymi metodami rysowania w .NET. Program będzie umożliwiał proste malowanie, zmianę koloru pędzla a także zapisanie efektu do pliku bmp. Nauczymy się korzystać z wbudowanych w .NET okienek dialogowych do wybierania koloru oraz zapisu.

Jak zwykle zaczniemy od stworzenia nowego projektu. Nadajemy mu nazwę Mini Paint, zmieniamy nazwę pliku z formą na MiniPaint.cs i nadajemy jej nazwę frmMiniPaint. Następnie zmieniamy jej właściwości: AutoSizeMode na GrowAndShrink, MaximizeBox na false - dzięki temu nie będziemy mogli zmaksymalizować ani zmienić wielkości formy. Rozmiar (Size) proponuje ustawić na 514x478. Do formy dodajemy Panel. Lokujemy go w pozycji 20x20 i ustawiamy Size na 400x400, po czym zmieniamy BackColor na White, jeszcze tylko musimy ustawić właściwość BorderStyle na FixedSingle - aby nasze 'płótno' było obramowane. Następnie dodajemy PictureBox do panelu (wystarczy kliknąć z wybranym pictureboxem na panel). Jego położenie to 0x0, rozmiar: 400x400, nazwa: imgObrazek. Następnie dorzucamy 3 przyciski (button) i nazywamy je kolejno: cmdZapisz, cmdCzysc i cmdKolor. Później tworzymy etykietę i nadajemy jej nazwę lblKolor, czyścimy pole Text, ustawiamy BackColor na Black, AutoSize na false oraz Size na 23x23. Kontrolka ta posłuży nam do wyświetlania aktualnego koloru. Po wszystkich operacjach okno programu powinno wyglądać mniej więcej tak:

Zajmijmy się oprogramowywaniem funkcji aplikacji. Chcielibyśmy, aby z wciśniętym lewym przyciskiem myszy można było rysować. Zacznijmy od dodania do formy kilku zmiennych (widok kodu formy). Dopiszmy:

private Graphics g;


private Point p = Point.Empty;


private Pen pioro;

Pierwsze pole posłuży do reprezentowania grafiki i rysowania jej. Drugie to zmienna pomocnicza służąca do kreślenia linii pomiędzy punktem, w którym była ostatnio myszka (to jest właśnie p) a punktem, w którym znajduje się aktualnie. Zmienna pioro będzie reprezentować pióro o kolorze, w którym malujemy. Zmienne te inicjujemy w konstruktorze formy frmMiniPaint(). Oto jego kod:


public frmMiniPaint();

{

InitializeComponent();

imgObrazek.Image = new Bitmap(400, 400);

    g = Graphics.FromImage(imgObrazek.Image);

    pioro = new Pen(Color.Black);
}

Po zadeklarowaniu ww. wartości tworzymy obsługę zdarzenia MouseDown dla kontrolki imgObrazek. W jego wnętrzu wpisujemy:

if (e.Button == MouseButtons.Left)


p = e.Location;

Zapamiętujemy w ten sposób położenie kursora w momencie naciśnięcia lewego przycisku myszki. Teraz dodajmy zdarzenie MouseMove również dla imgObrazek. W środku wpisujemy kod:

if (e.Button == MouseButtons.Left) { g.DrawLine(pioro, p, e.Location); p = e.Location;



   
imgObrazek.Refresh();


}

W tym miejscu rysujemy linię pomiędzy punktem zapamiętanym w p a aktualnym położeniem kursora. Następnie w p zapamiętujemy nowy punkt (tam gdzie jest kursor) oraz odświeżamy obraz. W tym momencie program już spełnia swoją najważniejszą funkcję - maluje. Zajmijmy się teraz oprogramowaniem przycisków. Zacznijmy od cmdCzysc. Klikamy na nim dwa razy (w edytorze graficznym) i w środku funkcji umieszczamy kod:

g.Clear(Color.White); imgObrazek.Refresh();

Linie te czyszczą pole do rysowania oraz odświeżają obraz. Utwórzmy teraz zdarzenie Click dla cmdKolor. Wewnątrz wpisujemy:

ColorDialog dialog = new ColorDialog(); dialog.Color = lblKolor.BackColor; dialog.ShowDialog(); lblKolor.BackColor = dialog.Color; pioro.Color = dialog.Color;

Korzystamy tutaj z jednego z wbudowanych w .NET okien dialogowych - do wyboru koloru. Aby je wywołać wystarczy wywołać metodę ShowDialog. Wybrany kolor będzie znajdował się w zmiennej Color - przypisujemy go do tła etykiety lblKolor oraz do koloru używanego przez nas pióra pioro. Pozostał nam jedynie zapis do pliku. Dodajemy zdarzenie Click dla cmdZapisz i wewnątrz wpisujemy:

SaveFileDialog dialog = new SaveFileDialog(); dialog.Filter = "bmp|*.bmp"; dialog.ShowDialog(); if (dialog.FileName != "") imgObrazek.Image.Save(dialog.FileName);

Okno dialogowe do wybrania pliku do zapisu zachowuje się podobnie do kontrolki ColorDialog. Uaktywniamy je metodą ShowDialog, a następnie odczytujemy wybrany plik z pola FileName. Mamy do dyspozycji również filtr, dzięki któremu możemy wybierać jedynie dane konkretnego typu. Gdy jakiś plik zostanie wskazany, zapisujemy do niego nasz obrazek. Po więcej szczegółów dotyczących sposobu korzystania z tego okna dialogowego odsyłam do dokumentacji MSDN.

I tak oto ukończyliśmy kolejny program. Wydawałoby się, że nie tak łatwo jest stworzyć aplikację do rysowania, a jednak okazało się to niezwykle proste. Wszystko dzięki ogromowi bibliotek wbudowanych w .NET. Dzięki nim, gdy chcemy wybrać plik do zapisu czy kolor nie musimy tworzyć własnych klas, co zajęłoby dużo czasu. Po prostu korzystamy z gotowych rozwiązań, które wizualnie są świetnie znane wszystkim użytkownikom Windows.

Stworzony tutaj program wraz z plikami źródłowymi możemy pobrać stąd.

Mini Paint w C#

Mini Paint w C#

Zobacz również

Komentarze

Dodaj swój komentarz