Podstawy projektowania interfejsu aplikacji, metody zdarzeniowe

Podstawy projektowania interfejsu aplikacji, metody zdarzeniowe 1. Przycisk i okno informacyjne Pierwszym oknem po uruchomieniu aplikacji jest tabela Start Page. Aby utworzyć nowy projekt kliknij New Project w sekcji Start. Wybierz Windows Form Application. W dolnej części okna dialogowego możesz zmienić domyślną nazwę aplikacji. Następnie kliknij OK. Pojawi się okno IDE, jeśli po lewej stronie nie pojawi się lista kontrolek Toolbox, rozwiń ją. Zmień domyślną nazwę formy aplikacji na dowolną w oknie właściwości Properties (właściwość Text). Następnie umieść na formie przycisk (Button) przeciągając go z listy kontrolek, po czym zmień jego tekst na OK. Nazwę przycisku i każdego innego obiektu, łącznie z formą, może zmienić poprzez pole (Name) w panelu właściwości. Zwróć uwagę, że możesz zmieniać rozmiar zarówno formy, jak i każdego elementu, który się na niej znajduje. Ponadto możesz pozycjonować elementy na formie względem siebie. Własność Anchor w oknie właściwości pozwala na zablokowanie odległości zaznaczonego obiektu od wybranych krawędzi formy. Teraz kliknij podwójnie na przycisk i wpisz następujący kod: MsgBox("To moja pierwsza aplikacja okienkowa") Przed chwilą została zdefiniowana metoda Butto1_Click wywoływana elementem Button1 po zdarzeniu Click. Nazwa metody może być dowolna, podobnie jak liczba i rodzaje elementów służących do jej wywołania. Teraz uruchom aplikację przyciskiem F5. Po naciśnięciu przycisku aplikacji pojawi się okno informacyjne z Twoim tekstem. Możesz także napisać kod wykonujący działanie matematyczne. Utwórz nowy projekt, kliknij podwójnie na formę i wpisz poniższy kod: Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load MsgBox("2" & "+" & "5" & "=" & 2 + 5) Znak & służy do łączenia wartości typu String. Po uruchomieniu aplikacji najpierw pojawi się okno informacyjne, po kliknięciu przycisku OK. pojawi się forma. Aby zamknąć aplikację po kliknięciu przycisku OK. okna informacyjnego uzupełnij powyższy kod do postaci: Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load MsgBox("2" & "+" & "5" & "=" & 2 + 5) Me.Close() Podczas pisania kodu, po napisaniu nazwy obiektu Panel1 i postawieniu kropki, tj. operatora umożliwiającego dostęp do własności i metod obiektu, pozostaw przez chwilę kod bez zmian. Po chwili pojawi się okno prezentujące wszystkie dostępne własności i metody obiektu Panel1. Jest to element mechanizmu wglądu w kod o nazwie IntelliSense. Dzięki niemu ręczne pisanie kodu jest znacznie przyjemniejsze. Wystarczy bowiem z listy wybrać pozycję BackColor określającą kolor tła panelu i potwierdzić kombinacją Ctrl+Enter. Programista nie musi znać na pamięć wszystkich klas 1/14

