Przewodnik: rozmieszczanie kontrolek w formularzach systemu Windows przy użyciu linii przyciągania

  • Artykuł

Precyzyjne umieszczanie kontrolek w formularzu jest wysokim priorytetem dla wielu aplikacji. Zestaw Windows Forms Projektant udostępnia wiele narzędzi do tworzenia układu. Jedną z najważniejszych funkcji jest SnapLine .

Linie przyciągania pokazują dokładnie, gdzie można ustawić kontrolki w kolejce z innymi kontrolkami. Pokazują one również zalecane odległości dla marginesów między kontrolkami, zgodnie z wytycznymi interfejsu użytkownika systemu Windows.

Linie przyciągania ułatwiają wyrównanie kontrolek do ostrych, profesjonalnych wyglądów i zachowań (wygląd i działanie).

Tworzenie projektu

  1. W programie Visual Studio utwórz projekt aplikacji oparty na systemie Windows o nazwie "SnaplineExample".

  2. Wybierz formularz w Projektant Formularze.

Spacja i wyrównanie kontrolek

Linie przyciągania zapewniają dokładny i intuicyjny sposób wyrównywania kontrolek w formularzu. Są one wyświetlane podczas przenoszenia wybranej kontrolki lub kontrolek w pobliżu pozycji, która będzie zgodna z inną kontrolką lub zestawem kontrolek. Wybór będzie "przyciągany" do sugerowanej pozycji w miarę przesuwania jej obok innych kontrolek.

Aby rozmieścić kontrolki przy użyciu linii przyciągania

  1. Przeciągnij kontrolkę Button z przybornika na formularz.

  2. Przenieś kontrolkę Button do prawego dolnego rogu formularza. Zwróć uwagę na linie przyciągania, które są wyświetlane, gdy kontrolka Button zbliża się do dolnej i prawej krawędzi formularza. Te linie przyciągania wyświetlają zalecaną odległość między obramowaniami kontrolki a formularzem.

  3. Przenieś kontrolkę Button wokół obramowań formularza i zanotuj, gdzie są wyświetlane linie przyciągania. Po zakończeniu przenieś kontrolkę Button w pobliżu środka formularza.

  4. Przeciągnij kolejną Button kontrolkę z Przybornika na formularz.

  5. Przenieś drugą Button kontrolkę, dopóki nie będzie ona prawie wyrównana z pierwszą kontrolką. Zwróć uwagę na linię przyciągania, która jest wyświetlana w punkcie odniesienia tekstu obu przycisków, i zwróć uwagę, że kontrolka, którą przenosisz, do pozycji, która jest dokładnie wyrównana z drugą kontrolką.

  6. Przenieś drugą Button kontrolkę, dopóki nie zostanie umieszczona bezpośrednio nad pierwszą. Zwróć uwagę na linie przyciągania, które są wyświetlane wzdłuż lewej i prawej krawędzi obu przycisków, i zwróć uwagę, że kontrolka, którą przenosisz, przyciąga do pozycji, która jest dokładnie wyrównana do innej kontrolki.

  7. Wybierz jedną z Button kontrolek i przenieś ją blisko drugiego, aż do momentu, gdy prawie się dotknie. Zwróć uwagę na linię przyciągania, która pojawia się między nimi. Odległość ta jest zalecaną odległością między granicami kontrolek. Należy również pamiętać, że kontrolka, którą przenosisz, powoduje przeniesienie przyciągania do tej pozycji.

  8. Przeciągnij dwie Panel kontrolki z przybornika na formularz.

  9. Przenieś jedną z kontrolek, Panel dopóki nie będzie ona prawie wyrównana z pierwszym. Zwróć uwagę na linie przyciągania, które pojawiają się wzdłuż górnej i dolnej krawędzi obu kontrolek, i zwróć uwagę, że kontrolka, którą przenosisz, do pozycji, która jest dokładnie wyrównana z drugą kontrolką.

Wyrównaj do marginesów formularza i kontenera

Linie przyciągania ułatwiają wyrównanie kontrolek do marginesów formularzy i kontenerów w spójny sposób.

  1. Wybierz jedną z Button kontrolek i przenieś ją w pobliżu prawego obramowania formularza do momentu wyświetlenia linii przyciągania. Odległość linii przyciągania od prawej krawędzi jest sumą właściwości kontrolki Margin i wartości właściwości formularza Padding .

    Uwaga

    Jeśli właściwość formularza Padding jest ustawiona na 0,0,0,0, Projektant formularzy systemu Windows daje formularzowi w tle Padding wartość 9,9,9,9,9. Aby zastąpić to zachowanie, przypisz wartość inną niż 0,0,0,0.

  2. Zmień wartość Button właściwości kontrolkiMargin, rozwijając wpis w oknie Właściwości i ustawiając MarginAll właściwość na 0. Aby uzyskać szczegółowe informacje, zobacz Przewodnik: układanie kontrolek formularzy systemu Windows z wypełnieniem, marginesami i właściwością AutoSize.

  3. Przenieś kontrolkę Button w pobliżu prawego obramowania formularza do momentu wyświetlenia linii przyciągania. Ta odległość jest teraz podana przez wartość właściwości formularza Padding .

  4. Przeciągnij kontrolkę GroupBox z przybornika na formularz.

  5. Zmień wartość GroupBox właściwości kontrolkiPadding, rozwijając wpis w oknie Właściwości i ustawiając PaddingAll właściwość na 10.

  6. Przeciągnij kontrolkę Button z przybornika do kontrolki GroupBox .

  7. Przenieś kontrolkę Button w pobliżu prawego obramowania kontrolki GroupBox do momentu wyświetlenia linii przyciągania. Przenieś kontrolkę Button w kontrolce GroupBox i zanotuj, gdzie są wyświetlane linie przyciągania.

