INF.04-01-25.06-SGCzerwiec 2025 · 33 kroki · ok. 86 min · 32 kryteria z klucza

Rozwiązanie krok po kroku: Loteria liczbowa i wzornik RGB (C# + WPF)

Rozwiązujemy arkusz z loterią liczbową i wzornikiem kolorów w wersji C# + WPF: w konsoli program, który wczytuje liczbę losowań, wypełnia dwuwymiarową tablicę zestawami sześciu różnych liczb z zakresu 1-49, wyświetla je i zlicza wystąpienia każdej liczby, a w oknie WPF trzy suwaki R, G, B zmieniające kolor dużego prostokąta i przycisk „Pobierz”, który zapamiętuje kolor w małym prostokącie. Do tego komentarz dokumentujący według listingu 1, zrzuty i plik egzamin.

Kroki idą zdanie po zdaniu za treścią arkusza - każdy zaczyna się cytatem wymagania, a kod pokazuje dokładnie te linie, które je spełniają. Najpierw piszemy najprostszą wersję, której wymaga klucz, a w etapie „Dobre praktyki” przerabiamy ją na kod z prawdziwych projektów.

Co widać w podglądzie. Program konsolowy z każdego kroku jest naprawdę budowany i uruchamiany (.NET 10, z wpisaną liczbą 11 jak na obrazie 1 arkusza). Okno aplikacji to symulacja w przeglądarce: układ powstaje z MainWindow.xaml z kroku, a suwaki i przycisk działają tak, jak kod MainWindow.xaml.cs z tego samego kroku - możesz nimi poruszać. Symulację porównałem z prawdziwym oknem WPF zbudowanym z tego samego kodu; w kroku ze zrzutami jest prawdziwy render okna.

Arkusz pozwala też na C++, Javę albo Pythona w konsoli i na inne środowiska okienkowe (np. Windows Forms) - ten wariant to jedna z możliwych dróg.

Jak liczą się punkty. Klucz ma 32 kryteria (R.1.1 - R.4.9), każde za 1 punkt. Próg zdania części praktycznej to 75%, czyli 24 punkty - można stracić 8 kryteriów i nadal zdać. Przy każdym kroku jest napisane, które kryteria spełnia; egzaminator ocenia spełnienie kryteriów z klucza, nie zgodność z tym kodem.

Arkusz i pliki do pobrania Treść arkusza (PDF) Pobierz pliki rozwiązania (zip)

Etap 1: Przygotowanie
Krok 1 · po tym etapie masz 0 z 32 kryteriów (pkt)

Krok 1: Folder zdającego i trzy podfoldery
ok. 2 min
Polecenie z arkusza
Utwórz folder i nazwij go numerem zdającego. W folderze utwórz podfoldery: konsolowa, desktopowa, dokumentacja. Po wykonaniu każdej aplikacji, jej pełny kod (cały folder projektu) spakuj do archiwum. Następnie pozostaw w podfolderze jedynie skopiowane z projektu pliki źródłowe, których treść była modyfikowana, plik wykonywalny, jeśli jest to możliwe, oraz spakowane archiwum.
Na pulpicie zakładamy folder z numerem PESEL, a w nim konsolowa, desktopowa i dokumentacja. Ten arkusz nie ma załącznika - wszystko piszemy od zera. Projekty Visual Studio zakłada domyślnie w source\repos; na koniec każdy spakujemy do archiwum i skopiujemy do właściwego podfolderu razem ze zmienionymi plikami i plikiem .exe.
Etap 2: Aplikacja konsolowa
Kroki 2-10 · po tym etapie masz 14 z 32 kryteriów (pkt)
Krok 2: Nowy projekt konsola w Visual Studio
ok. 3 min
Polecenie z arkusza
Zastosowany obiektowy język programowania zgodny z zainstalowanym na stanowisku egzaminacyjnym: C++ lub C#, lub Java, lub Python.
Wybieramy C# - ten sam język posłuży w aplikacji WPF. W Visual Studio: Utwórz nowy projekt → Aplikacja konsoli, nazwa konsola, platforma .NET zainstalowana na stanowisku i zaznaczona opcja „Nie używaj instrukcji najwyższego poziomu”. Dzięki niej szablon ma klasyczną klasę Program z metodą Main - obok niej dopiszemy własne metody, czego wymaga arkusz.
Szablon wypisuje „Hello, World!”. Uruchamiamy go (Ctrl+F5), żeby sprawdzić, że środowisko działa.
konsola/Program.cs C# nowy plik
namespace konsola; class Program { static void Main(string[] args) { Console.WriteLine("Hello, World!"); } }
Wynik programu po tym kroku

> konsola.exe Hello, World!
Krok 3: Wczytanie liczby losowań z klawiatury
Kryteria: , ,
R.1.5 Zastosowane typy pasujące do problemu, np. tablica lub kolekcja liczb całkowitych, dane wczytywane jako typ całkowity
R.1.7 Program podejmuje zrozumiałą komunikację z użytkownikiem: komunikaty są znaczące, np. "ile losowań?" itp.
R.1.4 Użyte polskie lub angielskie nazewnictwo pól lub zmiennych. Nazewnictwo jest znaczące. Wyjątkami od reguły są zmienne bufor, tmp, iteratory pętli. Kryterium nie jest spełnione tylko wtedy, gdy zmienne nie istnieją lub ich nazwy nic nie znaczą, np. x, tab, tablica, foo, kolekcja
ok. 2 min
Polecenie z arkusza
Program wczytuje z klawiatury ile zestawów należy wylosować.
Najpierw pytanie dla użytkownika (R.1.7), potem Console.ReadLine() czeka na tekst zakończony Enterem. Tekst zamieniamy na liczbę całkowitą przez Convert.ToInt32 i zapisujemy w zmiennej count typu int - liczba losowań to liczba całkowita (R.1.5). W podglądzie wpisano 11, jak na obrazie 1 arkusza.
Typowe błędy
int.Parse(Console.ReadLine()) też działa, ale Visual Studio podkreśla je ostrzeżeniem o możliwej wartości null. Convert.ToInt32 przyjmuje null bez ostrzeżenia.
konsola/Program.cs C# zmienione: 2 linie
namespace konsola; class Program { static void Main(string[] args) { Console.WriteLine("Ile wygenerować losowań?"); int count = Convert.ToInt32(Console.ReadLine()); } }
Wynik programu po tym kroku

> konsola.exe Ile wygenerować losowań? 11
Krok 4: Metoda DrawNumbers i tablica n × 6
Kryteria: , ,
R.2.1 Program składa się z programu głównego oraz co najmniej dwóch funkcji lub metod (mogą być niedokończone lub zawierać błędy). Po wyjściu z funkcji / metody losującej dane nie zostały utracone (w podejściu strukturalnym nie można stosować zmiennych globalnych)
R.2.2 Do przechowywania danych zastosowana tablica dwuwymiarowa lub inna kolekcja o dynamicznym rozmiarze dostosowanym do ilości danych
R.1.3 Użyte polskie lub angielskie nazewnictwo funkcji lub metod. Nazewnictwo jest znaczące
ok. 3 min
Polecenie z arkusza
Do przechowywania wyników losowań należy użyć dwuwymiarowej tablicy liczb całkowitych składającej się z n wierszy i 6 kolumn (n – liczba wczytana z klawiatury) lub innej dowolnej kolekcji pasującej do problemu. W programie należy zdefiniować przynajmniej dwie funkcje: Wypełniającą tablicę lub kolekcję danymi losowań.
Tablica dwuwymiarowa w C# to int[,]: new int[count, 6] tworzy count wierszy (losowań) po 6 kolumn (liczb) - rozmiar zależy od wczytanej liczby (R.2.2). Tworzymy ją w osobnej metodzie DrawNumbers, która zwraca tablicę, a Main zapisuje wynik w swojej zmiennej draws. Dzięki temu dane nie giną po wyjściu z metody, a my nie potrzebujemy zmiennych globalnych (R.2.1). Metoda jest static, bo wywołujemy ją ze statycznej metody Main bez tworzenia obiektu.
Na razie tablica jest wypełniona zerami - losowanie dodamy w następnym kroku.
konsola/Program.cs C# zmienione: 8 linii
namespace konsola; class Program { static void Main(string[] args) { Console.WriteLine("Ile wygenerować losowań?"); int count = Convert.ToInt32(Console.ReadLine()); int[,] draws = DrawNumbers(count); } static int[,] DrawNumbers(int count) { int[,] draws = new int[count, 6]; return draws; } }
Wynik programu bez zmian - taki jak po kroku 3.
Krok 5: Wypełnienie tablicy liczbami z zakresu 1-49
Kryteria: , , ,
R.2.3 Do losowania liczb zastosowany generator liczb pseudolosowych, losowane są liczby z przedziału od [1, 49] (+/- 1 z każdej strony przedziału)
R.2.4 Program wypełnia tablicę lub kolekcję danymi, pętla obsługuje rzeczywistą liczbę losowań
R.1.1 Kod źródłowy zapisany w sposób czytelny: instrukcje w osobnych liniach, stosowane spacje pomiędzy operatorami, konsekwentnie stosowana wybrana konwencja dla nawiasów klamrowych instrukcji blokowej
R.1.2 Kod zapisany z wcięciami dla zagnieżdżeń bloków
ok. 3 min
Polecenie z arkusza
Program generuje podaną liczbę zestawów składających się z sześciu losowanych liczb całkowitych ze zbioru <1, 49>. W programie należy użyć funkcji do generowania liczb pseudolosowych.
Generator liczb pseudolosowych to obiekt klasy Random. Uwaga na granice: random.Next(1, 50) zwraca liczbę od 1 do 49 - dolna granica wchodzi do zakresu, górna nie (R.2.3). Dwie zagnieżdżone pętle przechodzą po wierszach (row od 0 do count - 1, czyli tyle losowań, ile wpisał użytkownik - R.2.4) i po sześciu kolumnach. Element tablicy dwuwymiarowej wskazujemy dwoma indeksami w jednym nawiasie: draws[row, column].
Zwróć uwagę na zapis: klamry każdego bloku w osobnych liniach (konwencja C#), wcięcie o 4 spacje na każdy poziom zagnieżdżenia (R.1.1, R.1.2).
Typowe błędy
random.Next(1, 49) nigdy nie wylosuje 49, a random.Next(49) daje 0-48. Klucz dopuszcza przesunięcie o 1 (R.2.3), ale liczba 0 na kuponie wygląda na błąd każdemu, kto spojrzy na wynik.
konsola/Program.cs C# zmienione: 8 linii
namespace konsola; class Program { static void Main(string[] args) { Console.WriteLine("Ile wygenerować losowań?"); int count = Convert.ToInt32(Console.ReadLine()); int[,] draws = DrawNumbers(count); } static int[,] DrawNumbers(int count) { Random random = new Random(); int[,] draws = new int[count, 6]; for (int row = 0; row < count; row++) { for (int column = 0; column < 6; column++) { draws[row, column] = random.Next(1, 50); } } return draws; } }
Wynik programu bez zmian - taki jak po kroku 3.

Krok 6: Metoda PrintDraws: wyświetlenie wszystkich losowań

Kryteria: , ,

R.2.5 Program wyświetla zawartość tablicy lub kolekcji za pomocą pętli. Wyświetlone wszystkie losowania (w uruchomionej aplikacji lub na zrzucie i obowiązkowo w kodzie)

R.2.1 Program składa się z programu głównego oraz co najmniej dwóch funkcji lub metod (mogą być niedokończone lub zawierać błędy). Po wyjściu z funkcji / metody losującej dane nie zostały utracone (w podejściu strukturalnym nie można stosować zmiennych globalnych)

R.1.3 Użyte polskie lub angielskie nazewnictwo funkcji lub metod. Nazewnictwo jest znaczące

ok. 3 min

Polecenie z arkusza

Zestawy są wyświetlone na ekranie. W programie należy zdefiniować przynajmniej dwie funkcje: Wyświetlającą wyniki wszystkich losowań na ekranie.

Druga metoda dostaje tablicę jako parametr i nic nie zwraca (void). Liczbę wierszy odczytuje z samej tablicy: draws.GetLength(0) to rozmiar pierwszego wymiaru - metoda nie potrzebuje osobnego parametru z liczbą losowań. Console.Write (bez Line) wypisuje kolejne liczby w tej samej linii, a Console.WriteLine() na końcu wiersza przechodzi do następnej. Numer losowania to row + 1, bo użytkownik liczy od 1, a tablica od 0 - nawias jest potrzebny, inaczej + dokleiłby do napisu najpierw row, a potem 1.

W wydruku obok zestaw może zawierać tę samą liczbę dwa razy - losowania jeszcze się nie sprawdzają. To naprawimy w następnym kroku.

Typowe błędy

"Losowanie " + row + 1 daje „Losowanie 01”, „Losowanie 11”... - napis plus liczba to napis, więc 1 jest doklejana jako tekst.

konsola/Program.cs C# zmienione: 15 linii

namespace konsola;

class Program
{
    static void Main(string[] args)
    {
        Console.WriteLine("Ile wygenerować losowań?");
        int count = Convert.ToInt32(Console.ReadLine());

        int[,] draws = DrawNumbers(count);
        Console.WriteLine("Zestawy wylosowanych liczb:");
        PrintDraws(draws);
    }

    static int[,] DrawNumbers(int count)
    {
        Random random = new Random();
        int[,] draws = new int[count, 6];
        for (int row = 0; row < count; row++)
        {
            for (int column = 0; column < 6; column++)
            {
                draws[row, column] = random.Next(1, 50);
            }
        }
        return draws;
    }

    static void PrintDraws(int[,] draws)
    {
        for (int row = 0; row < draws.GetLength(0); row++)
        {
            Console.Write("Losowanie " + (row + 1) + ":");
            for (int column = 0; column < 6; column++)
            {
                Console.Write(" " + draws[row, column]);
            }
            Console.WriteLine();
        }
    }
}

Wynik programu po tym kroku

> konsola.exe
Ile wygenerować losowań?
11
Zestawy wylosowanych liczb:
Losowanie 1: 19 15 48 12 35 31
Losowanie 2: 43 4 39 17 24 14
Losowanie 3: 44 33 40 5 32 15
Losowanie 4: 48 22 9 42 5 6
Losowanie 5: 11 35 39 30 23 36
Losowanie 6: 16 29 25 39 3 14
Losowanie 7: 18 30 5 4 22 11
Losowanie 8: 19 45 21 24 18 41
Losowanie 9: 31 46 6 30 28 20
Losowanie 10: 29 28 6 3 34 22
Losowanie 11: 34 49 27 9 17 21

Krok 7: Liczby w zestawie bez powtórzeń

Kryteria: ,

R.2.6 Program implementuje losowanie przynajmniej jednego zestawu sześciu liczb bez powtórzeń

R.1.3 Użyte polskie lub angielskie nazewnictwo funkcji lub metod. Nazewnictwo jest znaczące

ok. 4 min

Polecenie z arkusza

W jednym zestawie liczby nie mogą się powtarzać.

Pomocnicza metoda IsInDraw sprawdza, czy liczba jest już w danym wierszu - ale tylko w kolumnach już wypełnionych (filled to liczba wylosowanych do tej pory liczb w tym zestawie). Pętla do ... while losuje liczbę co najmniej raz i powtarza losowanie, dopóki trafia na powtórkę. Dopiero liczba, której w zestawie nie ma, trafia do tablicy (R.2.6).

Metoda zwraca bool i kończy się w chwili znalezienia liczby (return true) - nie ma sensu sprawdzać dalej.

Typowe błędy

Sprawdzanie całego wiersza (do kolumny 5) zamiast tylko wypełnionej części działa przypadkiem - puste miejsca mają 0, którego nie losujemy. Przy zakresie od 0 program by się zawiesił albo odrzucał poprawne liczby.

konsola/Program.cs C# zmienione: 19 linii

namespace konsola;

class Program
{
    static void Main(string[] args)
    {
        Console.WriteLine("Ile wygenerować losowań?");
        int count = Convert.ToInt32(Console.ReadLine());

        int[,] draws = DrawNumbers(count);
        Console.WriteLine("Zestawy wylosowanych liczb:");
        PrintDraws(draws);
    }

    static int[,] DrawNumbers(int count)
    {
        Random random = new Random();
        int[,] draws = new int[count, 6];
        for (int row = 0; row < count; row++)
        {
            for (int column = 0; column < 6; column++)
            {
                int number;
                do
                {
                    number = random.Next(1, 50);
                }
                while (IsInDraw(draws, row, column, number));
                draws[row, column] = number;
            }
        }
        return draws;
    }

    static bool IsInDraw(int[,] draws, int row, int filled, int number)
    {
        for (int column = 0; column < filled; column++)
        {
            if (draws[row, column] == number)
            {
                return true;
            }
        }
        return false;
    }

    static void PrintDraws(int[,] draws)
    {
        for (int row = 0; row < draws.GetLength(0); row++)
        {
            Console.Write("Losowanie " + (row + 1) + ":");
            for (int column = 0; column < 6; column++)
            {
                Console.Write(" " + draws[row, column]);
            }
            Console.WriteLine();
        }
    }
}

Wynik programu po tym kroku

> konsola.exe
Ile wygenerować losowań?
11
Zestawy wylosowanych liczb:
Losowanie 1: 49 16 37 47 30 32
Losowanie 2: 14 30 25 32 20 33
Losowanie 3: 9 12 13 36 23 6
Losowanie 4: 27 49 26 23 21 3
Losowanie 5: 14 43 22 33 17 21
Losowanie 6: 46 8 25 5 19 2
Losowanie 7: 49 2 8 28 31 46
Losowanie 8: 39 37 13 3 14 6
Losowanie 9: 21 5 14 10 41 18
Losowanie 10: 45 25 30 42 32 37
Losowanie 11: 12 38 28 4 17 1

Krok 8: Zliczanie wystąpień liczb 1-49

Kryteria:

R.2.7 Program zlicza wystąpienia wszystkich liczb od 1 do 49 w losowaniach, są one wyświetlane na ekranie (w uruchomionej aplikacji lub na zrzucie i obowiązkowo w kodzie, dopuszcza się wyświetlenie tylko niezerowych wystąpień)

ok. 3 min

Polecenie z arkusza

Program zlicza we wszystkich zestawach ile jest wystąpień każdej liczby od 1 do 49, co zostaje wyświetlone na ekranie.

Liczniki trzymamy w zwykłej tablicy int[50] i indeksem jest sama liczba: wystąpienia siódemki są w occurrences[7]. Element 0 zostaje nieużywany - za to nie trzeba niczego przeliczać (number - 1). Pętla foreach po tablicy dwuwymiarowej przechodzi po wszystkich jej elementach, wiersz po wierszu, więc jedna pętla wystarcza na wszystkie zestawy. occurrences[number]++ zwiększa licznik wylosowanej liczby. Wyświetlenie dopiszemy w następnym kroku.

konsola/Program.cs C# zmienione: 12 linii

namespace konsola;

class Program
{
    static void Main(string[] args)
    {
        Console.WriteLine("Ile wygenerować losowań?");
        int count = Convert.ToInt32(Console.ReadLine());

        int[,] draws = DrawNumbers(count);
        Console.WriteLine("Zestawy wylosowanych liczb:");
        PrintDraws(draws);

        int[] occurrences = CountOccurrences(draws);
    }

    static int[,] DrawNumbers(int count)
    {
        Random random = new Random();
        int[,] draws = new int[count, 6];
        for (int row = 0; row < count; row++)
        {
            for (int column = 0; column < 6; column++)
            {
                int number;
                do
                {
                    number = random.Next(1, 50);
                }
                while (IsInDraw(draws, row, column, number));
                draws[row, column] = number;
            }
        }
        return draws;
    }

    static bool IsInDraw(int[,] draws, int row, int filled, int number)
    {
        for (int column = 0; column < filled; column++)
        {
            if (draws[row, column] == number)
            {
                return true;
            }
        }
        return false;
    }

    static int[] CountOccurrences(int[,] draws)
    {
        int[] occurrences = new int[50];
        foreach (int number in draws)
        {
            occurrences[number]++;
        }
        return occurrences;
    }

    static void PrintDraws(int[,] draws)
    {
        for (int row = 0; row < draws.GetLength(0); row++)
        {
            Console.Write("Losowanie " + (row + 1) + ":");
            for (int column = 0; column < 6; column++)
            {
                Console.Write(" " + draws[row, column]);
            }
            Console.WriteLine();
        }
    }
}

Wynik programu po tym kroku

> konsola.exe
Ile wygenerować losowań?
11
Zestawy wylosowanych liczb:
Losowanie 1: 45 47 25 32 23 34
Losowanie 2: 34 29 33 19 45 27
Losowanie 3: 7 4 11 38 48 13
Losowanie 4: 24 18 30 13 14 43
Losowanie 5: 41 5 26 24 38 27
Losowanie 6: 37 18 46 29 45 32
Losowanie 7: 15 6 32 43 25 44
Losowanie 8: 13 3 14 27 11 41
Losowanie 9: 38 20 33 9 36 47
Losowanie 10: 40 38 21 20 34 37
Losowanie 11: 35 21 43 33 30 5

Krok 9: Wyświetlenie liczby wystąpień

Kryteria: ,

R.1.7 Program podejmuje zrozumiałą komunikację z użytkownikiem: komunikaty są znaczące, np. "ile losowań?" itp.

ok. 2 min

Polecenie z arkusza

Program powinien podejmować zrozumiałą komunikację z użytkownikiem.

Pętla od 1 do 49 włącznie (<= 49) wypisuje każdą liczbę i jej licznik w formie z obrazu 1: „Wystąpienia liczby 7: 2”. Klucz dopuszcza też pokazanie tylko liczb, które padły (R.2.7) - pełna lista jest prostsza i zgodna z obrazem. Program jest kompletny: suma wszystkich liczników to zawsze 6 × liczba losowań (tu 66).

konsola/Program.cs C# zmienione: 9 linii

namespace konsola;

class Program
{
    static void Main(string[] args)
    {
        Console.WriteLine("Ile wygenerować losowań?");
        int count = Convert.ToInt32(Console.ReadLine());

        int[,] draws = DrawNumbers(count);
        Console.WriteLine("Zestawy wylosowanych liczb:");
        PrintDraws(draws);

        int[] occurrences = CountOccurrences(draws);
        PrintOccurrences(occurrences);
    }

    static int[,] DrawNumbers(int count)
    {
        Random random = new Random();
        int[,] draws = new int[count, 6];
        for (int row = 0; row < count; row++)
        {
            for (int column = 0; column < 6; column++)
            {
                int number;
                do
                {
                    number = random.Next(1, 50);
                }
                while (IsInDraw(draws, row, column, number));
                draws[row, column] = number;
            }
        }
        return draws;
    }

    static bool IsInDraw(int[,] draws, int row, int filled, int number)
    {
        for (int column = 0; column < filled; column++)
        {
            if (draws[row, column] == number)
            {
                return true;
            }
        }
        return false;
    }

    static int[] CountOccurrences(int[,] draws)
    {
        int[] occurrences = new int[50];
        foreach (int number in draws)
        {
            occurrences[number]++;
        }
        return occurrences;
    }

    static void PrintOccurrences(int[] occurrences)
    {
        for (int number = 1; number <= 49; number++)
        {
            Console.WriteLine("Wystąpienia liczby " + number + ": " + occurrences[number]);
        }
    }

    static void PrintDraws(int[,] draws)
    {
        for (int row = 0; row < draws.GetLength(0); row++)
        {
            Console.Write("Losowanie " + (row + 1) + ":");
            for (int column = 0; column < 6; column++)
            {
                Console.Write(" " + draws[row, column]);
            }
            Console.WriteLine();
        }
    }
}

Wynik programu po tym kroku

> konsola.exe
Ile wygenerować losowań?
11
Zestawy wylosowanych liczb:
Losowanie 1: 48 13 28 41 49 20
Losowanie 2: 31 45 39 16 32 5
Losowanie 3: 37 8 23 31 32 7
Losowanie 4: 10 19 43 12 21 33
Losowanie 5: 27 39 4 7 38 48
Losowanie 6: 46 44 23 38 4 27
Losowanie 7: 43 49 18 32 26 8
Losowanie 8: 18 44 38 19 40 17
Losowanie 9: 43 32 24 14 46 10
Losowanie 10: 40 21 9 30 4 17
Losowanie 11: 15 12 7 19 6 35
Wystąpienia liczby 1: 0
Wystąpienia liczby 2: 0
Wystąpienia liczby 3: 0
Wystąpienia liczby 4: 3
Wystąpienia liczby 5: 1
Wystąpienia liczby 6: 1
Wystąpienia liczby 7: 3
Wystąpienia liczby 8: 2
Wystąpienia liczby 9: 1
Wystąpienia liczby 10: 2
Wystąpienia liczby 11: 0
Wystąpienia liczby 12: 2
Wystąpienia liczby 13: 1
Wystąpienia liczby 14: 1
Wystąpienia liczby 15: 1
Wystąpienia liczby 16: 1
Wystąpienia liczby 17: 2
Wystąpienia liczby 18: 2
Wystąpienia liczby 19: 3
Wystąpienia liczby 20: 1
Wystąpienia liczby 21: 2
Wystąpienia liczby 22: 0
Wystąpienia liczby 23: 2
Wystąpienia liczby 24: 1
Wystąpienia liczby 25: 0
Wystąpienia liczby 26: 1
Wystąpienia liczby 27: 2
Wystąpienia liczby 28: 1
Wystąpienia liczby 29: 0
Wystąpienia liczby 30: 1
Wystąpienia liczby 31: 2
Wystąpienia liczby 32: 4
Wystąpienia liczby 33: 1
Wystąpienia liczby 34: 0
Wystąpienia liczby 35: 1
Wystąpienia liczby 36: 0
Wystąpienia liczby 37: 1
Wystąpienia liczby 38: 3
Wystąpienia liczby 39: 2
Wystąpienia liczby 40: 2
Wystąpienia liczby 41: 1
Wystąpienia liczby 42: 0
Wystąpienia liczby 43: 3
Wystąpienia liczby 44: 2
Wystąpienia liczby 45: 1
Wystąpienia liczby 46: 2
Wystąpienia liczby 47: 0
Wystąpienia liczby 48: 2
Wystąpienia liczby 49: 2

Krok 10: Folder konsolowa: archiwum, źródło, plik exe
Kryteria:
R.4.9 Na płycie wszystkie wykonane projekty są spakowane oraz umieszczone pliki źródłowe i pliki wykonywalne (jeśli istnieją) na zewnątrz archiwów
ok. 3 min
Polecenie z arkusza
Kod aplikacji przygotuj do nagrania na płytę. W folderze konsolowa powinno znaleźć się archiwum całego projektu o nazwie konsola.zip, skopiowany z projektu plik z kodem źródłowym programu oraz plik wykonywalny, jeżeli istnieje.
Najpierw dopisujemy komentarz dokumentujący z części III (krok niżej) - archiwum ma zawierać kod z komentarzem. Potem pakujemy cały folder projektu do konsola.zip, a obok kopiujemy Program.cs i plik wykonywalny: po uruchomieniu w Visual Studio leży w bin\Debug\net…\konsola.exe. Program .exe z .NET potrzebuje do działania sąsiednich plików konsola.dll i konsola.runtimeconfig.json - skopiuj je razem z nim.
Wynik programu bez zmian - taki jak po kroku 9.

Etap 3: Aplikacja desktopowa

Kroki 11-25 · po tym etapie masz 21 z 32 kryteriów (pkt)

Krok 11: Nowy projekt WPF desktopowa

ok. 3 min

Polecenie z arkusza

Za pomocą dostępnego na stanowisku egzaminacyjnym środowiska programistycznego wykonaj aplikację desktopową wybierania kolorów z palety RGB.

W Visual Studio: Utwórz nowy projekt → Aplikacja WPF (nie Aplikacja WPF (.NET Framework) - starsza platforma), nazwa desktopowa. Powstają dwa pliki, które będziemy zmieniać: MainWindow.xaml - wygląd okna zapisany w XAML (język znaczników podobny do HTML) - i MainWindow.xaml.cs - logika (tzw. code-behind) w C#. Klasa okna jest rozbita na te dwa pliki słowem partial, a InitializeComponent() w konstruktorze buduje kontrolki opisane w XAML.

Podgląd pokazuje puste okno szablonu: tytuł „MainWindow”, rozmiar 800 × 450.

desktopowa/MainWindow.xaml XAML nowy plik

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>

    </Grid>
</Window>

desktopowa/MainWindow.xaml.cs C# nowy plik

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace desktopowa;

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }
}

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 12: Tytuł okna
Kryteria:
R.3.1 W oknie zdefiniowane wszystkie kontrolki (etykiety, suwaki, przycisk) oraz ich układ jest zgodny z obrazem 2 w arkuszu egzaminacyjnym (prostokąty mały i duży mogą być dowolną kontrolką, która daje efekt przedstawiony na obrazie 2)
ok. 1 min
Polecenie z arkusza
Opis wyglądu aplikacji: Tytuł okna „Wzornik kolorów RGB. Wykonał” dalej wstawiony numer zdającego.
Atrybut Title znacznika Window. Na egzaminie po „Wykonał” wpisujemy numer PESEL - tu stoi autor rozwiązania, Bartosz Bryniarski. Tytuł widać na pasku okna (w podglądzie i na zrzutach).
desktopowa/MainWindow.xaml XAML zmienione: 1 linia
<Window x:Class="desktopowa.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:desktopowa" mc:Ignorable="d" Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"> <Grid> </Grid> </Window>
Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.
Krok 13: Tło okna Cornsilk
Kryteria:
R.3.1 W oknie zdefiniowane wszystkie kontrolki (etykiety, suwaki, przycisk) oraz ich układ jest zgodny z obrazem 2 w arkuszu egzaminacyjnym (prostokąty mały i duży mogą być dowolną kontrolką, która daje efekt przedstawiony na obrazie 2)
ok. 1 min
Polecenie z arkusza
Tło okna: Cornsilk (#FFF8DC).
Background okna. XAML zna nazwy kolorów, więc Background="Cornsilk" działa tak samo jak kod szesnastkowy #FFF8DC - wpisujemy kod podany w arkuszu, wtedy nie ma wątpliwości.
desktopowa/MainWindow.xaml XAML zmienione: 2 linie
<Window x:Class="desktopowa.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:desktopowa" mc:Ignorable="d" Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800" Background="#FFF8DC"> <Grid> </Grid> </Window>
Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.
Krok 14: Układ StackPanel i duży biały prostokąt
Kryteria: ,
R.3.1 W oknie zdefiniowane wszystkie kontrolki (etykiety, suwaki, przycisk) oraz ich układ jest zgodny z obrazem 2 w arkuszu egzaminacyjnym (prostokąty mały i duży mogą być dowolną kontrolką, która daje efekt przedstawiony na obrazie 2)
R.3.2 W stanie początkowym: - prostokąty są koloru białego, mały wyświetla wartość 255, 255, 255, - przynajmniej jeden suwak przyjmuje wartości od 0 do 255, - przynajmniej jeden suwak i odpowiadająca mu etykieta mają wartość 255
ok. 2 min
Polecenie z arkusza
Duży prostokąt o białym kolorze tła.
Elementy okna leżą jeden pod drugim (obraz 2), więc zamiast pustego Grid z szablonu bierzemy StackPanel - układa dzieci w pionie, każde na pełną szerokość. Margin="20" odsuwa zawartość od krawędzi okna.
Prostokątem może być dowolna kontrolka z tłem (klucz, R.3.1); bierzemy Border - prostą ramkę z tłem. Wysokość 60, szerokość wynika ze StackPanelu. x:Name="colorRectangle" nadaje kontrolce nazwę - pod nią kod C# zmieni jej kolor.
desktopowa/MainWindow.xaml XAML zmienione: 3 linie
<Window x:Class="desktopowa.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:desktopowa" mc:Ignorable="d" Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800" Background="#FFF8DC"> <StackPanel Margin="20"> <Border x:Name="colorRectangle" Height="60" Background="White" /> </StackPanel> </Window>
Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.
Krok 15: Napis nad suwakami
Kryteria:
R.3.1 W oknie zdefiniowane wszystkie kontrolki (etykiety, suwaki, przycisk) oraz ich układ jest zgodny z obrazem 2 w arkuszu egzaminacyjnym (prostokąty mały i duży mogą być dowolną kontrolką, która daje efekt przedstawiony na obrazie 2)
ok. 1 min
Polecenie z arkusza
Napis: „Dobierz kolor suwakami i zapisz przyciskiem:”
Label z treścią w atrybucie Content. Margines w XAML ma kolejność lewo, góra, prawo, dół: 0,20,0,0 to odstęp 20 tylko od góry - od prostokąta.
Typowe błędy
Kolejność marginesu jest inna niż w CSS (tam: góra, prawo, dół, lewo). Margin="20,0,0,0" odsunie napis od LEWEJ krawędzi.
desktopowa/MainWindow.xaml XAML zmienione: 1 linia
<Window x:Class="desktopowa.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:desktopowa" mc:Ignorable="d" Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800" Background="#FFF8DC"> <StackPanel Margin="20"> <Border x:Name="colorRectangle" Height="60" Background="White" /> <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" /> </StackPanel> </Window>
Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 16: Trzy suwaki 0-255 w siatce Grid

Kryteria: ,

R.3.1 W oknie zdefiniowane wszystkie kontrolki (etykiety, suwaki, przycisk) oraz ich układ jest zgodny z obrazem 2 w arkuszu egzaminacyjnym (prostokąty mały i duży mogą być dowolną kontrolką, która daje efekt przedstawiony na obrazie 2)

R.3.2 W stanie początkowym: - prostokąty są koloru białego, mały wyświetla wartość 255, 255, 255, - przynajmniej jeden suwak przyjmuje wartości od 0 do 255, - przynajmniej jeden suwak i odpowiadająca mu etykieta mają wartość 255

ok. 4 min

Polecenie z arkusza

Trzy suwaki, każdy o wartości początkowej 255 oraz zakresie wartości od 0 do 255.

Suwak ma po lewej literę, po prawej wartość - to tabela 3 × 3, więc wewnątrz StackPanelu wstawiamy Grid z trzema kolumnami (30 dla litery, * - cała reszta - dla suwaka, 50 dla wartości) i trzema wierszami po 30. Kontrolkę umieszczamy w komórce atrybutami Grid.Row i Grid.Column (liczone od 0).

Każdy Slider ma Minimum="0", Maximum="255" i Value="255" (R.3.2). Wartość suwaka jest liczbą zmiennoprzecinkową (double) - przy przeciąganiu wypadłoby np. 113,47. IsSnapToTickEnabled="True" z TickFrequency="1" przyciąga suwak do pełnych liczb, więc wartości będą całkowite. VerticalAlignment="Center" ustawia suwak w połowie wysokości wiersza.

Typowe błędy

Value="255" przy domyślnym Maximum (10) zostanie przycięte do 10 - suwak stanie na końcu, ale z wartością 10. Zakres trzeba podać razem z wartością.

desktopowa/MainWindow.xaml XAML zmienione: 18 linii

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
        </Grid>
    </StackPanel>
</Window>

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 17: Etykiety R, G, B po lewej

Kryteria:

ok. 1 min

Polecenie z arkusza

Z lewej strony suwaków kolejno etykiety: R, G, B.

Trzy etykiety w kolumnie 0, po jednej w każdym wierszu. Kolejność elementów w XAML nie decyduje o położeniu w siatce - decydują Grid.Row i Grid.Column; trzymamy je jednak w porządku, żeby kod był czytelny.

desktopowa/MainWindow.xaml XAML zmienione: 3 linie

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="R" />
            <Label Grid.Row="1" Grid.Column="0" Content="G" />
            <Label Grid.Row="2" Grid.Column="0" Content="B" />
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
        </Grid>
    </StackPanel>
</Window>

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 18: Etykiety z wartością suwaków po prawej

Kryteria: ,

ok. 1 min

Polecenie z arkusza

Z prawej strony suwaków etykiety z aktualną wartością suwaka, początkowo ustawione na 255.

Kolumna 2 - etykiety z tekstem 255, każda z własną nazwą (redValue, greenValue, blueValue), bo kod będzie zmieniał ich treść. Na razie przesunięcie suwaka niczego tu nie zmienia - to zrobi kod C#.

desktopowa/MainWindow.xaml XAML zmienione: 3 linie

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="R" />
            <Label Grid.Row="1" Grid.Column="0" Content="G" />
            <Label Grid.Row="2" Grid.Column="0" Content="B" />
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Label x:Name="redValue" Grid.Row="0" Grid.Column="2" Content="255" />
            <Label x:Name="greenValue" Grid.Row="1" Grid.Column="2" Content="255" />
            <Label x:Name="blueValue" Grid.Row="2" Grid.Column="2" Content="255" />
        </Grid>
    </StackPanel>
</Window>

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 19: Przycisk Pobierz w kolorze Peru

Kryteria:

ok. 1 min

Polecenie z arkusza

Przycisk „Pobierz” koloru Peru ( #CD853F).

Button z napisem w Content i tłem #CD853F. Podajemy szerokość 150 - element w StackPanelu z ustaloną szerokością staje na środku, dokładnie jak na obrazie 2. Bez Width przycisk rozciągnąłby się na całą szerokość okna.

desktopowa/MainWindow.xaml XAML zmienione: 1 linia

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="R" />
            <Label Grid.Row="1" Grid.Column="0" Content="G" />
            <Label Grid.Row="2" Grid.Column="0" Content="B" />
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Label x:Name="redValue" Grid.Row="0" Grid.Column="2" Content="255" />
            <Label x:Name="greenValue" Grid.Row="1" Grid.Column="2" Content="255" />
            <Label x:Name="blueValue" Grid.Row="2" Grid.Column="2" Content="255" />
        </Grid>
        <Button Content="Pobierz" Background="#CD853F" Width="150" Height="25" Margin="0,10,0,0" />
    </StackPanel>
</Window>

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 20: Mały prostokąt z napisem 255, 255, 255

Kryteria: ,

ok. 1 min

Polecenie z arkusza

Etykieta z pobraną wartością suwaków, domyślnie „255, 255, 255” o kolorze tła białym (mały prostokąt).

Mały prostokąt to Label z białym tłem, tej samej szerokości co przycisk, więc też na środku. Nazwa savedColor - kod zmieni mu kolor i tekst. Wygląd okna odpowiada obrazowi 2 (R.3.1, R.3.2).

desktopowa/MainWindow.xaml XAML zmienione: 1 linia

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="R" />
            <Label Grid.Row="1" Grid.Column="0" Content="G" />
            <Label Grid.Row="2" Grid.Column="0" Content="B" />
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center" />
            <Label x:Name="redValue" Grid.Row="0" Grid.Column="2" Content="255" />
            <Label x:Name="greenValue" Grid.Row="1" Grid.Column="2" Content="255" />
            <Label x:Name="blueValue" Grid.Row="2" Grid.Column="2" Content="255" />
        </Grid>
        <Button Content="Pobierz" Background="#CD853F" Width="150" Height="25" Margin="0,10,0,0" />
        <Label x:Name="savedColor" Content="255, 255, 255" Background="White" Width="150" Margin="0,10,0,0" />
    </StackPanel>
</Window>

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 21: Zdarzenie ValueChanged: wartości przy suwakach

Kryteria:

R.3.4 Zmiana położenia przynajmniej jednego suwaka powoduje wyświetlenie aktualnej wartości suwaka po jego prawej stronie (w uruchomionej aplikacji lub na zrzucie i obowiązkowo w kodzie)

ok. 4 min

Polecenie z arkusza

Działanie aplikacji: Zmiany położenia suwaków powodują zmianę wartości RGB po prawej stronie suwaka.

W XAML każdy suwak dostaje ValueChanged="Slider_ValueChanged" - jedna metoda obsługuje wszystkie trzy, bo i tak odczytuje komplet wartości. Najszybciej: wpisz ValueChanged= i wybierz New Event Handler - Visual Studio samo utworzy metodę w code-behind.

W metodzie odczytujemy Value każdego suwaka i rzutujemy na byte - liczbę 0-255, dokładnie zakres składowej koloru. Wpisujemy je do etykiet po prawej (Content). Przesuń suwak w podglądzie: liczba obok zmienia się razem z nim (R.3.4).

Pierwsze trzy linie metody są ważne: WPF wywołuje ValueChanged już podczas budowania okna, kiedy XAML ustawia Value="255" pierwszego suwaka - a wtedy kolejne suwaki i etykiety jeszcze nie istnieją. if (!IsLoaded) return; pomija te wywołania, dopóki okno nie jest gotowe.

Typowe błędy

Bez warunku IsLoaded aplikacja kończy się wyjątkiem NullReferenceException zaraz po starcie: pierwszy suwak zgłasza zmianę wartości, zanim greenSlider i etykiety zostaną utworzone. Na zrzucie zamiast okna jest wtedy okno błędu.

desktopowa/MainWindow.xaml XAML zmienione: 6 linii

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="R" />
            <Label Grid.Row="1" Grid.Column="0" Content="G" />
            <Label Grid.Row="2" Grid.Column="0" Content="B" />
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Label x:Name="redValue" Grid.Row="0" Grid.Column="2" Content="255" />
            <Label x:Name="greenValue" Grid.Row="1" Grid.Column="2" Content="255" />
            <Label x:Name="blueValue" Grid.Row="2" Grid.Column="2" Content="255" />
        </Grid>
        <Button Content="Pobierz" Background="#CD853F" Width="150" Height="25" Margin="0,10,0,0" />
        <Label x:Name="savedColor" Content="255, 255, 255" Background="White" Width="150" Margin="0,10,0,0" />
    </StackPanel>
</Window>

desktopowa/MainWindow.xaml.cs C# zmienione: 14 linii

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace desktopowa;

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        if (!IsLoaded)
        {
            return;
        }
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        redValue.Content = red.ToString();
        greenValue.Content = green.ToString();
        blueValue.Content = blue.ToString();
    }
}

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 22: Kolor dużego prostokąta z suwaków

