Krok 4. Określenie układu formularza przy użyciu formantu TableLayoutPanel

W tym kroku dodasz formant TableLayoutPanel do formularza.TableLayoutPanel pomaga poprawnie wyrównać formanty w formularzu, który zostanie dodany później.

łącze do wideoWersja wideo tego tematu – zobacz Samouczek 1: Tworzenie przeglądarki obrazów w Visual Basic – wideo 2 lub Samouczek 1: Tworzenie przeglądarki obrazów w języku C# – wideo 2.W tych filmach wideo jest używana starsza wersja programu Visual Studio, więc istnieją drobne różnice w niektórych poleceniach menu i innych elementach interfejsu użytkownika.Jednakże pojęcia i procedury działają podobnie w bieżącej wersji programu Visual Studio.

Aby określić układ formularza z formantem TableLayoutPanel

  1. Po lewej stronie okna środowiska IDE programu Visual Studio zlokalizuj kartę Przybornik.Wybierz kartę Przybornik i Przybornik pojawi się. (Lub na pasku menu wybierz kolejno Widok, Przybornik).

  2. Wybierz symbol małego trójkąta obok grupy Kontenery, aby ją otworzyć, jak pokazano na poniższej ilustracji.

    Grupa kontenerów

    Grupa kontenerów

  3. Możesz dodać do swojego formularza formanty, takie jak przyciski, pola wyboru i etykiety.Kliknij dwukrotnie formant TableLayoutPanel w przyborniku. (Następnie można przeciągać formanty z przybornika do formularza). Gdy to robisz, dodaje IDE formant TableLayoutPanel do formularza, jak pokazano na poniższej ilustracji.

    Formant TableLayoutPanel

    TableLayoutPanel — formant

    [!UWAGA]

    Po dodaniu TableLayoutPanel, jeśli okno pojawia się wewnątrz formularza z tytułem Zadania formantu TableLayoutPanel, wybierz dowolne miejsce wewnątrz formularza, aby je zamknąć.Dowiesz się więcej na temat tego okna później w samouczku.

    Należy zauważyć, jak Przybornik rozszerza się w celu objęcia formularza po wybraniu jego karty i zamyka się po dokonaniu wyboru w dowolnym miejscu poza nią.To jest funkcja Autoukrywanie IDE.Możesz włączać i wyłączać dla każdego okna wybierając ikonę pinezki w prawym górnym rogu okna, aby przełączać automatyczne ukrywanie i blokowanie w miejscu .Ikona Pinezka wygląda następująco.

    Ikona pinezki

    Ikona Pinezka

  4. Upewnij się, że opcja TableLayoutPanel jest zaznaczone, wybierając ją.Możesz zweryfikować jaki formant jest zaznaczony, patrząc na listę rozwijaną w górnej części okna Właściwości, jak pokazano na poniższej ilustracji.

    Okno Właściwości pokazujące formant TableLayoutPanel

    Właściwości okna formant TableLayoutPanel

  5. Wybierz przycisk Alfabetycznie na pasku narzędzi w oknie Właściwości.Powoduje to, że lista właściwości w oknie Właściwości jest wyświetlana w kolejności alfabetycznej, co ułatwia lokalizowanie właściwości w tym samouczku.

  6. Selektor formantu to lista rozwijana u góry okna Właściwości.W tym przykładzie to pokazuje, że formant nazywany tableLayoutPanel1 jest zaznaczony.Możesz wybierać formanty wybierając obszar w programie Windows Forms Designer lub wybierając z selektora formantów.Teraz gdy zaznaczono pozycję TableLayoutPanel, należy znaleźć właściwość Dokowanie i wybrać polecenie Dokowanie, które powinno być ustawione na Brak.Należy zauważyć, że strzałka listy rozwijanej pojawia się obok wartości.Wybierz strzałkę, a następnie wybierz przycisk Wypełnij (duży przycisk na środku), jak pokazano na poniższej ilustracji.

    Okno Właściwości z zaznaczonym wypełnieniem

    Okno właściwości z wybrane wypełnienia

    Dokowanie w programie Visual Studio odnosi się do sytuacji, gdy okno jest dołączone do innego okna lub obszaru w IDE.Na przykład okno Właściwości może być oddokowane — czyli niezamocowane i swobodnie umieszczane w interfejsie Visual Studio — lub może być zadokowane przy Eksploratorze rozwiązań.

  7. Po ustawieniu właściwości TableLayoutPanel na Dock, panel wypełnia cały formularz.Jeżeli zmienisz rozmiar formularza ponownie, obiekt TableLayoutPanel pozostaje zadokowany i zmienia się, aby dopasować swój rozmiar.

    [!UWAGA]

    Element TableLayoutPanel działa jak tabela w programie Microsoft Office Word: ma wiersze i kolumny, i pojedyncze komórki, które mogą obejmować wiele wierszy i kolumn.Każda komórka może zawierać jeden formant (jak przycisk, pole wyboru lub etykietę).Twój TableLayoutPanel będzie miał formant PictureBox obejmujący cały górny wiersz, formant CheckBox w jego lewej dolnej komórce i cztery formanty Przycisk w dolnej prawej komórce.

  8. Obecnie TableLayoutPanel ma dwa równe rzędy wielkości i dwie kolumny równej wielkości.Musisz zmienić ich rozmiar, aby górny wiersz i prawa kolumna były znacznie większe.W Projektancie formularzy systemu Windows wybierz obiekt TableLayoutPanel.W prawym górnym rogu znajduje się przycisk mały trójkąt czarny, który wygląda następująco.

    Trójkątny przycisk

    Trójkąt

    Przycisk ten wskazuje, że formant ma zadanie, które pomaga Ci w automatycznym ustawianiu jego właściwości.

  9. Wybierz trójkąt, aby wyświetlić listę zadań kontroli, jak pokazano na poniższej ilustracji.

    Zadania TableLayoutPanel

    Zadania TableLayoutPanel

  10. Wybierz zadanie Edytuj wiersze i kolumny, aby wyświetlić okno Style kolumn i wierszy.Wybierz Kolumna1i ustaw jej rozmiar na 15 procent, upewniając się, że przycisk Procent jest zaznaczony i wprowadzono 15 w polu Procent. (To jest formant NumericUpDown, którego będziesz używać później w samouczku). Wybierz Kolumna2 i ustaw ją na 85 procent.Nie należy jeszcze wybierać przycisku OK, ponieważ okno zostanie zamknięte. (Ale jeśli to zrobisz, możesz otworzyć go ponownie za pomocą listy zadań).

    Kolumna TableLayoutPanel oraz style wierszy

    Style kolumn i wierszy TableLayoutPanel

  11. Z listy rozwijanej Pokaż u góry okna wybierz pozycję Wiersze.Ustaw Row1 na 90 procent a Row2 na 10 procent.

  12. Wybierz przycisk OK.Twój TableLayoutPanel teraz powinien mieć duży, górny wiersz, mały dolny wiersz, małą lewą kolumnę i dużą prawą kolumnę.Możesz zmieniać rozmiar wierszy i kolumn w TableLayoutPanel wybierając tableLayoutPanel1 w formularzu, a następnie przeciągając obramowania wierszy i kolumn.

    Formularz Form1 ze zmienionym rozmiarem panelu układu tabeli

    Formularz1 o zmienionym rozmiarze TableLayoutPanel

Aby kontynuować lub przeglądnąć