Wyrównaj do grupowanych kontrolek

Linie przyciągania umożliwiają wyrównanie grupowanych kontrolek oraz kontrolek w kontrolce GroupBox .

  1. Wybierz dwie kontrolki w formularzu. Przenieś zaznaczenie i zanotuj linie przyciągania, które pojawiają się między wyborem a innymi kontrolkami.

  2. Przeciągnij kontrolkę GroupBox z przybornika na formularz.

  3. Przeciągnij kontrolkę Button z przybornika do kontrolki GroupBox .

  4. Wybierz jedną z Button kontrolek i przenieś ją wokół kontrolki GroupBox . Zwróć uwagę na linie przyciągania, które są wyświetlane na krawędziach kontrolki GroupBox . Zwróć również uwagę na linie przyciągania, które pojawiają się na krawędziach Button kontrolki, która jest zawarta w kontrolce GroupBox . Kontrolki będące elementami podrzędnych kontrolki kontenera obsługują również linie przyciągania.

Użyj linii przyciągania, aby umieścić kontrolkę, określając jej rozmiar

  1. W przyborniku kliknij ikonę kontrolkiButton. Nie przeciągaj go na formularz.

  2. Przesuń wskaźnik myszy na powierzchni projektowej formularza. Zwróć uwagę, że wskaźnik zmienia się na krzyżyk z dołączoną ikoną kontrolki Button . Zwróć również uwagę na linie przyciągania, które wydają się sugerować wyrównane pozycje dla kontrolki Button .

  3. Kliknij i przytrzymaj przycisk myszy.

  4. Przeciągnij wskaźnik myszy wokół formularza. Zwróć uwagę, że narysowany jest kontur wskazujący położenie i rozmiar kontrolki.

  5. Przeciągnij wskaźnik do momentu wyrównania do innej kontrolki w formularzu. Należy pamiętać, że linia przyciągania wydaje się wskazywać wyrównanie.

  6. Zwolnij przycisk myszy. Kontrolka jest tworzona na pozycji i rozmiarze wskazanym przez konspekt.

Używanie linii przyciągania podczas przeciągania kontrolki z przybornika

  1. Przeciągnij kontrolkę Button z Przybornika na formularz, ale nie zwalniaj przycisku myszy.

  2. Przesuń wskaźnik myszy na powierzchni projektowej formularza. Zwróć uwagę, że wskaźnik zmienia się, aby wskazać położenie, w którym zostanie utworzona nowa Button kontrolka.

  3. Przeciągnij wskaźnik myszy wokół formularza. Zwróć uwagę na linie przyciągania, które wydają się sugerować wyrównane pozycje dla kontrolki Button . Znajdź pozycję wyrównaną do innych kontrolek.

  4. Zwolnij przycisk myszy. Kontrolka jest tworzona na pozycji wskazanej przez linie przyciągania.

Zmienianie rozmiaru kontrolki przy użyciu linii przyciągania

  1. Przeciągnij kontrolkę Button z przybornika na formularz.

  2. Zmień rozmiar kontrolki Button , chwytając jeden z uchwytów ustalania rozmiaru rogu i przeciągając go. Aby uzyskać szczegółowe informacje, zobacz How to: Resize Controls on Windows Forms (Instrukcje: zmienianie rozmiaru kontrolek w formularzach systemu Windows).

  3. Przeciągnij uchwyt określania rozmiaru do momentu wyrównania jednego Button z obramowań kontrolki do innej kontrolki. Zwróć uwagę, że zostanie wyświetlona linia przyciągania. Należy również pamiętać, że uchwyt ustalania rozmiaru przyciąga do pozycji wskazanej przez linię przyciągania.

  4. Zmień rozmiar kontrolki Button w różnych kierunkach i wyrównaj uchwyt rozmiaru do różnych kontrolek. Zwróć uwagę, jak linie przyciągania są wyświetlane w różnych orientacjach, aby wskazać wyrównanie.

