- Stwórz nowy projekt o typie WPF Application – Visual C#.
- Przejrzyj pliki projektu z poziomu Visual Studio.
- App.xaml i App.xaml.cs
- MainPage.xaml i MainPage.xaml.cs
Otwórz projekt w Eksplorerze plików. Wejdź do folderu Obj/Debug. Sprawdź zawartość plików App.g.i.cs i MainWindow.g.i.cs.
-
Przejdź do pliku MainPage.xaml w trybie Design. Otwórz okno Toolbox i przypnij je dziś do końca ćwiczeń na stałe do VS (View->Toolbox lub Ctrl+Alt+X).
-
Metodą przeciągnij i upuść umieść
Button
na środku okna MainPage.xaml. Przejdź do zakładki XAML i sprawdź jaki kod został wygenerowany automatycznie. -
Zmień właściwość
Content
na"Hello World"
. Skompiluj i uruchom program. -
Za pomocą kursora myszy zmień położenie elementu Button. Potem ręcznie zmodyfikuje w kodzie XAML właściwość Margin. Co się stanie jak będą tylko dwa parametry? a co będzie jeśli tylko jeden?
-
Naciśnij
Button
prawym klawiszem myszy. Wybierz opcję Layout i Reset Margin. Gdzie przemieści się przycisk? -
Teraz zmodyfikuj właściwość Margin z okna Properties, Layout.
-
Dla elementu Button zmodyfikuj poćwicz zmianę parametru VerticalAlignment i HorizontalAlignment na 3 sposoby (Designer, kod XAML, okno Properties). Na koniec wyśrodkuj Button i wyzeruj marginesy.
-
Dla elementu Button w oknie Properties w polu Name wpisz Przycisk. Co się zmieniło w kodzie?
-
Na oknie Design kliknij dwa razy na Button. Powinna wygenerować Ci się
metoda Przycisk_Click
. W jej wnętrzu wpisz:MessageBox.Show("Witaj Świecie");
Potem skompiluj i uruchom program. -
Do aplikacji dodaj dwa elementy typu TextBox. Nazwij je Liczba1 i Liczba2. W właściwości Text ustaw odpowiedniej
"Podaj pierwszą liczbę"
i"Podaj drugą liczbę"
. -
Zmień właściwość Content elementu Button na Dodaj.
-
Zmodyfikuj wnętrze
metody Przycisk_Click
następująco:
double liczba1=Convert.ToDouble(Liczba1.Text);
double liczba2 = Convert.ToDouble(Liczba2.Text);
double wynik = liczba1 + liczba2;
MessageBox.Show(wynik.ToString());
Następnie skompiluj i uruchom program.
-
Uzupełnione elementy TextBox nie są dobrym rozwiązaniem za każdym razem. Usuń z nich właściwość Text.
-
Z lewej strony TextBox umieść odpowiednie dwa elementy Label. Content ustaw jako Pierwsza Liczba i Druga Liczba. Zadbaj o dobry wygląd aplikacji po kompilacji.
-
Cały czas MessageBox nie wygląda za fajnie. Pod elementem Button Dodaj umieść Label. Usuń w niej Content a nazwę ustaw na Wynik.
-
Zmodyfikuj wnętrze
metody Przycisk_Click
. Usuń linijkę z MessageBoxem. Zamiast tego wpisz:Wynik.Content = wynik.ToString();
-
Z Toolboxa upuść nowy Button i nadaj mu nazwę
PrzyciskCzas
oraz Content jako Czas. Zaznacz go jako aktywny myszką. W Oknie Properties kliknij na "piorunik" i wyszukaj pole MouseEnter - kliknij w nie dwa razy. We wnętrzu wygenerowanej metody wrzuć:
PrzyciskCzas.Content = DateTime.Now.ToString("HH:mm:ss");
Następnie zrób podobnie z polem MouseLeave i tam we wnętrzu wpisz:
PrzyciskCzas.Content = "Czas";
-
Stwórz nowy projekt dla WPF.
-
Za pomocą designera lub ręcznie kodem usuń grid w MainWindow. Przydatne okno Document Outline (Ctrl+Alt+T).
-
Na window za pomocą designera upuść StackPanel.
-
Na StackPanel upuść 5 przycisków. Śledź zmiany w kodzie. Jakie parametry możesz pozmieniać w designer? jakie w Properties? a jakie ręcznie w kodzie? czy możesz w dowolny sposób umieścić buttony?
-
Ręcznie w kodzie zmień StackPanel na WrapPanel. Co się zmieniło?
-
Teraz WrapPanel zamień na DockPanel (naciskając prawym klawisz myszy na WrapPanel, potem Change Layout Type). Sprawdź zmiany.
-
Zmień DockPanel na Grid.
-
Za pomocą designera stwórz kilka rzędów i kolumn. Spójrz na kod.
-
Za pomocą designera i bezpośrednio w kodzie zrób tak, aby każdy wcześniej dodany button był w oddzielnym elemencie w siatce.
-
Upewnij się że w kodzie do każdego button jest przypisany rząd i kolumna. Następnie za pomocą designera zmień szerokość niektórych rzędów i kolumn.
-
Stwórz kalkulator w WPF.