本文介绍了如何使用VisualStudio开发Xamarin.Forms 应用程序和使用Xamarin.Forms开发应用的基础知识,包括了构建和发布Xamarin.Forms应用的工具,概念和步骤。 本文是从Xamarin 开发文档中摘取并翻译的,可以参见原文: https://developer.xamarin.com/guides/xamarin-forms/getting-started/hello-xamarin-forms/quickstart/#
第一部分 快速入门
本文的第一部分演示了如何创建一个电话号码本翻译的应用,他可以将用户使用字母输入的电话号码翻译成真正数字的电话号码,然后拨出并呼叫该号码。这个应用对于外国人来说很有用,但是对于中国人来说好像没啥用。但是作为入门课程,还是很值得学一学的。 该程序运行起来象如下这个图片的样子,叫做Phoneword。 下面就跟着这些步骤来做:
1.启动Visual Studio(一下简称VS),进入起始页。
2.在VS,点击 New Project 来建立一个新项目
3.在新项目对话框,点击Cross-Platform(跨平台),选择Blank Xaml App(Xamarin.Forms Portable) 模板,设置名字和解决方案的名字为PhoneWord,选一个合适的位置保存本项目,点击OK。
4.在Solution Explorer窗口,右击Phoneword解决方案,并选择Manage Nuget Packaages for Solution。
5.在Manage Packges for Solution(管理解决方案的包) 对话框,选择,Updates 页,然后选择Xamarin.Forms包,确保将包更新至stable release(最新发行版本)。
6.在解决方案浏览器窗口(Solution Explorer)内,Phoneword 项目里,双击MainPage.xaml 打开它。
7.将该文件的所有行去掉,换成下面这些内容。这些内容定义了用户界面。然后按Ctrl+S 保存,然后关闭此文件。
xml version="1.0" encoding="UTF-8"?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Phoneword.MainPage"> <ContentPage.Padding> <OnPlatform x:TypeArguments="Thickness" iOS="20, 40, 20, 20" Android="20, 20, 20, 20" WinPhone="20, 20, 20, 20" /> ContentPage.Padding> <ContentPage.Content> <StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Orientation="Vertical" Spacing="15"> <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.Content> ContentPage>
8.在解决方案浏览器,展开MainPage.xaml并双击MainPage.xaml.cs打开。
9.去掉这个文件中的所有代码,并替换成下面的内容。
1 using System; 2 using Xamarin.Forms; 3 4 namespace Phoneword 5 { 6 public partial class MainPage : ContentPage 7 { 8 string translatedNumber; 9 10 public MainPage () 11 { 12 InitializeComponent (); 13 } 14 15 void OnTranslate (object sender, EventArgs e) 16 { 17 translatedNumber = Core.PhonewordTranslator.ToNumber (phoneNumberText.Text); 18 if (!string.IsNullOrWhiteSpace (translatedNumber)) { 19 callButton.IsEnabled = true; 20 callButton.Text = "Call " + translatedNumber; 21 } else { 22 callButton.IsEnabled = false; 23 callButton.Text = "Call"; 24 } 25 } 26 27 async void OnCall (object sender, EventArgs e) 28 { 29 if (await this.DisplayAlert ( 30 "Dial a Number", 31 "Would you like to call " + translatedNumber + "?", 32 "Yes", 33 "No")) { 34 var dialer = DependencyService.Get(); 35 if (dialer != null) 36 dialer.Dial (translatedNumber); 37 } 38 } 39 } 40 }
按CTRL+S保存它,然后关闭。
10.解决方案浏览器窗口里,展开App.xaml,双击App.xaml.cs 打开。
11.移除所有内容,替换成下面的代码。 这里,App的构造函数简单地设置MainPage 类为应用程序启动页。
using Xamarin.Forms; using Xamarin.Forms.Xaml; [assembly: XamlCompilation(XamlCompilationOptions.Compile)] namespace Phoneword { public partial class App : Application { public App() { InitializeComponent(); MainPage = new MainPage(); } protected override void OnStart() { // Handle when your app starts } protected override void OnSleep() { // Handle when your app sleeps } protected override void OnResume() { // Handle when your app resumes } } }
按CTRL+S保存,然后关闭它。
12.右击Phoneword 项目,选择Add->New Item..
13.在Add New Item 对话框内,选择Visual C#->Code->Class,添加一个类,并命名为PhoneTranslator,然后点击Add按钮。
14.移除PhoneTranslator.cs中所有内容,替换成如下代码。这段代码将把电话单词翻译成电话号码。
using System.Text; namespace Core { public static class PhonewordTranslator { public static string ToNumber(string raw) { if (string.IsNullOrWhiteSpace(raw)) return null; raw = raw.ToUpperInvariant(); var newNumber = new StringBuilder(); foreach (var c in raw) { if (" -0123456789".Contains(c)) newNumber.Append(c); else { var result = TranslateToNumber(c); if (result != null) newNumber.Append(result); // Bad character? else return null; } } return newNumber.ToString(); } static bool Contains(this string keyString, char c) { return keyString.IndexOf(c) >= 0; } static readonly string[] digits = { "ABC", "DEF", "GHI", "JKL", "MNO", "PQRS", "TUV", "WXYZ" }; static int? TranslateToNumber(char c) { for (int i = 0; i < digits.Length; i++) { if (digits[i].Contains(c)) return 2 + i; } return null; } } }
然后保存并关闭它。
15.添加新接口。在Phoneword项目上右击,选择Add->New Item..
16.在Add New Item对话框内,选择Visual C#->Code->Interface,命名为IDialer,点击Add按钮。
17.将该文件替换成如下内容: namespace Phoneword { public interface IDialer { bool Dial(string number); } } 然后保存并关闭它。 到目前为止,本应用的通用代码已经完成了。下面是与平台相关的拨号器代码,它将实现为一个DependencyService.
namespace Phoneword { public interface IDialer { bool Dial(string number); } }
18.右击Phoneword.IOS项目,选择Add->New Item..
19.在Add New Item对话框内,选择Apple->Code->Class 命名为PhoneDialer,然后点击Add按钮。
20.将该文件替换成如下代码。这段代码创建了Dial方法,他将在IOS平台上拨出翻译后的电话号码。
using Foundation; using Phoneword.iOS; using UIKit; using Xamarin.Forms; [assembly: Dependency(typeof(PhoneDialer))] namespace Phoneword.iOS { public class PhoneDialer : IDialer { public bool Dial(string number) { return UIApplication.SharedApplication.OpenUrl ( new NSUrl ("tel:" + number)); } } }
然后保存并关闭。
21.在解决方案窗口,右击Phoneword.Droid项目并选择添加新项(Add->New Item..)。
22.添加新项对话框内选择 Visual C#->Android->Class,命名为PhoneDialer。然后单击Add 按钮。
23.将该文件替换成如下代码,该代码的Dial方法将在Android平台上拨出翻译完的电话号码。
using Android.Content; using Android.Telephony; using Phoneword.Droid; using System.Linq; using Xamarin.Forms; using Uri = Android.Net.Uri; [assembly: Dependency(typeof(PhoneDialer))] namespace Phoneword.Droid { public class PhoneDialer : IDialer { public bool Dial(string number) { var context = Forms.Context; if (context == null) return false; var intent = new Intent (Intent.ActionCall); intent.SetData (Uri.Parse ("tel:" + number)); if (IsIntentAvailable (context, intent)) { context.StartActivity (intent); return true; } return false; } public static bool IsIntentAvailable(Context context, Intent intent) { var packageManager = context.PackageManager; var list = packageManager.QueryIntentServices (intent, 0) .Union (packageManager.QueryIntentActivities (intent, 0)); if (list.Any ()) return true; var manager = TelephonyManager.FromContext (context); return manager.PhoneType != PhoneType.None; } } }
然后保存并关闭它。
24.双击Phoneword.Droid项目的 Properties,并选择Android Manifest页。
25.在Required permissions里,选中CALL_PHONE权限并打勾。这将允许本应用进行电话拨号。 保存并关闭之
26.在解决方案窗口,右击Phoneword.UWP项目并选择添加新项(Add->New Item..)。
27.添加新项对话框内选择 Visual C#->Android->Class,命名为PhoneDialer。然后单击Add 按钮。
28.将该文件替换成如下代码,该代码的Dial方法将在Windows通用平台上拨出翻译完的电话号码。
using Phoneword.UWP; using System; using System.Threading.Tasks; using Windows.ApplicationModel.Calls; using Windows.UI.Popups; using Xamarin.Forms; [assembly: Dependency(typeof(PhoneDialer))] namespace Phoneword.UWP { public class PhoneDialer : IDialer { bool dialled = false; public bool Dial(string number) { DialNumber(number); return dialled; } async void DialNumber(string number) { var phoneLine = await GetDefaultPhoneLineAsync(); if (phoneLine != null) { phoneLine.Dial(number, number); dialled = true; } else { var dialog = new MessageDialog("No line found to place the call"); await dialog.ShowAsync(); dialled = false; } } async TaskGetDefaultPhoneLineAsync() { var phoneCallStore = await PhoneCallManager.RequestStoreAsync(); var lineId = await phoneCallStore.GetDefaultLineAsync(); return await PhoneLine.FromIdAsync(lineId); } } }
保存并关闭它。
29.在Phoneword.UWP项目内,右击References,并选择Add Reference 添加引用。
30.引用管理器窗口内,选择Universal Windows->Extensions->Windows MobleExtensions for UWP,点击OK。
31.在Phoneword.UWP工程内,双击Package.appxmanifest。
32.在Capabilities页,将Phone Call 项打勾,这可以让本应用有呼叫电话的权限。然后保存并关闭。
33.选择Build->Build Solution菜单项,或按CTRL+SHIFT+B。项目将会进行构建,在状态栏内会出现成功的消息。如果遇到什么错误,重复前面的步骤并矫正错误直到构建成功。
34.解决方案窗口,右击Phoneword.UWP项目,并选择Set as StartUp Project。将其设置为启动项目。
35.在VS的工具条内,按Start 按钮。运行该应用。
36.解决方案窗口,右击Phoneword.Droid项目,选择Set as StartUp Project。
37.在VS工具条内,按Start按钮,程序将在Android模拟器中运行。
38.如果你有一个IOS设备,满足Mac系统的Xamarin.Forms开发需求,用类似的技术发布应用到IOS设备上。注意:模拟器上都不支持拨打电话功能。
OK,恭喜你已经完成了Xamarin.Forms 应用!