Wyrównanie etykiety do tekstu kontrolki

  1. Przeciągnij kontrolkę TextBox z przybornika na formularz. Po upuszczaniu kontrolki TextBox na formularzu kliknij glyph tagu inteligentnego i wybierz opcję Ustaw tekst na textBox1 . Aby uzyskać szczegółowe informacje, zobacz Przewodnik: wykonywanie typowych zadań przy użyciu akcji projektanta.

  2. Przeciągnij kontrolkę Label z przybornika na formularz.

  3. Zmień wartość Label właściwości kontrolki AutoSize na true. Należy pamiętać, że obramowania kontrolki są dostosowywane tak, aby pasowały do tekstu wyświetlanego.

  4. Przenieś kontrolkę Label z lewej strony kontrolki TextBox , aby była wyrównana do dolnej krawędzi kontrolki TextBox . Zwróć uwagę na linię przyciągania, która jest wyświetlana wzdłuż dolnych krawędzi dwóch kontrolek.

  5. Przesuń kontrolkę Label nieco w górę, aż Label tekst i TextBox tekst zostaną wyrównane. Zwróć uwagę na inaczej stylizowany wiersz przyciągania wskazujący, kiedy pola tekstowe obu kontrolek są wyrównane.

Używanie linii przyciągania z nawigacją za pomocą klawiatury

  1. Przeciągnij kontrolkę Button z przybornika na formularz. Umieść go w lewym górnym rogu formularza.

  2. Naciśnij klawisze Ctrl+strzałka w dół. Należy pamiętać, że kontrolka przenosi formularz w dół do pierwszej dostępnej pozycji wyrównania w poziomie.

  3. Naciśnij strzałkę Ctrl+w dół, aż kontrolka osiągnie dolną część formularza. Zwróć uwagę na pozycje, które zajmuje, gdy przesuwa się w dół formularza.

  4. Naciśnij klawisze Ctrl+strzałka w prawo. Należy pamiętać, że kontrolka przechodzi przez formularz do pierwszej dostępnej pozycji wyrównania w pionie.

  5. Naciśnij klawisze Ctrl+strzałkę w prawo, aż kontrolka osiągnie bok formularza. Zwróć uwagę na pozycje, które zajmuje w miarę poruszania się po formularzu.

  6. Przenieś kontrolkę wokół formularza za pomocą kombinacji klawiszy strzałek. Zwróć uwagę na pozycje zajmowane przez kontrolkę i linie przyciągania, które im towarzyszą.

  7. Naciśnij klawisze strzałek Shift+, aby zmienić rozmiar kontrolki Button przez przyrosty jednego piksela.

  8. Naciśnij klawisze strzałek Ctrl+Shift+, aby zmienić rozmiar kontrolki Button w przyrostach linii przyciągania.

Selektywne wyłączanie linii przyciągania

  1. Przeciągnij kontrolkę TableLayoutPanel z przybornika na formularz.

  2. Kliknij dwukrotnie ikonę kontrolki Button w przyborniku. Pamiętaj, że nowa kontrolka przycisku jest wyświetlana w TableLayoutPanel pierwszej komórce kontrolki.

  3. Kliknij dwukrotnie ikonę kontrolki Button w przyborniku dwa razy więcej. Pozostawia to jedną pustą komórkę w kontrolce TableLayoutPanel .

  4. Przeciągnij kontrolkę z Przybornika do pustej komórki kontrolkiTableLayoutPanel.Button Pamiętaj, że nie są wyświetlane linie przyciągania.

  5. Przeciągnij kontrolkę Button poza kontrolkę TableLayoutPanel i przenieś ją wokół kontrolki TableLayoutPanel . Należy pamiętać, że linie przyciągania są ponownie wyświetlane.

Wyłączanie linii przyciągania

Naciśnij klawisz Alt i podczas przenoszenia kontrolki wokół formularza.

Nie są wyświetlane linie przyciągania, a kontrolka nie przyciąga do żadnych potencjalnych pozycji wyrównania.

Aby wyłączyć linie przyciągania w środowisku projektowym

  1. W menu Narzędzia otwórz okno dialogowe Opcje. Wybierz pozycję Windows Forms Projektant.

  2. Wybierz węzeł Ogólne. W sekcji Tryb układu zmień wybór z SnapLines na SnapToGrid.

  3. Wybierz przycisk OK , aby zastosować ustawienie.

  4. Wybierz kontrolkę w formularzu i przenieś ją wokół innych kontrolek. Należy pamiętać, że linie przyciągania nie są wyświetlane.

Następne kroki

Linie przyciągania oferują intuicyjne środki wyrównywania kontrolek w formularzu. Sugestie dotyczące większej liczby eksploracji obejmują:

  • Spróbuj zagnieżdżać kontrolkę GroupBox w innej GroupBox kontrolce. Umieść kontrolkę Button w kontrolce podrzędnej GroupBox i inną w kontrolce nadrzędnej GroupBox . Przenieś kontrolki, Button aby zobaczyć, jak linie przyciągania przekraczają granice kontenera.

  • Utwórz kolumnę TextBox kontrolek i odpowiednią kolumnę Label kontrolek. Ustaw wartość Label właściwości kontrolek AutoSize na true. Użyj linii przyciągania, aby przenieść kontrolki Label , aby ich wyświetlany tekst był wyrównany do tekstu w kontrolkach TextBox .

Zobacz też