Kryteria:

R.3.5 Zmiana położenia każdego z trzech suwaków powoduje zmianę koloru dużego prostokąta. Kolor odpowiada wartościom RGB ustawionym na suwakach (w uruchomionej aplikacji lub na zrzucie i obowiązkowo w kodzie)

ok. 2 min

Polecenie z arkusza

Zmiany położenia suwaków powodują ustawienie koloru dużego prostokąta na wartość RGB odpowiadającą suwakom (obraz 3).

Tło w WPF to pędzel (Brush), nie sam kolor. Color.FromRgb(red, green, blue) składa kolor z trzech bajtów - stąd rzutowanie na byte - a konstruktor SolidColorBrush robi z niego pędzel jednolitego koloru. Przypisujemy go do Background prostokąta. Przesuń dowolny suwak: prostokąt od razu zmienia kolor (R.3.5).

desktopowa/MainWindow.xaml.cs C# zmienione: 1 linia

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace desktopowa;

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        if (!IsLoaded)
        {
            return;
        }
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        redValue.Content = red.ToString();
        greenValue.Content = green.ToString();
        blueValue.Content = blue.ToString();
        colorRectangle.Background = new SolidColorBrush(Color.FromRgb(red, green, blue));
    }
}

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 23: Przycisk Pobierz: kolor małego prostokąta

