ZADANIE TRENINGOWE: SmartWallet – Menedżer Budżetu

Celem zadania jest stworzenie aplikacji typu SmartWallet do monitorowania domowego budżetu. Aplikacja ma umożliwiać dodawanie transakcji (przychody/wydatki), przeglądanie ich w zaawansowanej tabeli oraz bieżące śledzenie salda za pomocą własnej kontrolki z paskiem postępu.

Punktacja i wymagania (Razem: 15 pkt)

Etap 1: Układ i parametry okna (1.5 pkt)

• Parametry okna (0.5 pkt)
  • Tytuł okna: SmartWallet - Menedżer Budżetu
  • Wymiary początkowe: 1000 x 600, wymiary minimalne: 800 x 500.
  • Tło całego okna to jasnoszary kolor (#F5F6FA).
• Główny układ (1 pkt)
  • Układ główny to Grid podzielony na dwie kolumny.
  • Lewa kolumna (szerokość: 300) to Panel Dodawania Transakcji. Powinna mieć białe tło (White), prawy margines 10 oraz cień lub ramkę grubości 1 (kolor szary).
  • Prawa kolumna (szerokość: - reszta wolnego miejsca) to Panel Historii i Podsumowania.

Etap 2: Niestandardowa Kontrolka (UserControl) i DependencyProperty (2.5 pkt)

Stwórz własną kontrolkę BudgetSummaryControl (dodaj nowy element typu UserControl do projektu). Będzie ona wyświetlać podsumowanie salda.

• Dependency Properties (1.5 pkt): W pliku code-behind tej kontrolki zarejestruj dwie Właściwości Zależności (DependencyProperty):
  • CurrentBalance (typu double)
  • BalanceLimit (typu double - domyślnie 5000)
• Wygląd (1 pkt): W XAML kontrolki zrób StackPanel.
  • Na górze TextBlock wyświetlający tekst w formacie: "Aktualne saldo: [CurrentBalance] / [BalanceLimit] PLN". Użyj wiązania (Binding) do samego siebie (RelativeSource={RelativeSource AncestorType=UserControl}).
  • Poniżej wstaw ProgressBar. Jego wartość maksymalna to BalanceLimit, a aktualna to CurrentBalance. Zmień jego wysokość na 20.

Etap 3: Panel Dodawania Transakcji i Walidacja (3.5 pkt)

W lewej kolumnie głównego okna zbuduj formularz wykorzystując StackPanel.

• Pola formularza (1 pkt):
  • TextBox dla nazwy transakcji.
  • TextBox dla kwoty (Marginesy: 0,5,0,15, Padding: 5).
  • ComboBox dla kategorii (wybór np.: Wypłata, Zakupy, Rachunki).
  • CheckBox oznaczający czy to przychód ("Czy to przychód?").
• Trasowanie zdarzeń / Zabezpieczenie przed literami (1 pkt):
  • Do TextBoxa dla kwoty podepnij zdarzenie PreviewTextInput. W kodzie zablokuj możliwość wpisywania liter (wykorzystaj e.Handled = true; jeśli znak nie jest cyfrą lub przecinkiem).
• Walidacja XAML (1.5 pkt):
  • Nazwa transakcji jest wymagana. Stwórz klasę implementującą ValidationRule (np. StringNotEmptyValidationRule), która zwróci błąd, jeśli tekst jest pusty.
  • W XAML podepnij tę regułę pod wiązanie tekstu nazwy (Binding.ValidationRules).
  • Skonfiguruj Validation.ErrorTemplate dla tego TextBoxa – gdy wystąpi błąd (pusta nazwa), obramowanie ma stać się czerwone (#E74C3C), a z prawej strony pola ma pojawić się mały, czerwony znak "X".

Etap 4: Konwertery i TemplateSelector (2.5 pkt)

Zanim wyświetlisz transakcje, musisz obsłużyć ich logikę wizualną.

• Value Converter (1 pkt): Napisz konwerter AmountToColorConverter implementujący IValueConverter.
  • Jeśli transakcja ma flagę przychodu (IsIncome = true), konwerter zwraca zielony pędzel (#2ECC71).
  • Jeśli to wydatek (IsIncome = false), zwraca czerwony (#E74C3C).
• DataTemplateSelector (1.5 pkt): Napisz klasę TransactionTemplateSelector.
  • Jeśli to przychód, wybierz z zasobów okna IncomeTemplate (wyświetla ikonkę/znak [+] przed nazwą transakcji).
  • Jeśli wydatek, wybierz ExpenseTemplate (znak [-]).