i wszystkich ich metod i własności, najczęściej wystarczy znajomość języka angielskiego. Potwierdzenie tylko klawiszem Enter spowoduje wstawienie wybranego słowa i przejście do nowego wiersza, co nie zawsze jest zamierzeniem programisty. Następnie postaw operator przypisania = i wpisz nazwę klasy Color, po której znowu postaw kropkę. Jeszcze raz IntelliSense zaprezentuje listę dostępnych elementów. Okno IntelliSense można przywołać kombinacją Ctrl+J. Warto zaznaczyć, że tego rodzaju mechanizmy wspomagające programowanie ręczne występują w większości współczesnych narzędzi programistycznych. Do przechodzenia pomiędzy oknem kodu programowania i projektowania wizualnego wykorzystaj przycisk F7 oraz kombinację Shift+F7. Rozbuduj aplikację tak, aby na jednym oknie informacyjnym wyświetlały się wyniki dodawania, odejmowania, mnożenia i dzielenia dwu liczb. 2. Zmiana parametrów formy z wykorzystaniem okna Properties i kodu programu Przyjrzyj się właściwościom umieszczonym w oknie Properties, możesz zmieniać ich wartości. Tytuł formy już został zmieniony, teraz zmień właściwość Name na Moja forma, BackColor na Blue, MaximizeBox na False i uruchom aplikację. Zwróć uwagę, jak Twoje zmiany wpłynęły na wygląd okienka. Właściwości formy możesz zmieniać także poprzez kod programu. Forma jest obiektem, do którego możesz się odnieść korzystając ze słowa kluczowego Me. Własność obiektu może być definiowana poprzez specyficzną nazwę poprzedzoną kropką lub spacją: NazwaObiektu.własność. Aby formie nadać te same parametry, jak powyżej, kliknij podwójnie na formę i wpisz następujący kod: Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load Me.Text = "To moja pierwsza aplikacja okienkowa" Me.BackColor = Color.Blue Me.MaximizeBox = False Me.MinimizeBox = False 3. Pole tekstowe i etykieta Utwórz nowy projekt aplikacji okienkowej. Z listy ToolBox wprowadź na formę dwa pola tekstowe TextBox i jeden przycisk Button. Przycisk nazwij Suma. Naciśnięcie przycisku spowoduje wyświetlenie okna z wynikiem sumowania liczb wpisanych w pola tekstowe. Wartość wpisana w pola tekstowe jest przechowywana we własnościach TextBox1.Text i TextBox2.Text. Kliknij podwójnie na przycisk i wpisz kod: MsgBox("Suma wynosi " & Val(TextBox1.Text) + Val(TextBox2.Text)) Uruchom program. Funkcja Val konwertuje wartość tekstową na numeryczną. Bazując na powyższym przykładzie dodaj na formę dwie etykiety Label. Własność pierwszej zmień na Suma =, zmień także czcionkę na pogrubioną i jej rozmiar na 10 (własność Font). W drugiej etykiecie usuń wartość z własności Text, zmień czcionkę na pogrubioną o wielkości 10 i zmień jej kolor tła na biały. Zmień poprzedni kod na następujący: 2/14

Label2.Text = Val(TextBox1.Text) + Val(TextBox2.Text) Uruchom program. Rozbuduj aplikację tak, aby liczyła pole prostokąta na podstawie podanych długości boków. 4. Listy nierozwijalne i rozwijalne Kontrolka ListBox służy do gromadzenia elementów na liście nierozwijalnej, które użytkownik może wybrać. Elementy mogą być dodawane poprzez kod programu, jak i podczas działania aplikacji. Stwórz nowy projekt i umieść na formie kontrolkę ListBox. Zaznacz ją i z okna właściwości wybierz Items celem otworzenia okna elementów. Wpisz kilka dowolnych pozycji (np. Samsung, Sony, LG, HP) i potwierdź przyciskiem OK. To co zostało wpisane znajduje się już w oknie elementów. Jest to sposób wprowadzania danych poprzez kod programu. Druga metoda wypełniania listy wykorzystuje metodę Add(). Wprowadź na formę przycisk i nazwij go Dodaj element. Następnie kliknij podwójnie na nim i wpisz kod: ListBox1.Items.Add("Asus") Możesz także pozwolić użytkownikowi na wpisanie własnego elementu. W tym celu zmodyfikuj powyższy kod do postaci: Dim mojobiekt mojobiekt = InputBox("Wpisz obiekt()") ListBox1.Items.Add(mojObiekt) Aby usunąć obiekt na poziomie programowania po prostu otwórz listę elementów i usuń zbędny element. Aby użytkownik mógł usuwać elementy, niezbędne jest zastosowanie metody Remove(). Dodaj kolejny przycisk i nazwij go Usuń element. Następnie przypisz mu metodę: ListBox1.Items.Remove("HP") Aby wyczyścić listę zmodyfikuj kod do postaci: ListBox1.Items.Clear() Kontrolka ComboBox służy do prezentacji elementów w postaci listy rozwijalnej. Umieść teraz tą kontrolkę na swojej formie i wypełnij ją danymi w identyczny sposób, jak dla ListBox. Dodawanie elementów dla tej kontrolki także może się odbyć z wykorzystaniem metody Add(), a usuwanie z wykorzystaniem metody Remove(). 3/14