Kryteria: ,

R.3.3 Zdefiniowana metoda obsługująca kliknięcie przycisku

R.3.6 Tylko po kliknięciu przycisku zmienia się kolor małego prostokąta. Kolor odpowiada wartościom RGB ustawionym na suwakach (w uruchomionej aplikacji lub na zrzucie i obowiązkowo w kodzie)

ok. 3 min

Polecenie z arkusza

Po wciśnięciu przycisku „Pobierz” mały prostokąt na dole okna ma ustawiony kolor oraz tekst odpowiadający aktualnemu RGB (obraz 4).

Click="FetchButton_Click" w przycisku i metoda o tej nazwie w code-behind (R.3.3). Odczytujemy suwaki tak samo jak w poprzedniej metodzie i ustawiamy tło małego prostokąta. Ten kod wykonuje się wyłącznie po kliknięciu - dlatego dalsze ruchy suwakami nie zmieniają już pobranego koloru (obraz 5, R.3.6). Ustaw kolor, kliknij „Pobierz”, potem przesuń suwak: duży prostokąt się zmienia, mały - nie.

desktopowa/MainWindow.xaml XAML zmienione: 2 linie

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="R" />
            <Label Grid.Row="1" Grid.Column="0" Content="G" />
            <Label Grid.Row="2" Grid.Column="0" Content="B" />
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Label x:Name="redValue" Grid.Row="0" Grid.Column="2" Content="255" />
            <Label x:Name="greenValue" Grid.Row="1" Grid.Column="2" Content="255" />
            <Label x:Name="blueValue" Grid.Row="2" Grid.Column="2" Content="255" />
        </Grid>
        <Button Content="Pobierz" Background="#CD853F" Width="150" Height="25" Margin="0,10,0,0"
                Click="FetchButton_Click" />
        <Label x:Name="savedColor" Content="255, 255, 255" Background="White" Width="150" Margin="0,10,0,0" />
    </StackPanel>
