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

Руководство. Создание приложения WPF с помощью Visual Basic

В этом руководстве вы создадите приложение с помощью Visual Basic в интегрированной среде разработки Visual Studio (IDE). Программа будет использовать платформу пользовательского интерфейса Windows Presentation Foundation (WPF). Используйте это руководство, чтобы ознакомиться со многими инструментами, диалогами и конструкторами, которые можно использовать в Visual Studio.

В этом руководстве вы узнаете, как:

  • Создание проекта
  • Настройка окна и добавление текста
  • Добавление кнопок и кода
  • Отладка и тестирование приложения
  • Отладка с точками останова
  • Сборка релизной версии

Что такое WPF?

WPF или Windows Presentation Foundation — это платформа пользовательского интерфейса (пользовательского интерфейса), которая создает клиентские приложения для настольных компьютеров. Платформа разработки WPF поддерживает широкий набор функций разработки приложений, включая модель приложения, ресурсы, элементы управления, графику, макет, привязку данных, документы и безопасность.

WPF является частью .NET, поэтому если вы ранее создали приложения с помощью .NET с помощью ASP.NET или Windows Forms, интерфейс программирования должен быть знаком. WPF использует XAML расширяемого языка разметки приложений для предоставления декларативной модели программирования приложений. Дополнительные сведения см. в обзоре WPF .NET.

Предпосылки

Для работы с этим руководством вам потребуется Visual Studio. Посетите страницу загрузки Visual Studio, чтобы скачать бесплатную версию.

Для работы с этим руководством вам потребуется Visual Studio. Посетите страницу загрузки Visual Studio, чтобы скачать бесплатную версию.

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

При создании приложения в Visual Studio сначала создается проект. В этом руководстве создайте проект Windows Presentation Foundation.

  1. Откройте Visual Studio.

  2. На экране "Создание проекта" найдите "WPF" и выберите приложение WPF (.NET Framework). Нажмите кнопку Далее.

    Снимок экрана диалогового окна

  3. Присвойте проекту имя, HelloWPFApp и нажмите кнопку "Создать".

    Visual Studio создает проект и решение HelloWPFApp. Обозреватель решений отображает различные файлы.

    Снимок экрана показывает обозреватель решений с файлами приложения Hello WPF App.

Конструктор WPF отображает представление конструктора и представление XAML MainWindow.xaml в разделенном представлении.

  1. Откройте Visual Studio.

  2. В окне запуска выберите Создать проект.

    Снимок экрана: окно запуска в Visual Studio 2022 с выделенным параметром

  3. В окне создания проекта найдите "WPF" и выберите Visual Basic в раскрывающемся списке "Все языки ". Выберите приложение WPF (.NET Framework) и нажмите кнопку "Далее".

    Снимок экрана: диалоговое окно

  4. Присвойте проекту имя, HelloWPFApp и нажмите кнопку "Создать".

    Visual Studio создает проект и решение HelloWPFApp. Обозреватель решений отображает различные файлы.

    Снимок экрана, показывающий файлы в проекте и решении HelloWPFApp в обозревателе решений.

Конструктор WPF отображает представление конструктора и представление XAML MainWindow.xaml в разделенном представлении.

Замечание

Дополнительные сведения о языке разметки приложений eXtensible (XAML) см. в обзоре XAML для WPF.

Настройка окна и добавление текста

С помощью окна "Свойства" можно отображать и изменять параметры элементов проекта, элементов управления и других элементов.

  1. В обозревателе решений откройте файл MainWindow.xaml.

  2. В представлении XAML измените значение свойства Window.Title с Title="MainWindow" на Title="Greetings".

  3. В левой части интегрированной среды разработки Visual Studio выберите вкладку 'Панель элементов'. Если вы этого не видите, выберите Вид>'Панель элементов' в строке меню или Ctrl+Alt+X.

  4. Разверните общие элементы управления WPF или введите текст в строке поиска, чтобы найти TextBlock.

    Снимок экрана: окно панели элементов с элементом управления TextBlock, выделенным в списке общих элементов управления WPF.

  5. Выберите элемент TextBlock и перетащите его в окно в области конструктора. Элемент управления TextBlock можно переместить, перетащив его. Используйте рекомендации для размещения элемента управления.

    Снимок экрана: элемент управления TextBlock, расположенный в форме приветствия с видимыми рекомендациями.

    Разметка XAML должна выглядеть следующим образом:

    <TextBlock HorizontalAlignment="Left" Margin="381,100,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/>

  6. В представлении XAML найдите разметку для TextBlock и измените атрибут Text:

    Text="Select a message option and then choose the Display button."

    Центрируйте ТекстБлок снова, если необходимо

  7. Сохраните приложение, нажав кнопку "Сохранить все ". Кроме того, чтобы сохранить приложение, выберите "Сохранить все"> в строке меню или нажмите клавиши CTRL++. Рекомендуется сохранять данные часто и с самого начала.

