深入Xamarin.Forms

在Xamarin.Forms快速入门中，构建了Phoneword应用程序。 本文回顾了为了了解XAMarin.Forms应用程序的基础知识而建立的内容。

以下主题被提及：

• Visual Studio简介 - Visual Studio简介，并创建一个新的Xamarin.Forms应用程序。
  

• Xamarin.Forms应用程序的解剖学 - Xamarin.Forms应用程序的基本部分的游览。
• 架构与应用基础知识 - 如何在每个平台上启动应用程序。
• 用户界面（UI） - 在Xamarin.Forms中创建用户界面。
• 在Phoneword中引入的其他概念 - Phoneword应用程序中使用的其他概念的简要说明。
• 测试和部署 - 使用关于测试，部署，生成图稿等的建议来完成应用程序。

Visual Studio简介

Visual Studio是微软强大的IDE。 它具有完全集成的视觉设计师，一个包含重构工具的文本编辑器，汇编浏览器，源代码集成等。 本文重点介绍使用Xamarin插件的一些基本的Visual Studio功能。

Visual Studio将代码整合到解决方案和项目中。 解决方案是一个容纳一个或多个项目的容器。 项目可以是应用程序，支持库，测试应用程序等。 Phoneword应用程序包含一个包含六个项目的解决方案，如以下屏幕截图所示。

项目有：

• Phoneword – 该项目是可移植类库（PCL）项目，其中包含所有共享代码和共享UI。
• Phoneword.Droid – 该项目拥有Android特定代码，是Android应用程序的入门点。
• Phoneword.iOS – 该项目拥有iOS专用代码，是iOS应用程序的入门点。
• Phoneword.UWP – 该项目拥有通用Windows平台（UWP）特定代码，是UWP应用程序的入门点。
• Phoneword.WinPhone – 该项目持有Windows Phone特定代码，是Windows Phone 8.0应用程序的入口点。
  
• Phoneword.WinPhone81 – 该项目包含Windows Phone 8.1特定代码，是Windows Phone 8.1应用程序的入口点。

Xamarin.Forms应用的解剖学

以下截图显示Visual Studio中Phoneword PCL项目的内容：

该项目由两个文件夹组成：

• 引用 – 包含构建和运行应用程序所需的程序集。
• Properties – 包含AssemblyInfo.cs，.NET程序集元数据文件。 填写此文件的一些基本信息是您的应用程序是一个很好的做法。要想了解这个文件的更多信息，可以查看MSDN中的类。

该项目还包括一些文件：

• App.xaml – App类的XAML标记，用于定义应用程序的资源字典。
• App.xaml.cs – 应用程序类的代码隐藏，负责实例化每个平台上的应用程序显示的第一个页面，以及处理应用程序生命周期事件。
• IDialer.cs – IDialer接口，它指定Dial方法必须由任何实现类提供。
• MainPage.xaml – MainPage类的XAML标记，用于定义应用程序启动时显示的页面的UI。
• MainPage.xaml.cs – MainPage类的代码隐藏，它包含用户与页面交互时执行的业务逻辑。
• packages.config – 一个XML文件，其中包含有关项目使用的NuGet包的信息，以便跟踪所需的包及其各自的版本。 Visual Studio for Mac和Visual Studio都可以配置为在与其他用户共享源代码时自动恢复任何缺少的NuGet软件包。此文件的内容由NuGet软件包管理器控制，不应手动编辑。
• PhoneTranslator.cs – 负责将电话字转换为电话号码的业务逻辑，从MainPage.xaml.cs调用。

有关Xamarin.iOS应用程序的解剖结构的更多信息，请参阅Xamarin.iOS应用程序的解剖。 有关Xamarin.Android应用程序的解剖结构的更多信息，请参阅Xamarin.Android应用程序的解剖。

架构与应用基础

Xamarin.Forms应用程序的架构与传统的跨平台应用程序相同。 共享代码通常放在便携式类库（PCL）中，平台特定的应用程序使用共享代码。 下图显示了Phoneword应用程序的这种关系的概述：

有关PCL的更多信息，请参阅便携式类库简介。

为了最大程度地重用启动代码，Xamarin.Forms应用程序有一个名为App的类，负责实例化每个平台上应用程序显示的第一页，如下面的代码示例所示：

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

[assembly: XamlCompilation(XamlCompilationOptions.Compile)]
namespace Phoneword
{
    public partial class App : Application
    {
        public App()
        {
            InitializeComponent();
            MainPage = new MainPage();
        }
        ...
    }
}