</Window>

desktopowa/MainWindow.xaml.cs C# zmienione: 8 linii

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace desktopowa;

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        if (!IsLoaded)
        {
            return;
        }
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        redValue.Content = red.ToString();
        greenValue.Content = green.ToString();
        blueValue.Content = blue.ToString();
        colorRectangle.Background = new SolidColorBrush(Color.FromRgb(red, green, blue));
    }

    private void FetchButton_Click(object sender, RoutedEventArgs e)
    {
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        savedColor.Background = new SolidColorBrush(Color.FromRgb(red, green, blue));
    }
}

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 24: Przycisk Pobierz: tekst z wartościami RGB

Kryteria:

R.3.7 Po kliknięciu przycisku zmienia się tekst w małym prostokącie, odpowiada on wartościom suwaków (w uruchomionej aplikacji lub na zrzucie i obowiązkowo w kodzie)

ok. 2 min

Polecenie z arkusza

Po wciśnięciu przycisku „Pobierz” mały prostokąt na dole okna ma ustawiony kolor oraz tekst odpowiadający aktualnemu RGB (obraz 4). Mały prostokąt nie zmienia się, jego zmianę może wywołać dopiero przyciśnięcie przycisku „Pobierz”.

Treść etykiety składamy z trzech liczb rozdzielonych przecinkiem i spacją - jak „66, 113, 183” na obrazie 4 (R.3.7). Liczba plus napis daje w C# napis, więc red + ", " + green działa bez jawnej konwersji. Aplikacja jest kompletna.