Rozbuduj formę o dwa nowe przyciski obsługujące komponent ComboBox: jeden do wprowadzania danych i jeden do usuwania. 5. Pobieranie obrazu do kontrolki PictureBox Utwórz nowy projekt, umieść w nim kontrolkę PictureBox i dwa przyciski. Pierwszy nazwij Otwórz, a drugi Zamknij. Zmień własność BordeStyler kontrolki PictureBox na FixedSingle, a tło na białe. Teraz wybierz własność Image celem otworzenia okna wyboru pliku. Wybierz dowolny obraz z zasobów lokalnych, po czym kliknij przycisk Open. Ten sam efekt możesz uzyskać poprzez następujący kod programu: Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load PictureBox1.Image = Image.FromFile("ścieżka dostepu") Należy także zmienić własność SizeMode na StretchImage celem dopasowania obrazka do wielkości okna. Teraz umożliwisz użytkownikowi wybieranie własnego obrazka do wyświetlania. Dodaj na formę kontrolkę OpenFileDialog. Ta kontrolka jest niewidoczna, ale można ją zaznaczyć w dolnej części ekranu. Aby umożliwić otwieranie tylko plików graficznych należy zdefiniować filtry rozszerzeń. We własności Filter wpisz: pliki JPEG *.JPG pliki GIF *.GIF pliki bitmap *.BMP. Następnie kliknij podwójnie na przycisk Otwórz i wpisz kod: If OpenFileDialog1.ShowDialog = Windows.Forms.DialogResult.OK Then PictureBox1.Image = Image.FromFile(OpenFileDialog1.FileName) Zajmij się teraz przyciskiem Zamknij. Kliknij podwójnie na nim i wpisz kod: Me.Close() Dokonasz jeszcze jednej modyfikacji tej aplikacji. Pozwolisz na jej zamknięcie poprzez przycisk Esc na klawiaturze. Aby tego dokonać należy wykorzystać zdarzenie formy KeyPress, które sygnalizuje naciśnięcie któregokolwiek z klawiszy poza klawiszami specjalnymi. W oknie właściwości formy zmień własność KeyPreview na True. Zmień zakładkę na Events (ikona z błyskawicą) i kliknij dwukrotnie przy zdarzeniu KeyPress, po czym wpisz kod: Private Sub Form1_KeyPress(ByVal sender As System.Object, ByVal e As System.Windows.Forms.KeyPressEventArgs) Handles MyBase.KeyPress If e.keychar = Chr(27) Then Close() Klawiszowi Esc w tablicy ASCII odpowiada numer 27. Jeśli nie znasz tej tablicy, a chcesz wykorzystać przycisk do wywołania metody w aplikacji, użyj funkcji Asc(), a w nawiasie podaj przycisk wywołujący. 4/14

