Samouczek: tworzenie aplikacji Windows Forms przeglądarki obrazów w programie Visual Studio

W tej serii trzech samouczków utworzysz aplikację Windows Forms, która ładuje obraz i wyświetla go. Zintegrowane środowisko projektowe programu Visual Studio (IDE) udostępnia narzędzia potrzebne do utworzenia aplikacji. Aby dowiedzieć się więcej, zobacz Witamy w środowisku IDE programu Visual Studio.

Z tego pierwszego samouczka dowiesz się, jak wykonywać następujące działania:

• Tworzenie projektu programu Visual Studio korzystającego z formularzy Windows Forms
• Dodawanie elementu układu
• Uruchamianie aplikacji

Wymagania wstępne

Do ukończenia tego samouczka potrzebny jest program Visual Studio. Odwiedź stronę pobierania programu Visual Studio, aby uzyskać bezpłatną wersję.

Tworzenie projektu formularzy systemu Windows

Podczas tworzenia przeglądarki obrazów pierwszym krokiem jest utworzenie projektu aplikacji Windows Forms App.

1. Otwórz program Visual Studio.

2. W oknie uruchamiania wybierz pozycję Utwórz nowy projekt.

   

3. W oknie Tworzenie nowego projektu wyszukaj pozycję Windows Forms. Następnie wybierz pozycję Pulpit z listy Typ projektu.

4. Wybierz szablon Windows Forms App (.NET Framework) dla języka C# lub Visual Basic, a następnie wybierz przycisk Dalej.

   

   Uwaga

   Jeśli nie widzisz szablonu Aplikacji formularzy systemu Windows (.NET Framework), możesz zainstalować go w oknie Tworzenie nowego projektu . W komunikacie Nie można znaleźć tego, czego szukasz? wybierz link Zainstaluj więcej narzędzi i funkcji.

   

   Następnie w Instalator programu Visual Studio wybierz pozycję Programowanie aplikacji klasycznych .NET.

   

   Wybierz pozycję Modyfikuj w Instalator programu Visual Studio. Może zostać wyświetlony monit o zapisanie pracy. Następnie wybierz pozycję Kontynuuj , aby zainstalować obciążenie.

5. W oknie Konfigurowanie nowego projektu nadaj projektowi nazwę PictureViewer, a następnie wybierz pozycję Utwórz.

   

Program Visual Studio tworzy rozwiązanie dla aplikacji. Rozwiązanie to kontener dla wszystkich projektów i plików wymaganych przez aplikację.

W tym momencie program Visual Studio wyświetla pusty formularz w formularzu systemu Windows Projektant.

Dodawanie elementu układu

Aplikacja do wyświetlania obrazów zawiera pole wyboru, pole wyboru i cztery przyciski, które zostaną dodane w następnym samouczku. Element układu kontroluje ich lokalizację w formularzu. W tej sekcji pokazano, jak zmienić tytuł formularza, zmienić rozmiar formularza i dodać element układu.

1. W projekcie wybierz Projektant Windows Forms. Karta odczytuje format Form1.cs [Design] dla języka C# lub Form1.vb [Projektowanie] dla języka Visual Basic.

2. Wybierz dowolne miejsce w formularzu Form1.

3. W oknie Właściwości są teraz wyświetlane właściwości formularza. Okno Właściwości znajduje się zwykle w prawym dolnym rogu programu Visual Studio. Ta sekcja steruje różnymi właściwościami, takimi jak kolor pierwszego planu i tła, tekst tytułu wyświetlany w górnej części formularza oraz rozmiar formularza.

   Jeśli nie widzisz właściwości, wybierz pozycję Wyświetl>okno właściwości.

4. Znajdź właściwość Text w oknie Właściwości. W zależności od sposobu sortowania listy może być konieczne przewinięcie w dół. Wprowadź wartość Przeglądarka obrazów, a następnie wybierz klawisz Enter.

   Formularz ma teraz tekst Przeglądarka obrazów na pasku tytułu.

   Uwaga

   Właściwości można wyświetlić według kategorii lub alfabetycznie. Użyj przycisków w oknie Właściwości , aby przełączyć się tam i z powrotem.

5. Ponownie wybierz formularz. Wybierz uchwyt przeciągania w prawym dolnym rogu formularza. Uchwyt jest małym białym kwadratem w prawym dolnym rogu formularza.

   

   Przeciągnij uchwyt, aby zmienić rozmiar formularza, aby formularz był szerszy i nieco wyższy. Jeśli spojrzysz na okno Właściwości , właściwość Size została zmieniona. Rozmiar formularza można również zmienić, zmieniając właściwość Size .

6. Po lewej stronie środowiska IDE programu Visual Studio wybierz kartę Przybornik. Jeśli go nie widzisz, wybierz pozycję Wyświetl>przybornik na pasku menu lub Ctrl+Alt+X.