desktopowa/MainWindow.xaml.cs C# zmienione: 1 linia

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace desktopowa;

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        if (!IsLoaded)
        {
            return;
        }
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        redValue.Content = red.ToString();
        greenValue.Content = green.ToString();
        blueValue.Content = blue.ToString();
        colorRectangle.Background = new SolidColorBrush(Color.FromRgb(red, green, blue));
    }

    private void FetchButton_Click(object sender, RoutedEventArgs e)
    {
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        savedColor.Background = new SolidColorBrush(Color.FromRgb(red, green, blue));
        savedColor.Content = red + ", " + green + ", " + blue;
    }
}

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 25: Folder desktopowa: archiwum, źródła, plik exe
Kryteria:
R.4.9 Na płycie wszystkie wykonane projekty są spakowane oraz umieszczone pliki źródłowe i pliki wykonywalne (jeśli istnieją) na zewnątrz archiwów
ok. 3 min
Polecenie z arkusza
Kod aplikacji przygotuj do nagrania na płytę. W folderze desktopowa powinno znaleźć się archiwum całego projektu o nazwie desktopowa.zip, skopiowane z projektu pliki źródłowe, które były modyfikowane w czasie egzaminu (interfejs użytkownika i logika aplikacji) oraz plik wykonywalny, jeżeli istnieje.
Pakujemy folder projektu do desktopowa.zip i kopiujemy obok oba zmienione pliki: MainWindow.xaml (interfejs) i MainWindow.xaml.cs (logika), a także desktopowa.exe z bin\Debug\net…-windows razem z sąsiednimi desktopowa.dll i desktopowa.runtimeconfig.json. Foldery bin i obj można przed spakowaniem usunąć - Visual Studio odtworzy je przy budowaniu.
Okno aplikacji bez zmian - taki jak po kroku 24.