Rozbuduj aplikację aby przy próbie jej zamknięcia pojawiło się okno informujące o zamykaniu aplikacji. 6. Pole zaznaczania Kontrolka CheckBox przydaje się do zaznaczania więcej, niż jednego elementu powiązanego z daną kontrolką (status zapisany w Checked). Utwórz nowy projekt, nazwij go Koszyk zakupowy i dodaj siedem kontrolek Label, dwa przyciski i sześć elementów CheckBox. Przyciski nazwij: Licz i Resetuj. Tekst sześciu etykiet dobierz według uznania, tekst siódmej będzie wypełniany podczas działania aplikacji, zatem usuń wartość domyślną. Zadeklarujesz cenę towaru jako stałe. Aby policzyć wartość elementów użyjesz operatora matematycznego +=. Użyjesz także metody ToString do wyświetlania wartości koszyka. Dla przycisku Licz zdefiniuj metodę: Const Towar1 As Integer = 100 Const Towar2 As Integer = 500 Const Towar3 As Integer = 200 Const Towar4 As Integer = 80 Const Towar5 As Integer = 300 Const Towar6 As Integer = 150 Dim suma As Integer If CheckBox1.Checked Then suma += Towar1 If CheckBox2.Checked Then suma += Towar2 If CheckBox3.Checked Then suma += Towar3 If CheckBox4.Checked Then suma += Towar4 If CheckBox5.Checked Then suma += Towar5 If CheckBox6.Checked Then suma += Towar6 Label7.Text = suma.tostring("c") Dla przycisku Resetuj zdefiniuj metodę: CheckBox1.Checked = False CheckBox2.Checked = False CheckBox3.Checked = False CheckBox4.Checked = False CheckBox5.Checked = False CheckBox6.Checked = False Zmodyfikujesz teraz aplikację tak, aby po zaznaczeniu danego towaru jego nazwa została pogrubiona. Rozbuduj kod programu do postaci: Const Towar1 As Integer = 100 5/14

Const Towar2 As Integer = 500 Const Towar3 As Integer = 200 Const Towar4 As Integer = 80 Const Towar5 As Integer = 300 Const Towar6 As Integer = 150 Dim suma As Integer If CheckBox1.Checked Then suma += Towar1 Label1.Font = New Font(Label1.Font, FontStyle.Bold) Label1.Font = New Font(Label1.Font, FontStyle.Regular) If CheckBox2.Checked Then suma += Towar2 Label2.Font = New Font(Label2.Font, FontStyle.Bold) Label2.Font = New Font(Label2.Font, FontStyle.Regular) If CheckBox3.Checked Then suma += Towar3 Label3.Font = New Font(Label3.Font, FontStyle.Bold) Label3.Font = New Font(Label3.Font, FontStyle.Regular) If CheckBox4.Checked Then suma += Towar4 Label4.Font = New Font(Label4.Font, FontStyle.Bold) Label4.Font = New Font(Label4.Font, FontStyle.Regular) If CheckBox5.Checked Then suma += Towar5 Label5.Font = New Font(Label5.Font, FontStyle.Bold) Label5.Font = New Font(Label5.Font, FontStyle.Regular) If CheckBox6.Checked Then suma += Towar6 Label6.Font = New Font(Label6.Font, FontStyle.Bold) Label6.Font = New Font(Label6.Font, FontStyle.Regular) Label7.Text = suma.tostring("c") Opracował: Damian Krzesimowski Dokonaj modyfikacji programu, aby styl czcionki etykiety zmieniał się podczas zaznaczania odpowiadającego mu pola zaznaczania. W tym celu zdefiniuj metodę CheckedChanged. 7. Pole wyboru Podobnie, jak kontrolka CheckBox, tak samo RadioButton służy do zaznaczania elementów. Działanie tej kontrolki jest jednak nieco inne, tylko jedna ze zgrupowanych kontrolek RadioButton może być zaznaczona. Utwórz nowy projekt, umieść na formie jeden przycisk, trzy obiekty RadioButton i jeden Label. Domyślny tekst etykiety usuń, a pola wyboru nazwij: Czerwony, Zielony i Niebieski. Zdefiniuj metodę dla przycisku: Dim Kolor As String If RadioButton1.Checked Then Kolor = "Czerwony" Label1.ForeColor = Color.Red 6/14

