Xamarin.Forms多画面快速入门-阿里云开发者社区

Xamarin.Forms多画面快速入门

2017-10-26 956

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 该快速入门演示了如何通过添加第二个屏幕来扩展Phoneword应用程序来跟踪应用程序的通话记录。最终的应用如下所示：扩展Phoneword应用程序如下：在“开始”屏幕中，启动Visual Studio。

该快速入门演示了如何通过添加第二个屏幕来扩展Phoneword应用程序来跟踪应用程序的通话记录。最终的应用如下所示：

扩展Phoneword应用程序如下：

在“开始”屏幕中，启动Visual Studio。这将打开起始页：
在Visual Studio中，单击打开项目...，并在打开项目对话框中选择Phoneword项目的解决方案文件。或者从最近的项目列表中打开该项目：
在解决方案资源管理器中，右键单击Phoneword项目，然后选择添加>新建项...：
在Add New Item对话框中，选择Visual C＃> Cross-Platform> Forms Xaml Page，命名新的文件CallHistoryPage，然后单击Add按钮。这将为项目添加一个名为CallHistoryPage的页面：
在CallHistoryPage.xaml中，删除所有的模板代码，并将其替换为以下代码。该代码声明性地定义了页面的用户界面：
点击(此处)折叠或打开
1. ?xml version="1.0" encoding="UTF-8"?>
2. ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
3. xmlns:local="clr-namespace:Phoneword;assembly=Phoneword"
4. xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
5. x:Class="Phoneword.CallHistoryPage"
6. Title="Call History">
7. ContentPage.Padding>
8. OnPlatform x:TypeArguments="Thickness">
9. On Platform="iOS" Value="20, 40, 20, 20" />
10. On Platform="Android, WinPhone, Windows" Value="20" />
11. /OnPlatform>
12. /ContentPage.Padding>
13. StackLayout>
14. ListView ItemsSource="{x:Static local:App.PhoneNumbers}" />
15. /StackLayout>
16. /ContentPage>
按CTRL+S将更改保存到CallHistoryPage.xaml，然后关闭文件。
在解决方案资源管理器中，双击App.xaml.cs以打开它：
在App.xaml.cs中，导入System.Collections.Generic命名空间，添加PhoneNumbers属性的声明，初始化App构造函数中的属性，并将MainPage属性初始化为NavigationPage。 PhoneNumbers系列将用于存储应用程序调用的每个翻译的电话号码列表：
点击(此处)折叠或打开
1. using System.Collections.Generic;
2. using Xamarin.Forms;
3. using Xamarin.Forms.Xaml;
5. [assembly: XamlCompilation(XamlCompilationOptions.Compile)]
6. namespace Phoneword
7. {
8. public partial class App : Application
9. {
10. public static IListstring> PhoneNumbers { get; set; }
12. public App()
13. {
14. InitializeComponent();
15. PhoneNumbers = new Liststring>();
16. MainPage = new NavigationPage(new MainPage());
17. }
18. ...
19. }
20. }
通过按CTRL+S将更改保存到App.xaml.cs，并关闭文件。
在解决方案资源管理器中，双击MainPage.xaml打开它：
在MainPage.xaml中，在StackLayout控件的末尾添加一个Button控件。该按钮将用于导航到通话记录页面：
点击(此处)折叠或打开
1. StackLayout VerticalOptions="FillAndExpand"
2. HorizontalOptions="FillAndExpand"
3. Orientation="Vertical"
4. Spacing="15">
5. ...
6. Button x:Name="callButton" Text="Call" IsEnabled="false" Clicked="OnCall" />
7. Button x:Name="callHistoryButton" Text="Call History" IsEnabled="false"
8. Clicked="OnCallHistory" />
9. /StackLayout>
通过按CTRL + S将更改保存到MainPage.xaml，然后关闭文件。
在解决方案资源管理器中，双击MainPage.xaml.cs打开它：
在MainPage.xaml.cs中，添加OnCallHistory事件处理程序方法，并修改OnCall事件处理程序方法，将已翻译的电话号码添加到App.PhoneNumbers集合，并启用callHistoryButton，前提是dialer变量不为空：
点击(此处)折叠或打开
1. using System;
2. using Xamarin.Forms;
4. namespace Phoneword
5. {
6. public partial class MainPage : ContentPage
7. {
8. ...
10. async void OnCall(object sender, EventArgs e)
11. {
12. ...
13. if (dialer != null) {
14. App.PhoneNumbers.Add (translatedNumber);
15. callHistoryButton.IsEnabled = true;
16. dialer.Dial (translatedNumber);
17. }
18. ...
19. }
21. async void OnCallHistory(object sender, EventArgs e)
22. {
23. await Navigation.PushAsync (new CallHistoryPage ());
24. }
25. }
26. }
通过按CTRL + S将更改保存到MainPage.xaml.cs，然后关闭文件。
在Visual Studio中，选择Build> Build Solution菜单项（或按CTRL + SHIFT + B）。该应用程序将生成，一个成功的消息将出现在Visual Studio状态栏中：

如果有错误，请重复上述步骤并纠正任何错误，直到应用程序构建成功。
在解决方案资源管理器中，右键单击Phoneword.UWP项目，然后选择设置为启动项目：
在Visual Studio工具栏中，按开始按钮（类似于播放按钮的三角形按钮）启动应用程序：
在解决方案资源管理器中，右键单击Phoneword.Droid项目，然后选择设置为启动项目。
在Visual Studio工具栏中，按开始按钮（类似于播放按钮的三角形按钮）在Android模拟器中启动应用程序。
如果您有iOS设备并满足Xamarin.Forms开发的Mac系统要求，请使用类似的技术将应用程序部署到iOS设备。

注意：所有模拟器都不支持电话。