该代码将App类的MainPage属性设置为MainPage类的新实例。 此外，XamlCompilation属性打开XAML编译器，使XAML直接编译成中间语言。 有关更多信息，请参阅XAML编译。

在每个平台上启动应用程序

iOS

要在iOS中启动最初的Xamarin.Forms页面，Phoneword.iOS项目包括继承自FormsApplicationDelegate类的AppDelegate类，如以下代码示例所示：

amespace Phoneword.iOS
{
    [Register ("AppDelegate")]
    public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
    {
        public override bool FinishedLaunching (UIApplication app, NSDictionary options)
        {
            global::Xamarin.Forms.Forms.Init ();
            LoadApplication (new App ());
            return base.FinishedLaunching (app, options);
        }
    }
}

FinishedLaunching override通过调用Init方法来初始化Xamarin.Forms框架。 这将导致在通过调用LoadApplication方法设置根视图控制器之前，将Xamarin.Forms的iOS特定实现加载到应用程序中。

Android

要在Android中启动Xamarin.Forms初始化页面，Phoneword.Droid项目包括使用MainLauncher属性创建活动的代码，活动继承自FormsApplicationActivity类，如以下代码示例所示：

namespace Phoneword.Droid
{
    [Activity (Label = "Phoneword.Droid",
               Icon = "@drawable/icon",
               MainLauncher = true,
               ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)]
    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsApplicationActivity
    {
        protected override void OnCreate (Bundle bundle)
        {
            base.OnCreate (bundle);
            global::Xamarin.Forms.Forms.Init (this, bundle);
            LoadApplication (new App ());
        }
    }
}

OnCreate覆盖通过调用Init方法来初始化Xamarin.Forms框架。 这将导致在加载Xamarin.Forms应用程序之前，将Xamarin.Forms的Android特定实现加载到应用程序中。

通用Windows平台

在通用Windows平台（UWP）应用程序中，从App类调用初始化Xamarin.Forms框架的Init方法：

Xamarin.Forms.Forms.Init (e);

if (e.PreviousExecutionState == ApplicationExecutionState.Terminated)
{
  ...
}

这导致将XAMarin.Forms的UWP特定实现加载到应用程序中。 最初的Xamarin.Forms页面由MainPage类启动，如下面的代码示例所示：

namespace Phoneword.UWP
{
    public sealed partial class MainPage
    {
        public MainPage()
        {
            this.InitializeComponent();
            this.LoadApplication(new Phoneword.App());
        }
    }
}

Xamarin.Forms应用程序加载了LoadApplication方法。

用户界面

用于创建Xamarin.Forms应用程序的用户界面的四个主要控制组。

1. Pages – Xamarin.Forms页面代表跨平台移动应用程序屏幕。 Phoneword应用程序使用ContentPage类显示单个屏幕。有关页面的更多信息，请参阅Xamarin.Forms页面。
2. Layouts – Xamarin.Forms布局是用于将视图组合成逻辑结构的容器。 Phoneword应用程序使用StackLayout类在水平堆栈中排列控件。有关布局的更多信息，请参阅Xamarin.Forms布局。
3. Views – Xamarin.Forms视图是用户界面上显示的控件，如标签，按钮和文本输入框。 Phoneword应用程序使用Label，Entry和Button控件。有关视图的更多信息，请参阅Xamarin.Forms视图。
4. Cells – Xamarin.Forms单元格是用于列表中的项目的专用元素，并描述应如何绘制列表中的每个项目。 Phoneword应用程序不会使用任何单元格。有关细胞的更多信息，请参阅Xamarin.Forms Cells。

在运行时，每个控件都将被映射到其本机的等价物，这将被渲染。

当Phoneword应用程序在任何平台上运行时，它将显示与Xamarin.Forms中的页面相对应的单个屏幕。 A页面表示Android中的ViewGroup，iOS中的View Controller，或通用Windows平台上的页面。 Phoneword应用程序还实例化一个ContentPage对象，该对象表示MainPage类，其XAML标记显示在以下代码示例中：

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns=""
                         xmlns:x=""
                         x:Class="Phoneword.MainPage">
        ...
        <StackLayout>
            <Label Text="Enter a Phoneword:" />
            <Entry x:Name="phoneNumberText" Text="1-855-XAMARIN" />
            <Button x:Name="translateButon" Text="Translate" Clicked="OnTranslate" />
            <Button x:Name="callButton" Text="Call" IsEnabled="false" Clicked="OnCall" />
        </StackLayout>
</ContentPage>

MainPage类使用StackLayout控件自动排列屏幕上的控件，无论屏幕大小如何。 每个子元素按照它们被添加的顺序垂直放置。 StackLayout控件包含一个Label控件来显示页面上的文本，一个Entry控件来接受文本用户输入，另外两个Button控件用于执行代码以响应触摸事件。