Etap 4: Dokumentacja aplikacji

Kroki 26-29 · po tym etapie masz 32 z 32 kryteriów (pkt)

Krok 26: Komentarz dokumentujący metodę DrawNumbers

Kryteria: , , , ,

R.4.1 Dla dowolnej funkcji lub metody zapisany nagłówek w postaci komentarza zgodnego z Listingiem 1 z arkusza egzaminacyjnego (nie należy brać pod uwagę liczby gwiazdek) , komentarz może być wieloliniowy lub kilka jednoliniowych, lub Docstrings (potrójny cudzysłów) - w tym przypadku opis znajduje się pod nazwą funkcji

R.4.2 W komentarzu umieszczona nazwa funkcji / metody oraz opisane jej działanie

R.4.3 W komentarzu umieszczone wszystkie argumenty funkcji / metody: nazwy i krótki opis lub "brak", gdy nie ma argumentów

R.4.4 W komentarzu umieszczona nazwa typu zwracanego i krótki opis co jest zwracane lub "brak", gdy funkcja nie zwraca wartości

R.4.5 W komentarzu umieszczony numer zdającego

ok. 4 min

Polecenie z arkusza

W kodzie źródłowym aplikacji konsolowej za pomocą komentarza utwórz nagłówek jednej dowolnej funkcji/metody, według wzoru z listingu 1. Komentarz powinien znaleźć się nad lub pod nazwą funkcji. W miejscu nawiasów <> należy podać odpowiednie opisy. W miejscu autor należy podać numer zdającego.

Komentarz wieloliniowy /* ... */ nad metodą, z gwiazdkami jak w listingu 1 (ich liczba jest dowolna). Opisujemy DrawNumbers, bo ma i parametr, i wynik - nagłówek pokazuje wtedy wszystkie pola wzoru: nazwę i działanie (R.4.2), parametr count z opisem (R.4.3), typ int[,] z opisem (R.4.4) i autora (R.4.5) - na egzaminie numer PESEL, tu Bartosz Bryniarski. Opis musi zgadzać się z kodem: gdybyśmy opisali IsInDraw, trzeba by wymienić wszystkie cztery jej parametry.

konsola/Program.cs C# zmienione: 7 linii

namespace konsola;

class Program
{
    static void Main(string[] args)
    {
        Console.WriteLine("Ile wygenerować losowań?");
        int count = Convert.ToInt32(Console.ReadLine());

        int[,] draws = DrawNumbers(count);
        Console.WriteLine("Zestawy wylosowanych liczb:");
        PrintDraws(draws);

        int[] occurrences = CountOccurrences(draws);
        PrintOccurrences(occurrences);
    }

    /**********************************************
     nazwa funkcji:       DrawNumbers
     opis funkcji:        losuje zestawy po 6 różnych liczb z zakresu 1-49
     parametry:           count - liczba zestawów do wylosowania
     zwracany typ i opis: int[,] - tablica count × 6 z wylosowanymi liczbami
     autor:               Bartosz Bryniarski
    ***********************************************/
    static int[,] DrawNumbers(int count)
    {
        Random random = new Random();
        int[,] draws = new int[count, 6];
        for (int row = 0; row < count; row++)
        {
            for (int column = 0; column < 6; column++)
            {
                int number;
                do
                {
                    number = random.Next(1, 50);
                }
                while (IsInDraw(draws, row, column, number));
                draws[row, column] = number;
            }
        }
        return draws;
    }

    static bool IsInDraw(int[,] draws, int row, int filled, int number)
    {
        for (int column = 0; column < filled; column++)
        {
            if (draws[row, column] == number)
            {
                return true;
            }
        }
        return false;
    }

    static int[] CountOccurrences(int[,] draws)
    {
        int[] occurrences = new int[50];
        foreach (int number in draws)
        {
            occurrences[number]++;
        }
        return occurrences;
    }

    static void PrintOccurrences(int[] occurrences)
    {
        for (int number = 1; number <= 49; number++)
        {
            Console.WriteLine("Wystąpienia liczby " + number + ": " + occurrences[number]);
        }
    }

    static void PrintDraws(int[,] draws)
    {
        for (int row = 0; row < draws.GetLength(0); row++)
        {
            Console.Write("Losowanie " + (row + 1) + ":");
            for (int column = 0; column < 6; column++)
            {
                Console.Write(" " + draws[row, column]);
            }
            Console.WriteLine();
        }
    }
}

Wynik programu po tym kroku

> konsola.exe
Ile wygenerować losowań?
11
Zestawy wylosowanych liczb:
Losowanie 1: 34 25 36 26 13 20
Losowanie 2: 40 39 4 35 41 49
Losowanie 3: 7 33 1 30 34 12
Losowanie 4: 29 14 2 47 6 26
Losowanie 5: 43 31 2 26 19 16
Losowanie 6: 16 30 44 17 35 37
Losowanie 7: 3 9 6 1 13 46
Losowanie 8: 33 37 34 45 40 29
Losowanie 9: 2 3 29 45 38 11
Losowanie 10: 29 24 33 32 10 38
Losowanie 11: 22 14 25 47 20 33
Wystąpienia liczby 1: 2
Wystąpienia liczby 2: 3
Wystąpienia liczby 3: 2
Wystąpienia liczby 4: 1
Wystąpienia liczby 5: 0
Wystąpienia liczby 6: 2
Wystąpienia liczby 7: 1
Wystąpienia liczby 8: 0
Wystąpienia liczby 9: 1
Wystąpienia liczby 10: 1
Wystąpienia liczby 11: 1
Wystąpienia liczby 12: 1
Wystąpienia liczby 13: 2
Wystąpienia liczby 14: 2
Wystąpienia liczby 15: 0
Wystąpienia liczby 16: 2
Wystąpienia liczby 17: 1
Wystąpienia liczby 18: 0
Wystąpienia liczby 19: 1
Wystąpienia liczby 20: 2
Wystąpienia liczby 21: 0
Wystąpienia liczby 22: 1
Wystąpienia liczby 23: 0
Wystąpienia liczby 24: 1
Wystąpienia liczby 25: 2
Wystąpienia liczby 26: 3
Wystąpienia liczby 27: 0
Wystąpienia liczby 28: 0
Wystąpienia liczby 29: 4
Wystąpienia liczby 30: 2
Wystąpienia liczby 31: 1
Wystąpienia liczby 32: 1
Wystąpienia liczby 33: 4
Wystąpienia liczby 34: 3
Wystąpienia liczby 35: 2
Wystąpienia liczby 36: 1
Wystąpienia liczby 37: 2
Wystąpienia liczby 38: 2
Wystąpienia liczby 39: 1
Wystąpienia liczby 40: 2
Wystąpienia liczby 41: 1
Wystąpienia liczby 42: 0
Wystąpienia liczby 43: 1
Wystąpienia liczby 44: 1
Wystąpienia liczby 45: 2
Wystąpienia liczby 46: 1
Wystąpienia liczby 47: 2
Wystąpienia liczby 48: 0
Wystąpienia liczby 49: 1