If RadioButton2.Checked Then Kolor = "Zielony" Label1.ForeColor = Color.Green Kolor = "Niebieski" Label1.ForeColor = Color.Blue Label1.Text = Kolor Rozbuduj aplikację o kolejne trzy przyciski wyboru. Niech te przyciski działają niezależnie od poprzednich i pozwalają na formatowanie styli czcionki (Bold, Italic, Underline). Wykorzystaj dwie kontrolki GroupBox i umieść w nich po trzy przyciski wyboru. 8. Rysowanie linii Aby cokolwiek narysować na formie, należy wprowadzić obiekt graficzny metodą CreateGraphics(). Aby coś narysować możesz użyć następującego wyrażenia: Dim mojagrafika As Graphics = me.creategraphics Aby narysować prostokąt użyj wyrażenia: Dim mojagrafika As Graphics = PictureBox1.CreateGraphics Możesz także utworzyć pole tekstowe poprzez wyrażenie: Dim mojagrafika As Graphics = TextBox1.CreateGraphics Obiekt graficzny sam w sobie niczego nie rysuje dopóki nie wywołasz w nim odpowiednich metod. Musisz najpierw wywołać pisak jako narzędzie rysujące. Zrobisz to wyrażeniem: mojpisak = New Pen(Brushes.Kolor, SzerokośćLinii) Pierwszy argument definiuje kolor pisaka, a drugi szerokość linii. Przykładowy kod programu dla pędzla koloru niebieskiego o szerokości 10px: mojpisak = New Pen(Brushes.DarkBlue, 10). Pisak możesz także definiować następującym wyrażeniem: Dim mojpisak As Pen mojpisak = New Pen(Drawing.Color.Blue, 5) Teraz narysujesz prostą pojedynczą linię. Utwórz nowy projekt, umieść na formie przycisk, kliknij na nim podwójnie i wpisz następujący kod: pisak = New Pen(Brushes.DarkMagenta, 20) grafika.drawline(pisak, 60, 180, 220, 50) Zwróć uwagę na polecenie rysowania, podajesz tu współrzędne w postaci (x1, y1, x2, y2). Rozbuduj aplikację tak, aby narysowany został trójkąt. 9. Rysowanie prostokąta Prostokąt można narysować na dwa sposoby. Pierwszy to użycie metody DrawRectangle z podaniem lewego-górnego wierzchołka oraz szerokości i wysokości. Oczywiście należy także stworzyć obiekt graficzny i pisak. Utwórz nowy projekt, umieść przycisk i zdefiniuj dla niego metodę: 7/14

pisak = New Pen(Brushes.DarkMagenta, 5) grafika.drawrectangle(pisak, 10, 10, 100, 50) Drugi sposób to utworzenie prostokątnego obiektu i dopiero wtedy użycie metody DrawRectangle. Umieść na formie drugi przycisk i zdefiniuj dla niego metodę: Dim grafika2 As Graphics = Me.CreateGraphics Dim pisak2 As Pen pisak2 = New Pen(Brushes.DarkBlue, 10) Dim prostokat As New Rectangle prostokat.x = 110 prostokat.y = 10 prostokat.width = 100 prostokat.height = 50 grafika2.drawrectangle(pisak2, prostokat) Możesz także utworzyć prostokąt w jednej linii kodu: Dim prostokat As New Rectangle(X, Y, szerokość, wysokość) Nieważne ile razy figura zostanie narysowana w pewnym momencie zechcesz zmienić format linii na np. kropkowany, kreskowany, złożony ze znaków ^ itd. Możesz to zrobić poprzez polecenie: pedzel.dashstyle = Drawing.Drawing2D.DashStyle.Dot Zmodyfikuj metodę pierwszego przycisku do postaci: pisak = New Pen(Brushes.DarkMagenta, 5) pisak.dashstyle = Drawing.Drawing2D.DashStyle.Dot grafika.drawrectangle(pisak, 10, 10, 100, 50) Rozbuduj projekt o kolejne przyciski, które będą wywoływać metody rysowania prostokątów z parametrami definicji pędzla Dash, DashDot, DashDotDot i Solid. 10. Rysowanie elipsy Podstawą do rysowania elipsy i okręgu jest prostokąt. Oznacza to, że najpierw powinien być zdefiniowany obiekt prostokątny. Następnie można użyć metody DrawEllipse. Oczywiście jest możliwość narysowania elipsy bez uprzedniego przygotowania jej obramowania w postaci prostokąta, Poznasz obie metody. Utwórz nowy projekt, umieść na formie przycisk i zdefiniuj metodę: pisak = New Pen(Drawing.Color.DarkTurquoise, 5) Dim prostokat As New Rectangle prostokat.x = 10 prostokat.y = 10 prostokat.width = 200 prostokat.height = 100 8/14