7. Wybierz mały symbol trójkąta obok pozycji Kontenery , aby otworzyć grupę.

   

8. Kliknij dwukrotnie tableLayoutPanel w przyborniku. Możesz również przeciągnąć kontrolkę z przybornika na formularz. Kontrolka TableLayoutPanel zostanie wyświetlona w formularzu.

   

   Uwaga

   Po dodaniu kontrolki TableLayoutPanel, jeśli w formularzu pojawi się okno z tytułem TableLayoutPanel Tasks, kliknij dowolne miejsce wewnątrz formularza, aby go zamknąć.

9. Wybierz tableLayoutPanel. Możesz sprawdzić, która kontrolka została wybrana, przeglądając okno Właściwości .

   

10. Po wybraniu kontrolki TableLayoutPanel znajdź właściwość Dock , która ma wartość None. Wybierz strzałkę listy rozwijanej, a następnie wybierz pozycję Wypełnij, czyli duży przycisk w środku menu rozwijanego.

    

    Docking odnosi się do sposobu dołączenia okna do innego okna lub obszaru.

    Kontrolka TableLayoutPanel wypełnia teraz cały formularz. Jeśli rozmiar formularza zostanie ponownie zmieniony, kontrolka TableLayoutPanel pozostanie zadokowana i zmienia rozmiar w celu dopasowania.

11. W formularzu wybierz tableLayoutPanel. W prawym górnym rogu znajduje się mały czarny przycisk trójkąta.

    Wybierz trójkąt, aby wyświetlić listę zadań kontrolki.

    

12. Wybierz pozycję Edytuj wiersze i kolumny , aby wyświetlić okno dialogowe Style kolumn i wierszy .

13. Wybierz pozycję Kolumna1 i ustaw jej rozmiar na 15 procent. Upewnij się, że wybrano przycisk Procent .

14. Wybierz pozycję Kolumna2 i ustaw ją na 85 procent.

    

15. W obszarze Pokaż w górnej części okna dialogowego Style kolumn i wierszy wybierz pozycję Wiersze. Ustaw wartość Row1 na 90 procent, a wartość Row2 na 10%. Aby zapisać zmiany, wybierz pozycję OK.

    Kontrolka TableLayoutPanel ma teraz duży górny wiersz, mały dolny wiersz, małą lewą kolumnę i dużą prawą kolumnę.

    

Układ został ukończony.

Uwaga

Przed uruchomieniem aplikacji zapisz aplikację, wybierając przycisk Zapisz wszystko na pasku narzędzi. Alternatywnie, aby zapisać aplikację, wybierz pozycję Plik>Zapisz wszystko na pasku menu lub naciśnij klawisze Ctrl+Shift+S. Najlepszym rozwiązaniem jest wczesne i częste zapisywanie.

Uruchamianie aplikacji

Podczas tworzenia projektu aplikacji Windows Forms należy utworzyć program, który jest uruchamiany. Na tym etapie aplikacja Picture Viewer nie robi zbyt wiele. Na razie zostanie wyświetlone puste okno z podglądem obrazów na pasku tytułu.

Aby uruchomić aplikację, wykonaj następujące kroki.

1. Użyj jednej z poniższych metod:

   • Wybierz klawisz F5.
   • Na pasku menu wybierz pozycję Debuguj>Rozpocznij debugowanie.
   • Na pasku narzędzi wybierz przycisk Uruchom .

   Program Visual Studio uruchamia aplikację. Zostanie wyświetlone okno z tytułem Przeglądarka obrazów.

   

   Spójrz na pasek narzędzi ide programu Visual Studio. Więcej przycisków jest wyświetlanych na pasku narzędzi po uruchomieniu aplikacji. Te przyciski umożliwiają wykonywanie takich czynności jak zatrzymywanie i uruchamianie aplikacji oraz pomaga w śledzeniu błędów.

   

2. Aby zatrzymać aplikację, użyj jednej z następujących metod:

   • Na pasku narzędzi wybierz przycisk Zatrzymaj debugowanie .
   • Na pasku menu wybierz pozycję Debuguj Zatrzymaj>debugowanie debugowania.
   • Na klawiaturze wprowadź klawisze Shift+F5.
   • Wybierz pozycję X w górnym rogu okna Przeglądarka obrazów.

   Po uruchomieniu aplikacji z poziomu środowiska IDE programu Visual Studio jest ona nazywana debugowaniem. Uruchom aplikację, aby znaleźć i naprawić usterki. Wykonasz tę samą procedurę, aby uruchomić i debugować inne programy. Aby dowiedzieć się więcej na temat debugowania, zobacz Pierwsze spojrzenie na debuger.

Następne kroki

Przejdź do następnego samouczka, aby dowiedzieć się, jak dodać kontrolki do programu Picture Viewer.

Samouczek, część 2. Dodawanie kontrolek do przeglądarki obrazów