Krok 27: Zrzut konsola1
Kryteria: , , ,
R.2.8 Program uruchamia się w konsoli, co jest udokumentowane zrzutem ekranu
R.1.6 Podjęta próba uruchomienia, co jest udokumentowane zrzutem przedstawiającym uruchomiony program lub jego kompilację
R.4.6 Zapisany przynajmniej jeden zrzut ekranu z uruchomienia lub kompilacji aplikacji konsolowej, na zrzucie widoczne jest środowisko, w którym powstała aplikacja
R.2.5 Program wyświetla zawartość tablicy lub kolekcji za pomocą pętli. Wyświetlone wszystkie losowania (w uruchomionej aplikacji lub na zrzucie i obowiązkowo w kodzie)
ok. 3 min
Polecenie z arkusza
Wykonaj zrzuty ekranu dokumentujące uruchomienie aplikacji utworzonych podczas egzaminu. Zrzuty powinny obejmować cały obszar ekranu monitora z widocznym paskiem zadań. Jeżeli aplikacja uruchamia się, na zrzucie należy umieścić okno z wynikiem działania programu oraz otwarte środowisko programistyczne z projektem lub okno terminala z kompilacją projektu. Aplikacja konsolowa – dowolna liczba zrzutów nazwanych konsola1, konsola2, ...
Uruchamiamy program (Ctrl+F5), wpisujemy liczbę losowań i robimy zrzut całego ekranu (Print Screen) z oknem konsoli, Visual Studio i paskiem zadań - konsola1.png w folderze dokumentacja. Lista wystąpień jest długa i nie zmieści się w oknie; drugi zrzut (konsola2.png) po przewinięciu konsoli pokaże jej koniec. Obok - prawdziwy wynik programu.
Wynik programu bez zmian - taki jak po kroku 26.
Krok 28: Zrzuty desktop1-desktop4
Kryteria: ,
R.3.8 Program uruchamia się w oknie, co jest udokumentowane zrzutem ekranu (wymagana przynajmniej jedna kontrolka w oknie)
R.4.7 Zapisany przynajmniej jeden zrzut ekranu z uruchomienia lub kompilacji aplikacji desktopowej, na zrzucie widoczne jest środowisko, w którym powstała aplikacja
ok. 4 min
Polecenie z arkusza
Wykonać należy tyle zrzutów, ile interakcji podejmuje aplikacja (np. stan początkowy, po wybraniu przycisków itd.). Aplikacja desktopowa – dowolna liczba zrzutów nazwanych desktop1, desktop2, ...
Uruchamiamy aplikację (F5) i robimy cztery zrzuty całego ekranu, tak jak obrazy 2-5 arkusza: desktop1.png - stan początkowy, desktop2.png - po przesunięciu suwaków, desktop3.png - po kliknięciu „Pobierz”, desktop4.png - po kolejnym przesunięciu suwaków (mały prostokąt bez zmian). Na każdym ma być okno aplikacji i Visual Studio.
Obok jest prawdziwy render okna tej aplikacji w stanie 4 (zbudowanej z kodu z poprzednich kroków): pobrany kolor 66, 113, 183, a suwaki przestawione dalej.
Typowe błędy
Zrzut samego okna aplikacji (Alt+Print Screen) nie spełnia R.4.7 - na zrzucie ma być widać środowisko, w którym powstała aplikacja.
Okno aplikacji po tym kroku
Krok 29: Plik egzamin
Kryteria:
R.4.8 Dokumentacja zawiera: nazwę systemu operacyjnego, nazwy środowisk programistycznych, nazwy języków programowania (stosowanych przez zdającego)
ok. 2 min
Polecenie z arkusza
Utwórz plik z dokumentacją i nazwij go egzamin. Dokument powinien zawierać informacje o narzędziach wykorzystanych na egzaminie: Nazwę systemu operacyjnego, Nazwy środowisk programistycznych, Nazwy języków programowania. Zrzuty ekranu i dokument umieść w folderze dokumentacja.
Plik egzamin w folderze dokumentacja: system, środowisko i języki - to, czego naprawdę używaliśmy. XAML to język znaczników, ale cały widok okna jest w nim napisany, więc warto go wymienić obok C#.
egzamin.txt Tekst nowy plik
System operacyjny: Windows 11 Środowisko programistyczne: Visual Studio 2022 (aplikacja konsolowa i desktopowa, platforma .NET) Języki programowania: C# (obie aplikacje), XAML (widok aplikacji desktopowej WPF)
Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Etap 5: Dobre praktyki (poza kluczem)

Kroki 30-32 · po tym etapie masz 32 z 32 kryteriów (pkt)

Krok 30: Konsola: bezpieczne wczytanie liczby przez TryParse

ok. 3 min

Polecenie z arkusza

Program wczytuje z klawiatury ile zestawów należy wylosować.

Convert.ToInt32("abc") kończy program wyjątkiem FormatException, a ujemna liczba - wyjątkiem przy tworzeniu tablicy. int.TryParse nie rzuca wyjątku: zwraca true albo false i wynik zapisuje do zmiennej przekazanej przez out. Pętla while pyta ponownie, dopóki tekst nie jest liczbą albo liczba nie jest dodatnia (|| - wystarczy jeden powód, żeby pytać dalej). Stara linia zostaje w komentarzu.

Na egzaminie wystarczy wersja wcześniejsza - klucz tego nie sprawdza.

konsola/Program.cs C# zmienione: 6 linii

namespace konsola;

class Program
{
    static void Main(string[] args)
    {
        Console.WriteLine("Ile wygenerować losowań?");
        int count;
        while (!int.TryParse(Console.ReadLine(), out count) || count < 1)
        {
            Console.WriteLine("Podaj liczbę całkowitą większą od zera:");
        }
        // int count = Convert.ToInt32(Console.ReadLine());

        int[,] draws = DrawNumbers(count);
        Console.WriteLine("Zestawy wylosowanych liczb:");
        PrintDraws(draws);

        int[] occurrences = CountOccurrences(draws);
        PrintOccurrences(occurrences);
    }

    /**********************************************
     nazwa funkcji:       DrawNumbers
     opis funkcji:        losuje zestawy po 6 różnych liczb z zakresu 1-49
     parametry:           count - liczba zestawów do wylosowania
     zwracany typ i opis: int[,] - tablica count × 6 z wylosowanymi liczbami
     autor:               Bartosz Bryniarski
    ***********************************************/
    static int[,] DrawNumbers(int count)
    {
        Random random = new Random();
        int[,] draws = new int[count, 6];
        for (int row = 0; row < count; row++)
        {
            for (int column = 0; column < 6; column++)
            {
                int number;
                do
                {
                    number = random.Next(1, 50);
                }
                while (IsInDraw(draws, row, column, number));
                draws[row, column] = number;
            }
        }
        return draws;
    }

    static bool IsInDraw(int[,] draws, int row, int filled, int number)
    {
        for (int column = 0; column < filled; column++)
        {
            if (draws[row, column] == number)
            {
                return true;
            }
        }
        return false;
    }

    static int[] CountOccurrences(int[,] draws)
    {
        int[] occurrences = new int[50];
        foreach (int number in draws)
        {
            occurrences[number]++;
        }
        return occurrences;
    }

    static void PrintOccurrences(int[] occurrences)
    {
        for (int number = 1; number <= 49; number++)
        {
            Console.WriteLine("Wystąpienia liczby " + number + ": " + occurrences[number]);
        }
    }

    static void PrintDraws(int[,] draws)
    {
        for (int row = 0; row < draws.GetLength(0); row++)
        {
            Console.Write("Losowanie " + (row + 1) + ":");
            for (int column = 0; column < 6; column++)
            {
                Console.Write(" " + draws[row, column]);
            }
            Console.WriteLine();
        }
    }
}

Okno aplikacji bez zmian - taki jak po kroku 29.

Krok 31: WPF: wartości przy suwakach przez wiązanie danych

ok. 4 min

Polecenie z arkusza

Z prawej strony suwaków etykiety z aktualną wartością suwaka, początkowo ustawione na 255.

WPF potrafi połączyć dwie kontrolki bez ani jednej linii C#: wiązanie danych (Binding). Content="{Binding ElementName=redSlider, Path=Value}" mówi: treścią etykiety jest właściwość Value kontrolki redSlider - i WPF sam aktualizuje etykietę przy każdym ruchu suwaka, także na starcie (stąd 255 bez wpisywania). Etykiety nie potrzebują już nazw, a trzy linie w Slider_ValueChanged przechodzą do komentarza - metoda zajmuje się tylko kolorem. Wartości są całkowite, bo suwaki przyciągają do pełnych liczb.