grafika.drawellipse(pisak, prostokat) Metoda druga, czyli bez obramowania. Dodaj kolejny przycisk i zdefiniuj dla niego metodę: Dim pisak2 As Pen pisak2 = New Pen(Drawing.Color.Blue, 5) Dim grafika2 As Graphics = Me.CreateGraphics grafika2.drawellipse(pisak2, 110, 10, 200, 100) Zmodyfikuj program tak, aby rysowanymi figurami były dwa współśrodkowe okręgi. 11. Rysowanie tekstu Aby narysować tekst należy użyć metody DrawString w postaci: mojagrafika.drawstring(mojtekst, mojaczcionka, mojpedzel, X, Y) Czcionkę można zdefiniować zgodnie z przykładem: mojaczcionka = New System.Drawing.Font( Verdana, 20) Podane zostały tu tylko dwa argumenty, tj. nazwa i wielkość czcionki. Możesz także podać trzeci argument dotyczący stylu (FontStyle.Bold, FontStyle.Italic, FontStyle.Underline, FontStyle.Regular). Aby zdefiniować pędzel wykorzystaj następujące wyrażenie: Dim mojpedzel As Brush mojpedzel = New Drawing.SolidBrush(Color.KolorPedzla) Utwórz nowy projekt, umieść na formie przycisk I zdefiniuj dla niego metodę: Dim czcionka As Font Dim pedzel As Brush pedzel = New Drawing.SolidBrush(Color.BlueViolet) czcionka = New System.Drawing.Font("Candara", 20, FontStyle.Italic) grafika.drawstring("tekst do wyświetlenia", czcionka, pedzel, 10, 10) Jeśli nie chcesz tworzyć czcionki i pędzla musisz przedefiniować metodę. Utwórz drugi przycisk i zdefiniuj dla niego metodę: grafika.drawstring("drugi tekst do wyświetlenia", Me.Font, System.Drawing.Brushes.DarkMagenta, 10, 110) Wykorzystana zostanie czcionka istniejącego elementu, takiego jak forma i kolory systemowe. 12. Rysowanie wieloboku Wielobok jest figurą zamknięta, opisaną przez co najmniej trzy wierzchołki. Aby ją narysować należy podać współrzędne tych wierzchołków w postaci: Dim A1 As New Point(X1, Y1) Dim A2 As New Point(X2, Y2) 9/14

10/14 Opracował: Damian Krzesimowski Dim An As New Point(Xn, Yn) Po zdefiniowaniu współrzędnych musisz zdefiniować strukturę grupowania wszystkich punktów, czyli kolejność łączenia punktów, z wykorzystaniem wyrażenia: Dim mojepunkty As Point()={A1, A2,,An) Na końcu użyj metody DrawPoligon w następujący sposób: Dim mojagrafika As Graphics = Me.CreateGraphics mojagrafika.drawpoligon(mojpedzel, mojepunkty) Aby narysować trójkąt z wykorzystaniem opisywanej tu metody utwórz nowy projekt, umieść na formie przycisk i zdefiniuj dla niego metodę: Dim A As New Point(10, 10) Dim B As New Point(100, 50) Dim C As New Point(60, 150) Dim punkty As Point() = {A, B, C} pisak = New Pen(Drawing.Color.Blue, 5) grafika.drawpolygon(pisak, punkty) Czas na rysowanie czworoboku. Dodaj nowy przycisk i zdefiniuj dla niego metodę: Dim A As New Point(110, 110) Dim B As New Point(200, 150) Dim C As New Point(160, 250) Dim D As New Point(60, 300) Dim punkty As Point() = {A, B, C, D} pisak = New Pen(Drawing.Color.Red, 5) grafika.drawpolygon(pisak, punkty) Aby narysować wycinek koła użyj metody DrawPie w postaci: mojagrafika.drawpie(mojpedzel, X, Y, szerokość, wysokość, kątpoczątkowy, zakreskątowy) X i Y to współrzędne prostokąta obramowującego. Uwaga: kąty mierzone są w stopniach! Aby się przekonać, jak metodę zastosować w praktyce dodaj kolejny przycisk i definiuj dla niego metodę: Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click Dim pisak3 As Pen = New Pen(Drawing.Color.Green, 5) Dim grafika3 As Graphics = Me.CreateGraphics grafika3.drawpie(pisak3, 50, 50, 150, 150, 0, 60) Zmodyfikuj program tak, aby narysować sześciokąt foremny. 13. Wypełnianie figur kolorem Do celu wypełniania kształtów kolorem służą cztery metody: FillRectangle, FillEllipse, FillPolygon i FillPie. Niezbędna jest definicja pędzla w postaci: mojpedzel = New SolidBrush(Color.mojKolor)

