Создание первого приложения Xamarin.FormsBuild your first Xamarin.Forms App

Просмотрите это видео и следуйте инструкциям, чтобы создать свое первое приложение для мобильных устройств с помощью Xamarin.Forms.Watch this video and follow along to create your first mobile app with Xamarin.Forms.

Пошаговые инструкции для WindowsStep-by-step instructions for Windows

Загрузить образец загрузить примерDownload Sample Download the sample

Выполните следующие действия, как показано в видео.Follow these steps along with the video above:

  1. Выберите Файл > Создать > Проект... или нажмите кнопку Создать проект... :Choose File > New > Project... or press the Create new project... button:

    Создание проектаCreate a new project

  2. Выполните поиск по слову "Xamarin" или выберите Мобильный в меню Тип проекта.Search for "Xamarin" or choose Mobile from the Project type menu. Выберите тип проекта Мобильное приложение (Xamarin.Forms) :Select the Mobile App (Xamarin.Forms) project type:

    Фильтр для проектов XamarinFilter for Xamarin projects

  3. Выберите имя проекта – в примере используется "AwesomeApp":Choose a project name – the example uses "AwesomeApp":

    Выбор имени проектаChoose a project name

  4. Щелкните тип проекта Пустой и убедитесь, что выбраны параметры Android и iOS:Click on the Blank project type and ensure Android and iOS are selected:

    Android и iOS с .NET StandardAndroid and iOS, with .NET Standard

  5. Подождите, пока восстанавливаются пакеты NuGet (в строке состояния появится сообщение "Восстановление завершено").Wait until the NuGet packages are restored (a "Restore completed" message will appear in the status bar).

  6. Новые установки Visual Studio 2019 не содержат настроенный эмулятор Android.New Visual Studio 2019 installations won't have an Android emulator configured. Щелкните стрелку раскрывающегося списка на кнопке Отладка и выберите Создать Android Emulator, чтобы открыть экран создания эмулятора:Click the dropdown arrow on the Debug button and choose Create Android Emulator to launch the emulator creation screen:

    Раскрывающийся список "Создать Android Emulator"

  7. На экране создания эмулятора используйте параметры по умолчанию и нажмите кнопку Создать:In the emulator creation screen, use the default settings and click the Create button:

    Экран создания эмулятора AndroidAndroid emulator creation screen

  8. После создания снова открывается окно диспетчера устройств.Creating an emulator will return you to the Device Manager window. Нажмите кнопку Запустить, чтобы запустить новый эмулятор:Click the Start button to launch the new emulator:

    Эмулятор Android в диспетчере устройств

  9. Теперь система Visual Studio 2019 должна выводить имя нового эмулятора на кнопке Отладка:Visual Studio 2019 should now show the name of the new emulator on the Debug button:

    Имя эмулятора Android на кнопке "Отладка"

  10. Нажмите кнопку Отладка, чтобы создать и развернуть приложение в эмуляторе Android:Click the Debug button to build and deploy the application to the Android emulator:

    Эмулятор Android, отображающий приложение

Настройка приложенияCustomize the application

Приложение можно настроить для добавления интерактивных функций.The application can be customized to add interactive functionality. Чтобы добавить взаимодействие с пользователем в приложение, выполните следующие действия:Perform the following steps to add user interaction to the application:

  1. Измените MainPage.xaml, добавив этот XAML до конца </StackLayout>:Edit MainPage.xaml, adding this XAML before the end of the </StackLayout>:

    <Button Text="Click Me" Clicked="Button_Clicked" />
    
  2. Измените MainPage.xaml, добавив этот код до конца класса:Edit MainPage.xaml.cs, adding this code to the end of the class:

    int count = 0;
    void Button_Clicked(object sender, System.EventArgs e)
    {
        count++;
        ((Button)sender).Text = $"You clicked {count} times.";
    }
    
  3. Отладка приложения на Android:Debug the app on Android:

    Приложение Android

Примечание

Пример приложения включает дополнительные интерактивные функции, которые не рассматриваются в этом видео.The sample application includes the additional interactive functionality that is not covered in the video.

Создание приложения iOS в Visual Studio 2019Build an iOS app in Visual Studio 2019

Можно создавать и отлаживать приложения iOS из Visual Studio с помощью компьютера Mac, подключенного к сети.It's possible to build and debug the iOS app from Visual Studio with a networked Mac computer. Дополнительные сведения см. в инструкциях по установке.Refer to the setup instructions for more information.