有关Xamarin.Forms中的XAML的更多信息，请参阅Xamarin.Forms XAML基础知识。

响应用户交互

XAML中定义的对象可以触发在代码隐藏文件中处理的事件。 以下代码示例显示MainPage类的代码隐藏中的OnTranslate方法，该方法是在“Translate”按钮上触发Clicked事件时执行的。

void OnTranslate(object sender, EventArgs e)
{
    translatedNumber = Core.PhonewordTranslator.ToNumber (phoneNumberText.Text);
    if (!string.IsNullOrWhiteSpace (translatedNumber)) {
        callButton.IsEnabled = true;
        callButton.Text = "Call " + translatedNumber;
    } else {
        callButton.IsEnabled = false;
        callButton.Text = "Call";
    }
}

OnTranslate方法将phoneword转换为相应的电话号码，作为响应，在通话按钮上设置属性。 XAML类的代码隐藏文件可以使用分配给它的名称使用x：Name属性访问XAML中定义的对象。 分配给此属性的值与C＃变量具有相同的规则，因为它必须以字母或下划线开头，并且不包含嵌入空格。

翻译按钮到OnTranslate方法的接线发生在MainPage类的XAML标记中：

<Button x:Name="translateButon" Text="Translate" Clicked="OnTranslate" />

<Button x:Name="translateButon" Text="Translate" Clicked="OnTranslate" />

在Phoneword推出的其他概念

对于Xamarin.Forms的Phoneword应用程序介绍了本文未介绍的几个概念。 这些概念包括：

• 启用和禁用按钮。 可以通过更改其IsEnabled属性来打开或关闭按钮。 例如，以下代码示例禁用callButton：

  callButton.IsEnabled = false;

  
  

  
  

• 显示警报对话框。 当用户按下呼叫按钮时，Phoneword应用程序会显示一个警报对话框，并提供放置或取消呼叫的选项。 DisplayAlert方法用于创建对话框，如下面的代码示例所示：
  

  await this.DisplayAlert (
          "Dial a Number",
          "Would you like to call " + translatedNumber + "?",
          "Yes",
          "No");

  
  

  
  

• 通过DependencyService类访问本机特性。 Phoneword应用程序使用DependencyService类将IDialer接口解析为平台特定的电话拨号实现，如Phoneword项目的以下代码示例所示：

  async void OnCall (object sender, EventArgs e)
  {
      ...
      var dialer = DependencyService.Get<IDialer> ();
      ...
  }

  
  

  
  

  有关DependencyService类的更多信息，请参阅通过DependencyService访问本机特性。

• 使用网址拨打电话。 Phoneword应用程序使用OpenURL启动系统电话应用程序。 该URL包含一个tel：前缀，后跟要调用的电话号码，如以下iOS项目代码示例所示：
  

  return UIApplication.SharedApplication.OpenUrl (new NSUrl ("tel:" + number));

  
  

  
  

• 调整平台布局。 Device类使开发人员能够在每个平台的基础上自定义应用程序布局和功能，如以下代码示例所示，在不同平台上使用不同的Padding值来正确显示每个页面：
  

  <ContentPage xmlns=""
               ...>
      <ContentPage.Padding>
          <OnPlatform x:TypeArguments="Thickness">
              <On Platform="iOS" Value="20, 40, 20, 20" />
              <On Platform="Android, WinPhone, Windows" Value="20" />
          </OnPlatform>
      </ContentPage.Padding>
      ...
  </ContentPage>

  
  有关平台调整的更多信息，请参阅设备类。

  
  

测试和部署

Visual Studio for Mac和Visual Studio都提供了许多用于测试和部署应用程序的选项。 调试应用程序是应用程序开发生命周期的常见部分，有助于诊断代码问题。 有关详细信息，请参阅设置断点，逐步代码和输出信息到日志窗口。

模拟器是开始部署和测试应用程序的好地方，并且具有用于测试应用程序的有用功能。 然而，用户不会在模拟器中使用最终的应用程序，所以应该在早期和经常在实际设备上进行测试。 有关iOS设备配置的详细信息，请参阅设备配置。 有关Android设备配置的更多信息，请参阅设置开发设备。

概要

本文使用Xamarin.Forms来研究应用程序开发的基础知识。 涵盖的主题包括Xamarin.Forms应用程序，架构和应用程序基础知识以及用户界面的解剖。

在本指南的下一部分中，应用程序将扩展到包含多个屏幕，以便探索更高级的Xamarin.Forms体系结构和概念。