Добавление кнопок и кода

Приложение использует два переключателя и кнопку. Чтобы добавить их, выполните следующие действия. Вы добавите код Visual Basic в кнопку. Этот код ссылается на выбор радиокнопки.

  1. На панели элементов найдите RadioButton.

    Снимок экрана: окно панели элементов с элементом управления RadioButton, выбранным в списке общих элементов управления WPF.

  2. Добавьте два элемента управления RadioButton в область конструктора, выбрав элемент RadioButton и перетащив его в область конструктора. Переместите кнопки, выбрав их и используя клавиши со стрелками. Поместите кнопки рядом с элементом управления TextBlock.

    Снимок экрана: форма приветствия с элементом управления TextBlock и двумя переключателями.

  3. В окне "Свойства " левого элемента управления RadioButton измените свойство Name в верхней части окна "Свойства " на HelloButton.

    Снимок экрана, показывающий окно свойств Обозревателя решений для «HelloButton» RadioButton.

  4. В окне "Свойства " правого элемента управления RadioButton измените свойство Name на GoodbyeButton.

  5. Обновите атрибут Content для HelloButton и GoodbyeButton на "Hello" и "Goodbye" в XAML.

    <Grid>
     <TextBlock HorizontalAlignment="Left" Margin="252,47,0,0" TextWrapping="Wrap" Text="Select a message option and then choose the Display button." VerticalAlignment="Top"/>
     <RadioButton x:Name="HelloButton" Content="Hello" HorizontalAlignment="Left" Margin="297,161,0,0" VerticalAlignment="Top"/>
     <RadioButton x:Name="GoodbyeButton" Content="Goodbye" HorizontalAlignment="Left" Margin="488,161,0,0" VerticalAlignment="Top"/>
</Grid>

  6. В представлении XAML найдите разметку для HelloButton и добавьте атрибут IsChecked :

    IsChecked="True"

    Атрибут IsChecked со значением True означает, что HelloButton по умолчанию проверяется. Этот параметр означает, что радиокнопка всегда выбрана, даже при запуске программы.

  7. На панели инструментов найдите элемент управления Button и перетащите кнопку в область конструктора под элементами управления «RadioButton».

  8. В представлении XAML измените значение Content для элемента управления Button с Content="Button" на Content="Display".

    <Button Content="Display" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="215,204,0,0"/>

    Окно должно выглядеть следующим образом.

    Снимок экрана, показывающий форму приветствия с текстовым блоком, переключателями с метками

  9. В области конструктора дважды щелкните кнопку Отображение.

    MainWindow.xaml.vb открывается, помещая курсор в событие Button_Click.

    Private Sub Button_Click(sender As Object, e As RoutedEventArgs)

End Sub

  10. Добавьте следующий код:

    If HelloButton.IsChecked = True Then
    MessageBox.Show("Hello.")
ElseIf GoodbyeButton.IsChecked = True Then
    MessageBox.Show("Goodbye.")
End If

Отладка и тестирование приложения

