Поделиться через

Пошаговое руководство. Упорядочение содержимого WPF для формы Windows Forms во время разработки

  • Статья

В этой статье показано, как использовать функции макета Windows Forms, такие как привязка и линии привязки, для размещения элементов управления Windows Presentation Foundation (WPF).

Необходимые компоненты

Для выполнения шагов, описанных в этом руководстве, вам понадобится Visual Studio.

Создание проекта

Откройте Visual Studio и создайте на Visual Basic или Visual C# проект приложения Windows Forms с именем ArrangeElementHost.

Примечание.

При размещении содержимого WPF поддерживаются только проекты C# и Visual Basic.

Создание элемента управления WPF

После добавления в проект элемента управления WPF можно разместить его в форме.

  1. Добавьте в проект новый элемент управления WPF UserControl. Используйте имя по умолчанию для этого типа элемента управления (UserControl1.xaml). Дополнительные сведения см. в разделе Пошаговое руководство. Создание содержимого WPF для формы Windows Forms во время разработки.

  2. Убедитесь в том, что элемент UserControl1 выбран в представлении конструирования.

  3. В окне Свойства присвойте свойствам Width и Height значение 200.

  4. Присвойте свойству Background значение Blue (синий).

  5. Выполните сборку проекта.

Размещение элементов управления WPF на панели макета

Элементы управления WPF можно использовать на панели макета так же, как и другие элементы управления Windows Forms.

  1. Откройте Form1 в конструкторе Windows Forms.

  2. Перетащите элемент управления TableLayoutPanel с панели элементов на форму.

  3. На панели смарт-тегов элемента управления TableLayoutPanel выберите Удалить последнюю строку.

  4. Увеличьте высоту и ширину элемента управления TableLayoutPanel.

  5. На панели элементов дважды щелкните UserControl1, чтобы создать экземпляр UserControl1 в первой ячейке элемента управления TableLayoutPanel.

    Экземпляр UserControl1 разместится в новом элементе управления ElementHost с именем elementHost1.

  6. На панели элементов дважды щелкните UserControl1, чтобы создать во второй ячейке еще один экземпляр элемента управления TableLayoutPanel.

  7. В окне Структура документа выберите tableLayoutPanel1.

  8. В окне Свойства присвойте свойству Padding значение 10, 10, 10, 10.

    Размер обоих элементов управления ElementHost изменится в соответствии с новой структурой.

Использование линий привязки для выравнивания элементов управления WPF

Линии привязки позволяют легко выравнивать элементы управления в форме. Линии привязки также можно использовать для выравнивания элементов управления WPF. Подробнее см. в разделе Пример. Упорядочение элементов управления в формах Windows Forms с помощью линий привязки.

  1. С панели элементов перетащите экземпляр UserControl1 на форму и поместите его под элементом управления TableLayoutPanel.

    Экземпляр UserControl1 разместится в новом элементе управления ElementHost с именем elementHost3.

  2. С помощью линий привязки выровняйте левый край elementHost3 относительно левого края элемента управления TableLayoutPanel.

  3. С помощью линий привязки установите для elementHost3 ту же ширину, что и для элемента управления TableLayoutPanel.

  4. Перемещайте elementHost3 в сторону элемента управления TableLayoutPanel до тех пор, пока между элементами управления не появится центральная линия привязки.

  5. В окне Свойства присвойте свойству Margin значение 20, 20, 20, 20.

  6. Перемещайте elementHost3 от элемента управления TableLayoutPanel до тех пор, пока между элементами управления снова не появится центральная линия привязки. Теперь центральная линия привязки указывает на поле шириной в 20 точек.

  7. Перемещайте элемент управления elementHost3 вправо до тех пор, пока его левый край не будет выровнен относительно левого края элемента управления elementHost1.

  8. Изменяйте ширину элемента elementHost3 до тех пор, пока его правый край не будет выровнен относительно правого края элемента управления elementHost2.

Привязка и закрепление элементов управления WPF

Поведение размещенного в форме элемента управления WPF при привязке и закреплении не отличается от поведения других элементов управления Windows Forms.

  1. Выберите elementHost1.

  2. В окне Свойства задайте для свойства Anchor значение Top, Bottom, Left, Right.

  3. Увеличьте размер элемента управления TableLayoutPanel.

    Элемент управления elementHost1 заполнит всю ячейку.

  4. Выберите elementHost2.

  5. В окне Свойства задайте свойству Dock значение Fill.

    Элемент управления elementHost2 заполнит всю ячейку.

  6. Выберите элемент управления TableLayoutPanel.

  7. Задайте для его свойства Dock значение Top.

  8. Выберите elementHost3.

  9. Задайте для его свойства Dock значение Fill.

    Элемент управления elementHost3 заполнит все оставшееся пространство в форме.

  10. Измените размер формы.

    Размер всех трех элементов управления ElementHost изменится соответствующим образом.

    Дополнительные сведения см. в статье Практическое руководство. Привязка и закрепление дочерних элементов управления в элементе управления TableLayoutPanel.

См. также