Utwórz nowy projekt, umieść przycisk I zdefiniuj metodę: Opracował: Damian Krzesimowski Dim pedzel As Brush pisak = New Pen(Drawing.Color.Blue, 5) pedzel = New SolidBrush(Color.Coral) grafika.drawrectangle(pisak, 65, 50, 150, 150) grafika.fillrectangle(pedzel, 65, 50, 150, 150) Dodaj trzy przyciski i zdefiniuj dla nich metody rysujące i wypełniające kolorem: elipsę, pięciobok i wycinek koła. 14. Czasomierz Czasomierz (Timer)to interesująca kontrolka, która może być wykorzystana do zdarzeń zależnych od czasu. Przykładowo wykonasz teraz aplikację zegar elektroniczny. Utwórz nowy projekt i dodaj na formę kontrolkę Timer. Następnie dodaj kontrolę Label i zmień jej wielkość wedle uznania, natomiast czcionkę wyśrodkuj i wycentruj (własność ImageAlign). Ustaw także interwał czasomierza (Interval) na 1000 i jego własność Enabled na True. Kliknij czasomierz i zdefiniuj dla niego metodę: Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick Label1.Text = TimeOfDay Wykonasz teraz prosty stoper. Utwórz nowy projekt, umieść na formie kontrolkę Timer, trzy przyciski oraz jedną etykietę. Przyciski opisz jako: Start, Stop, Reset. Dla przycisku Start zdefinuj metodę: Timer1.Enabled = True Dla przycisku Stop zdefiniuj metodę: Timer1.Enabled = False Dla przycisku Reset zdefiniuj metodę: Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click Label1.Text = 0 Dla czasomierza zdefiniuj metodę: Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick Label1.Text = Val(Label1.Text) + 1 11/14

Zmień własność Interval czasomierza na 10, a Enabled na False. Korzystając z kontrolki Timer utworzysz teraz elektroniczną kostkę sześcienną i wykorzystasz generator liczb pseudolosowych (funkcja Rnd). Ponieważ wynikiem działania funkcji Rnd są liczby ułamkowe z zakresu 0 do 1, a Ciebie interesuje zakres liczb całkowitych od 1 do 6, zdefiniujesz wyrażenie: n = Int(1 + Rnd() * 6) Utwórz nowy projekt, umieść na nim kontrolkę Timer, jeden przycisk i jedną etykietę. Zmień interwał czasomierza na 10. Musisz zdefiniować, kiedy czasomierz przestanie działać, temu celowi zostanie zdefiniowana zmienna m. W ciele klasy umieść kod: Dim m, n As Integer Dla czasomierza zdefiniuj metodę: Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick m = m + 10 If m < 1000 Then n = Int(1 + Rnd() * 6) Label1.Text = n Timer1.Enabled = False m = 0 Dla przycisku zdefiniuj metodę: Timer1.Enabled = True Przebuduj poprzednią aplikację w taki sposób, aby to użytkownik decydował o tym, kiedy zatrzymać działanie czasomierza i wyświetlić wskazanie kostki. 15. Animacje Pomimo, że język Visual Basic nie jest opracowany do tworzenia animacji, można w nim kilka ciekawych rzeczy wykonać. Wykorzystasz w tym celu kontrolkę czasomierza. W pierwszym projekcie utworzysz obiekt przemieszczający się wzdłuż prostej z jednostajną prędkością. Na formę wprowadź PictureBox (nie przesadź z wielkością kontrolki musi mieć miejsce na ruch) i zaimportuj tu dowolny obrazek (własność BackgroundImage). Ustaw własność BackgroundImageLayout na Stretch. Teraz wprowadź kontrolkę czasomierza i ustaw interwał na 100. Następnie dodaj dwa przyciski, pierwszy opisz Animuj, a drugi Stop. Użyjesz własności Left pola obrazka do stworzenia ruchu. PictureBox.Left oznacza odległość kontrolki od lewej krawędzi formy. Kliknij czasomierz i zdefiniuj metodę: Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick If PictureBox1.Left < Me.Width Then PictureBox1.Left = PictureBox1.Left + 10 PictureBox1.Left = 0 12/14