В этом видео рассматривается процесс сборки и тестирования приложения iOS с помощью Visual Studio 2019 в Windows:This video covers the process of building and testing an iOS app using Visual Studio 2019 on Windows:

Пошаговые инструкции для WindowsStep-by-step instructions for Windows

Загрузить образец загрузить примерDownload Sample Download the sample

Выполните следующие действия, как показано в видео.Follow these steps along with the video above:

  1. Выберите Файл > Создать > Проект... или нажмите кнопку Создать проект... , а затем выберите Visual C# > Кроссплатформенные > Мобильное приложение (Xamarin.Forms) :Choose File > New > Project... or press the Create new project... button, then select Visual C# > Cross-Platform > Mobile App (Xamarin.Forms):

    Мобильное приложение (Xamarin.Forms)Mobile App (Xamarin.Forms)

  2. Убедитесь, что выбраны Android и iOS с совместным использованием кода .NET Standard:Ensure Android and iOS are selected, with .NET Standard code sharing:

    Android и iOS с .NET StandardAndroid and iOS, with .NET Standard

  3. Подождите, пока восстанавливаются пакеты NuGet (в строке состояния появится сообщение "Восстановление завершено").Wait until the NuGet packages are restored (a "Restore completed" message will appear in the status bar).

  4. Запустите эмулятор Android, нажав кнопку отладки (или пункт меню Отладка > Начать отладку).Launch Android emulator by pressing the debug button (or the Debug > Start Debugging menu item).

  5. Измените MainPage.xaml, добавив этот XAML до конца </StackLayout>:Edit MainPage.xaml, adding this XAML before the end of the </StackLayout>:

    <Button Text="Click Me" Clicked="Button_Clicked" />
    
  6. Измените MainPage.xaml, добавив этот код до конца класса:Edit MainPage.xaml.cs, adding this code to the end of the class:

    int count = 0;
    void Button_Clicked(object sender, System.EventArgs e)
    {
        count++;
        ((Button)sender).Text = $"You clicked {count} times.";
    }
    
  7. Отладка приложения на Android:Debug the app on Android:

    Приложение Android

    Совет

    Можно создавать и отлаживать приложения iOS из Visual Studio с компьютером Mac, подключенным к сети.It is possible to build and debug the iOS app from Visual Studio with a networked Mac computer. Дополнительные сведения см. в инструкциях по установке.Refer to the setup instructions for more information.

Пошаговые инструкции для MacStep-by-step instructions for Mac

Загрузить образец загрузить примерDownload Sample Download the sample

Выполните следующие действия, как показано в видео.Follow these steps along with the video above:

  1. Выберите Файл > Создать решение... или нажмите кнопку Создать проект... и выберите Многоплатформенность > Приложение > Приложение с пустыми формами:Choose File > New Solution... or press the New Project... button, then select Multiplatform > App > Blank Forms App:

    Приложение с пустыми формамиBlank Forms App

  2. Убедитесь, что выбраны Android и iOS с совместным использованием кода .NET Standard:Ensure Android and iOS are selected, with .NET Standard code sharing:

    Android и iOS с .NET StandardAndroid and iOS, with .NET Standard

  3. Восстановите пакеты NuGet, щелкнув правой кнопкой решение:Restore NuGet packages, by right-clicking on the solution:

    Приложение Android

  4. Запустите эмулятор Android, нажав кнопку отладки (или Запуск > Начать отладку).Launch Android emulator by pressing the debug button (or Run > Start Debugging).

  5. Измените MainPage.xaml, добавив этот XAML до конца </StackLayout>:Edit MainPage.xaml, adding this XAML before the end of the </StackLayout>:

    <Button Text="Click Me" Clicked="Handle_Clicked" />
    
  6. Измените MainPage.xaml, добавив этот код до конца класса:Edit MainPage.xaml.cs, adding this code to the end of the class:

    int count = 0;
    void Handle_Clicked(object sender, System.EventArgs e)
    {
        count++;
        ((Button)sender).Text = $"You clicked {count} times.";
    }
    
  7. Отладка приложения на Android:Debug the app on Android:

    Приложение Android

  8. Щелкните правой кнопкой мыши, чтобы настроить iOS на Запускаемый проект:Right-click to set iOS to the Startup Project:

    Задание запускаемого проекта в iOSSet the startup project to iOS

  9. Отладка приложения в iOS:Debug the app on iOS:

    Приложение iOS

Загрузите полный код из коллекции примеров или просмотрите его на GitHub.You can download the completed code from the samples gallery or view it on GitHub.

Следующие шагиNext Steps