Na egzaminie wystarczy wersja wcześniejsza - klucz tego nie sprawdza. Wiązanie danych to podstawa WPF, wzorzec MVVM opiera się na nim w całości.

desktopowa/MainWindow.xaml XAML zmienione: 6 linii

<Window x:Class="desktopowa.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:desktopowa"
        mc:Ignorable="d"
        Title="Wzornik kolorów RGB. Wykonał Bartosz Bryniarski" Height="450" Width="800"
        Background="#FFF8DC">
    <StackPanel Margin="20">
        <Border x:Name="colorRectangle" Height="60" Background="White" />
        <Label Content="Dobierz kolor suwakami i zapisz przyciskiem:" Margin="0,20,0,0" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
                <RowDefinition Height="30" />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="R" />
            <Label Grid.Row="1" Grid.Column="0" Content="G" />
            <Label Grid.Row="2" Grid.Column="0" Content="B" />
            <Slider x:Name="redSlider" Grid.Row="0" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Slider x:Name="greenSlider" Grid.Row="1" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Slider x:Name="blueSlider" Grid.Row="2" Grid.Column="1" Minimum="0" Maximum="255" Value="255"
                    IsSnapToTickEnabled="True" TickFrequency="1" VerticalAlignment="Center"
                    ValueChanged="Slider_ValueChanged" />
            <Label Grid.Row="0" Grid.Column="2"
                   Content="{Binding ElementName=redSlider, Path=Value}" />
            <Label Grid.Row="1" Grid.Column="2"
                   Content="{Binding ElementName=greenSlider, Path=Value}" />
            <Label Grid.Row="2" Grid.Column="2"
                   Content="{Binding ElementName=blueSlider, Path=Value}" />
        </Grid>
        <Button Content="Pobierz" Background="#CD853F" Width="150" Height="25" Margin="0,10,0,0"
                Click="FetchButton_Click" />
        <Label x:Name="savedColor" Content="255, 255, 255" Background="White" Width="150" Margin="0,10,0,0" />
    </StackPanel>
</Window>

desktopowa/MainWindow.xaml.cs C# zmienione: 3 linie

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace desktopowa;

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        if (!IsLoaded)
        {
            return;
        }
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        // redValue.Content = red.ToString();
        // greenValue.Content = green.ToString();
        // blueValue.Content = blue.ToString();
        colorRectangle.Background = new SolidColorBrush(Color.FromRgb(red, green, blue));
    }

    private void FetchButton_Click(object sender, RoutedEventArgs e)
    {
        byte red = (byte)redSlider.Value;
        byte green = (byte)greenSlider.Value;
        byte blue = (byte)blueSlider.Value;
        savedColor.Background = new SolidColorBrush(Color.FromRgb(red, green, blue));
        savedColor.Content = red + ", " + green + ", " + blue;
    }
}

Okno aplikacji po tym kroku

Symulacja ekranu w przeglądarce - w Android Studio / Visual Studio wygląd może się nieco różnić.

Krok 32: WPF: metoda CurrentColor zamiast powtórzonego odczytu

ok. 3 min

Polecenie z arkusza

Aplikacja powinna być zapisana czytelnie, z zasadami czystego formatowania kodu, należy stosować znaczące nazwy zmiennych i funkcji.

Obie metody zdarzeń zaczynały się od tych samych trzech linii odczytu suwaków. Przenosimy je do jednej metody CurrentColor(), która zwraca gotowy Color - kolor zna swoje składowe (color.R, color.G, color.B), więc z niego składamy też napis. Gdyby dołączyć czwarty suwak (przezroczystość), zmienia się jedno miejsce zamiast dwóch. Działanie aplikacji jest takie samo.

Na egzaminie wystarczy wersja wcześniejsza - klucz tego nie sprawdza.

desktopowa/MainWindow.xaml.cs C# zmienione: 10 linii

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace desktopowa;

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private Color CurrentColor()
    {
        return Color.FromRgb((byte)redSlider.Value, (byte)greenSlider.Value, (byte)blueSlider.Value);
    }

    private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        if (!IsLoaded)
        {
            return;
        }
        Color color = CurrentColor();
        // redValue.Content = red.ToString();
        // greenValue.Content = green.ToString();
        // blueValue.Content = blue.ToString();
        colorRectangle.Background = new SolidColorBrush(color);
    }

    private void FetchButton_Click(object sender, RoutedEventArgs e)
    {
        Color color = CurrentColor();
        savedColor.Background = new SolidColorBrush(color);
        savedColor.Content = color.R + ", " + color.G + ", " + color.B;
    }
}

Okno aplikacji bez zmian - taki jak po kroku 31.

Etap 6: Oddanie pracy
Krok 33 · po tym etapie masz 32 z 32 kryteriów (pkt)
Krok 33: Nagranie płyty
Kryteria:
R.4.9 Na płycie wszystkie wykonane projekty są spakowane oraz umieszczone pliki źródłowe i pliki wykonywalne (jeśli istnieją) na zewnątrz archiwów
ok. 5 min
Polecenie z arkusza
UWAGA: Nagraj płytę z rezultatami pracy. W folderze z numerem zdającego powinny się znajdować podfoldery desktopowa, dokumentacja, konsolowa. W folderze desktopowa: spakowany cały projekt aplikacji desktopowej, pliki ze źródłami interfejsu i logiki, opcjonalnie plik wykonywalny. W folderze dokumentacja: pliki ze zrzutami oraz plik egzamin. W folderze konsolowa: spakowany cały projekt aplikacji konsolowej, pliki źródłowe, opcjonalnie plik wykonywalny.
Sprawdzamy zawartość przed nagraniem:
desktopowa: desktopowa.zip, MainWindow.xaml, MainWindow.xaml.cs, desktopowa.exe (z plikami .dll i .runtimeconfig.json),
dokumentacja: konsola1.png, konsola2.png, desktop1.png - desktop4.png, egzamin,
konsolowa: konsola.zip (z komentarzem dokumentującym), Program.cs, konsola.exe (z plikami towarzyszącymi).
Projekty spakowane, źródła i pliki wykonywalne obok archiwów (R.4.9). Nagrywamy, sprawdzamy odczyt płyty, opisujemy ją numerem zdającego. Pusta lub nieczytelna płyta to zero punktów za wszystkie rezultaty.
Okno aplikacji bez zmian - taki jak po kroku 31.

To jedno z możliwych rozwiązań. Egzaminator ocenia spełnienie kryteriów z klucza odpowiedzi, a nie zgodność z tym kodem - inna, poprawna droga też daje punkty.

Autor rozwiązania: Bartosz Bryniarski. Licencja CC BY-NC 4.0 - kopiowanie i przeróbki do celów niekomercyjnych, z podaniem autora i źródła (link do tej strony). Treść arkusza i klucza oceniania pochodzi z CKE.

Rozwiązanie krok po kroku: Loteria liczbowa i wzornik RGB (C# + WPF)

Etap 1: Przygotowanie

Krok 1: Folder zdającego i trzy podfoldery

Etap 2: Aplikacja konsolowa

Krok 2: Nowy projekt konsola w Visual Studio

Krok 3: Wczytanie liczby losowań z klawiatury

Krok 4: Metoda DrawNumbers i tablica n × 6

Krok 5: Wypełnienie tablicy liczbami z zakresu 1-49

Krok 6: Metoda PrintDraws: wyświetlenie wszystkich losowań

Krok 7: Liczby w zestawie bez powtórzeń

Krok 8: Zliczanie wystąpień liczb 1-49

Krok 9: Wyświetlenie liczby wystąpień

Krok 10: Folder konsolowa: archiwum, źródło, plik exe

Etap 3: Aplikacja desktopowa

Krok 11: Nowy projekt WPF desktopowa

Krok 12: Tytuł okna

Krok 13: Tło okna Cornsilk

Krok 14: Układ StackPanel i duży biały prostokąt

Krok 15: Napis nad suwakami

Krok 16: Trzy suwaki 0-255 w siatce Grid

Krok 17: Etykiety R, G, B po lewej

Krok 18: Etykiety z wartością suwaków po prawej

Krok 19: Przycisk Pobierz w kolorze Peru

Krok 20: Mały prostokąt z napisem 255, 255, 255

Krok 21: Zdarzenie ValueChanged: wartości przy suwakach

Krok 22: Kolor dużego prostokąta z suwaków

Krok 23: Przycisk Pobierz: kolor małego prostokąta

Krok 24: Przycisk Pobierz: tekst z wartościami RGB

Krok 25: Folder desktopowa: archiwum, źródła, plik exe

Etap 4: Dokumentacja aplikacji

Krok 26: Komentarz dokumentujący metodę DrawNumbers

Krok 27: Zrzut konsola1

Krok 28: Zrzuty desktop1-desktop4

Krok 29: Plik egzamin

Etap 5: Dobre praktyki (poza kluczem)

Krok 30: Konsola: bezpieczne wczytanie liczby przez TryParse

Krok 31: WPF: wartości przy suwakach przez wiązanie danych

Krok 32: WPF: metoda CurrentColor zamiast powtórzonego odczytu

Etap 6: Oddanie pracy

Krok 33: Nagranie płyty

Podgląd