Me.Width oznacza szerokość formy. Jeśli obrazek wyjdzie poza formę po stronie prawej, pojawi się po lewej stronie. Wartość 10 oznacza krok przesunięcia obrazka, razem z interwałem 100 daje prędkość 100px/1s. Czasomierz musi być aktywowany, w tym celu zdefiniuj metodę dla przycisku Animuj: Timer1.Enabled = True Aby zatrzymać animację zdefiniuj metodę dla przycisku Stop: Timer1.Enabled = False Zwiększ dziesięciokrotnie szybkość przesuwania obrazka i zmień trajektorię jego ruchu z lewa-góra na prawa-dół. Pamiętaj o tym, że obrazek ucieka poza krawędź formy. Teraz wykonasz graficzna kostkę do gry. Utwórz nowy projekt, wprowadź na formę czasomierz i ustaw jego interwał na 100. Teraz wprowadź pole graficzne, które będzie stanowiło powierzchnię kostki. Zmień jego rozmiar na niemal całą formę, robiąc miejsce na przycisk, który teraz dodaj. W procedurze wykonywanej przez czasomierz utworzysz obiekt graficzny i pisak. Następnie dodasz pętlę Do i instrukcję wyboru Case. Dla przycisku zdefiniuj metodę: Timer1.Enabled = True Dla czasomierza zdefiniuj metodę: Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick Dim t As Integer t = 0 Do PictureBox1.Refresh() Dim n As Integer pisak = New Pen(Drawing.Color.DarkOliveGreen, 10) Dim grafika As Graphics = PictureBox1.CreateGraphics n = Int(6 * Rnd()) + 1 Select Case n Case 1 grafika.drawellipse(pisak, 80, 80, 10, 10) Case 2 grafika.drawellipse(pisak, 40, 40, 10, 10) grafika.drawellipse(pisak, 120, 120, 10, 10) Case 3 grafika.drawellipse(pisak, 40, 40, 10, 10) grafika.drawellipse(pisak, 80, 80, 10, 10) grafika.drawellipse(pisak, 120, 120, 10, 10) Case 4 grafika.drawellipse(pisak, 40, 40, 10, 10) grafika.drawellipse(pisak, 120, 40, 10, 10) grafika.drawellipse(pisak, 40, 120, 10, 10) grafika.drawellipse(pisak, 120, 120, 10, 10) 13/14

Case 5 grafika.drawellipse(pisak, 40, 40, 10, 10) grafika.drawellipse(pisak, 120, 40, 10, 10) grafika.drawellipse(pisak, 80, 80, 10, 10) grafika.drawellipse(pisak, 40, 120, 10, 10) grafika.drawellipse(pisak, 120, 120, 10, 10) Case 6 grafika.drawellipse(pisak, 40, 40, 10, 10) grafika.drawellipse(pisak, 120, 40, 10, 10) grafika.drawellipse(pisak, 40, 80, 10, 10) grafika.drawellipse(pisak, 120, 80, 10, 10) grafika.drawellipse(pisak, 40, 120, 10, 10) grafika.drawellipse(pisak, 120, 120, 10, 10) End Select t = t + 1 Loop Until t > 1000 Timer1.Enabled = False Rozbuduj program tak, aby zasymulować rzut dwoma kostkami. Potrzebujesz drugiego pola graficznego. 14/14