本节课主要学习掌握下面的知识点 创建跨平台 Xamarin.Forms 应用程序。 使用可扩展应用程序标记语言 (XAML) 为页面定义用户界面。 在代码中与 XAML 用户界面元素交互。 如何创建跨平台 Xamarin.Forms 应用程序,通过该应用程序可输入便笺并将其保存到设备存储。




最终的应用程序如下所示:
1 启动 Visual Studio 2019,然后在开始窗口中单击“创建项目”以创建新项目 :
2 在“创建新项目” 窗口中,在“项目类型” 下拉菜单中选择“移动” ,选择“移动应用(Xamarin.Forms)” ,然后单击“下一步” 按钮:
3 在“配置新项目” 对话框中,将“项目名称” 设置为“Notes” ,为项目选择合适的位置,然后单击“创建” 按钮
4 在“新的跨平台应用” 对话框中,单击“空白应用” ,然后单击“确定” 按钮:
5 在“解决方案资源管理器”的“Notes”项目中,双击“MainPage.xaml”将其打开 :
6 在“MainPage.xaml”中,删除所有模板代码,替换为以下代码 :
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="[http://xamarin.com/schemas/2014/forms](http://xamarin.com/schemas/2014/forms)"
xmlns:x="[http://schemas.microsoft.com/winfx/2009/xaml](http://schemas.microsoft.com/winfx/2009/xaml)"
x:Class="Notes.MainPage">
<StackLayout Margin="10,35,10,10">
<Label Text="Notes"
HorizontalOptions="Center"
FontAttributes="Bold" />
<Editor x:Name="editor"
Placeholder="Enter your note"
HeightRequest="100" />
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button Text="Save"
Clicked="OnSaveButtonClicked" />
<Button Grid.Column="1"
Text="Delete"
Clicked="OnDeleteButtonClicked"/>
</Grid>
</StackLayout>
</ContentPage>
Code language: HTML, XML (xml)
该代码以声明的方式定义页面的用户界面,它包含一个用于显示文本的 Label、一个用于文本输入的 Editor 以及两个指示应用程序保存或删除文件的 Button 实例。 这两个 Button 实例水平放置在 Grid 中,而 Label、Editor 和 Grid 垂直放置在 StackLayout 中。
7 在“解决方案资源管理器”的“Notes”项目中,展开“MainPage.xaml”,然后双击“MainPage.xaml.cs”将其打开 : 8 在“MainPage.xaml.cs”中,删除所有模板代码并将其替换为以下代码 :

using System;
using System.IO;
using Xamarin.Forms;
namespace Notes
{
public partial class MainPage : ContentPage
{
string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "notes.txt");
public MainPage()
{
InitializeComponent();
if (File.Exists(_fileName))
{
editor.Text = File.ReadAllText(_fileName);
}
}
void OnSaveButtonClicked(object sender, EventArgs e)
{
//如果文件filename不存在 则会创建一个新的文件
File.WriteAllText(_fileName, editor.Text);
}
void OnDeleteButtonClicked(object sender, EventArgs e)
{
if (File.Exists(_fileName))
{
File.Delete(_fileName);
}
editor.Text = string.Empty;
}
}
}
此代码定义一个 _fileName 字段,该字段引用名为 notes.txt 的文件,而该文件将便笺数据存储在应用程序的本地应用程序数据文件夹中。 如果有文件,则在执行页构造函数时读取文件并将其显示在 Editor 中。 按“保存”Button 时,会执行 OnSaveButtonClicked 事件处理程序,它将 Editor 的内容保存到文件中 。 如果文件不存在则先创建文件。WriteAllText 会创建文件,如果文件不存在。 按“删除”Button 时,会执行 OnDeleteButtonClicked 事件处理程序,它会删除文件(前提是它存在)并删除 Editor 中的任何文本 。
说明:不需要手动在项目中添加notes.txt,程序运行后自动生成。
9 在 Visual Studio 工具栏中,右键单击“Notes.iOS”项目,然后选择“设为启动项目” 。

编译报错
E:\xxx\Xamarin.Forms\codes\Notes\Notes.Android\obj\Debug\90\lp\30\jl\res : error APT2097: failed to open directory:
Code language: CSS (css)
原因:项目存放路径包含中文 E:\xxxx\Xamarin.Forms,Android编译工具APT无法识别中文路径,中文变成乱码,打开目录失败。
解决方法:
- 关闭Visual Studio
- 将整个Notes项目文件夹移动到纯英文路径,例如
E:\Xamarin\codes\Notes - 使用新路径下的Notes.sln重新打开解决方案,再次编译运行。