Затем вы отладите приложение, чтобы найти ошибки и проверить правильное представление обоих полей сообщений. Чтобы узнать, как работает этот процесс, первый шаг намеренно вводит ошибку в программу.

  1. В обозревателе решений щелкните правой кнопкой мыши файл MainWindow.xaml и выберите "Переименовать". Переименуйте файл в Greetings.xaml.

  2. Запустите отладчик, нажав клавишу F5 или выбрав отладку, а затем запустите отладку.

    Откроется окно режима останова , а окно вывода указывает на то, что произошло исключение.

    Снимок экрана показывает окно

    Снимок экрана показывает окно

  3. Остановите отладчик, выбрав Отладка>Остановить отладку.

    В начале этого раздела вы переименовали MainWindow.xaml в Greetings.xaml . Код по-прежнему относится к MainWindow.xaml как URI запуска приложения, поэтому проект не может запуститься.

  4. В обозревателе решений откройте файл Application.xaml .

  5. Измените на StartupUri="MainWindow.xaml"StartupUri="Greetings.xaml"

  6. Запустите отладчик еще раз (нажмите клавишу F5). Теперь вы должны увидеть окно Приветствие вашего приложения.

    Снимок экрана окна приветствия с видимыми элементами управления TextBlock, RadioButtons и Button. Выбрана радиокнопка

    Снимок экрана: окно приветствия с видимыми элементами управления TextBlock, RadioButtons и Button. Выбрана радиокнопка

  7. Выберите Hello и кнопку Отобразить, а затем Goodbye и кнопку Отобразить. Чтобы остановить отладку, используйте значок закрытия в правом верхнем углу.

Дополнительные сведения см. в разделе Сборка приложения WPF (WPF) и Отладка приложения WPF.

Отладка с точками останова

Вы можете протестировать код во время отладки, добавив некоторые точки останова.

  1. Откройте Greetings.xaml.vb и выберите следующую строку: MessageBox.Show("Hello.")

  2. Добавьте точку останова, нажав клавишу F9 или выбрав отладку, а затем переключив точку останова.

    Красный круг отображается рядом со строкой кода в левом поле окна редактора.

  3. Выберите следующую строку: MessageBox.Show("Goodbye.")

  4. Нажмите клавишу F9 , чтобы добавить точку останова, а затем нажмите клавишу F5 , чтобы начать отладку.

  5. В окне приветствия нажмите кнопку "Hello " и нажмите кнопку "Отобразить".

    Строка MessageBox.Show("Hello.") выделена желтым цветом. В нижней части интегрированной среды разработки окна "Авто", "Локальные" и "Наблюдение" закреплены вместе слева. стека вызовов, точек останова, параметров исключений, команд, немедленнойи окна выходных закреплены справа.

    Снимок экрана, показывающий сеанс отладки в Visual Studio с открытыми окнами Код, Диагностика, Авто и Стек вызовов. Выполнение остановлено в точке останова в Greetings.xaml.vb.

  6. В строке меню выберите Отладка>Step Out.

    Приложение запускается снова. Откроется диалоговое окно со словом "Hello".

  7. Нажмите кнопку ОК, чтобы закрыть диалоговое окно.

  8. В окне приветствия выберите переключатель прощание, а затем нажмите кнопку отображения.

    Строка MessageBox.Show("Goodbye.") выделена желтым цветом.

  9. Выберите ключ F5, чтобы продолжить отладку. Когда появится диалоговое окно, нажмите кнопку "ОК ", чтобы закрыть диалоговое окно.

  10. Закройте окно приложения, чтобы остановить отладку.

  11. В строке меню выберите Отладка>Отключить все точки останова.

Сборка релизной версии

Теперь, когда вы убедились, что всё работает, можно подготовить релизную сборку приложения.

  1. Выберите Сборка>Очистить решение, чтобы удалить промежуточные файлы и выходные файлы, созданные во время предыдущих сборок.

  2. Измените конфигурацию сборки для HelloWPFApp с Debug на Release, используя выпадающий список на панели инструментов.

  3. Выберите Сборка>Собрать решение.

Поздравляем с завершением работы с этим руководством! Вы можете найти .exe, который вы построили, в каталоге вашего решения и проекта (...\HelloWPFApp\bin\Release).

Дальнейшие шаги

Перейдите к следующей статье, чтобы узнать, как создать приложение Windows Forms в Visual Studio с помощью Visual Basic.

Создание приложения Windows Forms

Дополнительные сведения о Visual Studio см. в следующих ресурсах:

  • Last updated on