Xamarin 简明教程
Xamarin - Installation
Xamarin 构建在 .NET Framework 之上。它允许人们创建可以跨多个平台轻松运行的应用。在此教程中，我们将说明您如何可以使用 Xamarin 来交付本机 iOS、Android 和 Windows 应用程序。
让我们通过讨论如何在 Windows 和 Mac 系统上安装 Xamarin 来开始本教程。
System Requirements
Installation on Windows
从 https://www.xamarin.com/download 下载 Xamarin 安装程序在运行 Xamarin 安装程序之前，确保已在你的电脑上安装了 Android SDK 和 Java SDK。
运行下载的安装程序以开始安装流程 -
-
将出现 Xamarin 许可协议屏幕。单击 Next 按钮以接受协议。
-
安装程序将搜索任何缺失的组件，并提示你下载和安装它们。
-
Xamarin 安装完成后，单击 Close 按钮退出并准备开始使用 Xamarin。
Xamarin - First Application
在本章中，我们将了解如何使用 Xamarin 创建一个小型 Android 应用程序。
Hello Xamarin! Application
首先，启动 Visual Studio 的一个新实例，然后转到 File → New → Project 。
在出现的“菜单”对话框中，转到 Templates → Visual C# → Android → Blank App (Android) 。
为你的应用程序起一个合适的名称。在我们的案例中，我们将其命名为 “helloWorld” ，并将其保存在提供的默认位置。接下来，单击“确定”按钮以加载新的 “helloXamarin” 项目。
在 solution 中，打开 Resources → layout → Main.axml 文件。从“设计视图”切换，并转到 Source 文件并键入以下代码行来构建你的应用程序。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "#d3d3d3"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<TextView
android:text = "@string/HelloXamarin"
android:textAppearance = "?android:attr/textAppearanceLarge"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/textView2"
android:textColor = "@android:color/black" />
</LinearLayout>在以上代码中，我们创建了一个新的 Android textview 。接下来，打开“values”文件夹，并双击 Strings.xml 以打开它。在此，我们将存储以上创建的 button 中的信息和值。
<?xml version = "1.0" encoding = "utf-8"?>
<resources>
<string name = "HelloXamarin">Hello World, I am Xamarin!</string>
<string name = "ApplicationName">helloWorld</string>
</resources>打开 MainActivity.cs 文件，并将现有代码替换为以下代码行。
using System;
using Android.App;
using Android.Content;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;
namespace HelloXamarin {
public class MainActivity : Activity {
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
}
}
}保存应用程序。生成然后运行它，以在 Android 模拟器中显示所创建的应用程序。
如果您没有 Android 模拟器，请按照下一部分中的步骤创建一个。
Setting Up an Android Emulator
在 Visual Studio 菜单上，转到 Tools → Android → Android Emulator Manager 。在弹出的窗口中，单击 Create 按钮。它将显示以下屏幕。
在上面的屏幕上，提供您想要的 AVD name 。为您的显示选择一个 device ，例如，Nexus 4” 显示。选择您的 target platform 。最好在最低目标平台上进行测试，例如，API 10 Android 2.3（Gingerbread）以确保您的应用程序可在所有 Android 平台上运行。
填写其余字段并单击确定按钮。您的模拟器现在已准备就绪。您可以从现有 Android 虚拟设备列表中选择它，然后单击 Start 以启动它。
Modifying HelloXamarin App
在此部分中，我们将修改我们的项目并创建一个在点击时显示文本的按钮。打开 main.axml 并切换到 source view 。在我们创建的 textview 后，我们将添加一个按钮，如下所示。
<Button
android:id = "@+id/MyButton"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/ButtonClick" />添加按钮后，我们的完整代码将如下所示 −
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<TextView
android:text = "@string/HelloXamarin"
android:textAppearance = "?android:attr/textAppearanceLarge"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/textView2" />
<Button
android:id = "@+id/MyButton"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/ButtonClick" />
</LinearLayout>接下来，我们在 strings.xml 文件中注册我们的按钮值。
<string name = "ButtonClick">Click Me!</string>在 strings.xml 文件中添加按钮后，我们打开 MainActivity.cs 文件，为按钮在点击时添加一个操作，如下面的代码所示。
using System;
using Android.App;
using Android.Content;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;
namespace HelloXamarin {
[Activity(Label = "HelloXamarin", MainLauncher = true, Icon = "@drawable/icon")]
public class MainActivity : Activity {
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
Button button = FindViewById<Button>(Resource.Id.MyButton);
button.Click += delegate { button.Text = "Hello world I am your first App"; };
}
}
}接下来，生成并运行您的应用程序。
点击按钮后，将获得以下输出 −
Xamarin - Application Manifest
所有 Android 应用都有一个 manifest file ，通常称为 AndroidManifest.xml 。清单文件包含 Android 平台为成功运行应用所需的一切内容。
在此，我们列出了清单文件的部分重要功能 -
-
它声明了应用程序所需的 minimum API level 。
-
它声明了应用程序所需的权限，例如，摄像头、位置等。
-
它授予了应用程序使用或需要的硬件和软件功能的权限。
-
它列出了应用程序必须链接的库。
以下截图显示了一个清单文件。
Application name - 它指您应用的标题
Package name - 它是用于识别您的应用的唯一名称。
Application Icon - 它是针对您的应用显示在 Android 主屏幕上的图标。
Version Number - 它是一个用于显示您应用的一个版本比另一个版本更新的单一数字。
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
android:versionCode="1" >Version Name - 它针对您的应用的用户友好型版本字符串，用户将通过您的应用设置和 Google Play 商店查看该字符串。以下代码显示了一个版本名称示例。
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
android:versionName="1.0.0">Minimum Android Version - 它是您的应用程序所支持的最低 Android 版本平台。
<uses-sdk android:minSdkVersion="16" />在上例中，我们的最低 Android 版本是 API 级别 16，通常称为 JELLY BEAN 。
Target Android Version - 它针对您的应用进行编译的 Android 版本。
Xamarin - Android Resources
创建新的 Android 项目时，会默认将一些文件添加到项目中。我们将这些默认项目文件和文件夹称为 Android Resources 。查看以下屏幕截图。
默认 Android 资源包括以下内容 −
-
AndroidManifest.xml file − 它包含有关您的 Android 应用程序的信息，例如，应用程序名称、权限等。
-
Resources folder − 资源可以是图像、布局、字符串等，可以通过 Android 的资源系统加载的资源。
-
Resources/drawable folder − 它存储您将在应用程序中使用的所有图像。
-
Resources/layout folder − 它包含 Android 用于构建用户界面的所有 Android XML 文件（.axml）。
-
The Resources/values folder − 它包含 XML 文件，用于在整个应用程序中声明字符串（和其他类型）的键值对。这通常是怎样在 Android 上设置多语言本地化。
-
Resources.designer.cs - 当 Android 项目被创建时，该文件会自动创建，并且它包含引用 Android 资源的唯一标识符。
-
MainActivity.cs file - 这是您的 Android 应用程序的第一个活动，并且从中启动了主要的应用程序操作。
可以使用 unique ID 来以编程方式访问资源文件，该文件存储在 resources.designer.cs 文件中。该 ID 包含在一个名为 Resource 的类中。添加到项目中的任何资源都会自动生成在 resource class 中。
下面的代码展示了如何创建一个包含七张图片的网格视图项目：
namespace HelloGridView {
[System.CodeDom.Compiler.GeneratedCodeAttribute
("Xamarin.Android.Build.Tas ks",
"1.0.0.0")]
public partial class Resource {
static Resource() {
global::Android.Runtime.ResourceIdManager.UpdateIdValues();
}
public static void UpdateIdValues() {}
public partial class Attribute {
static Attribute() {
global::Android.Runtime.ResourceIdManager.UpdateIdValues();
}
private Attribute() {}
}
public partial class Drawable {
// aapt resource value: 0x7f020000
public const int Icon = 2130837504;
// aapt resource value: 0x7f020001
public const int img1 = 2130837505;
// aapt resource value: 0x7f020002
public const int img2 = 2130837506;
// aapt resource value: 0x7f020003
public const int img3 = 2130837507;
// aapt resource value: 0x7f020004
public const int img4 = 2130837508;
// aapt resource value: 0x7f020005
public const int img5 = 2130837509;
// aapt resource value: 0x7f020006
public const int img6 = 2130837510;
// aapt resource value: 0x7f020007
public const int img7 = 2130837511;
static Drawable() {
global::Android.Runtime.ResourceIdManager.UpdateIdValues();
}
private Drawable() {}
}
public partial class Id {
// aapt resource value: 0x7f050000
public const int gridview = 2131034112;
static Id() {
global::Android.Runtime.ResourceIdManager.UpdateIdValues();
}
private Id() {}
}
public partial class Layout {
// aapt resource value: 0x7f030000
public const int Main = 2130903040;
static Layout() {
global::Android.Runtime.ResourceIdManager.UpdateIdValues();
}
private Layout() {}
}
public partial class String {
// aapt resource value: 0x7f040001
public const int ApplicationName = 2130968577;
// aapt resource value: 0x7f040000
public const int Hello = 2130968576;
static String() {
global::Android.Runtime.ResourceIdManager.UpdateIdValues();
}
private String() {}
}
}
}从上面的代码中，七张照片被引用在一个名为 drawable 的类中。这些图片是通过编程方式添加的。如果用户向项目中添加另一张图片，它也将被添加到 drawable 类。项目中包含的 gridview 也被添加并存储在它自己的一个类中。 resources folder 中包含的每个项目都会自动生成并存储在一个类中。
Xamarin - Android Activity Lifecycle
当用户浏览一个 Android 应用时，会发生一系列事件。例如，当用户启动一个应用，例如 Facebook 应用，它会启动并且对用户在前台可见， onCreate() → onStart() → onResume() 。
如果另一个活动启动，例如电话呼入，那么 Facebook 应用将进入后台，通话进入前台。我们现在有两个正在运行的进程。
onPause() --- > onStop()当通话结束时，Facebook 应用返回前台。会调用三个方法。
onRestart() --- > onStart() --- > onResume()Android 活动中有 7 个生命周期进程。它们包括如下：
-
onCreate - 在活动首次创建时调用它。
-
onStart - 在活动启动并且对用户可见时调用它。
-
onResume - 在活动开始与用户交互时调用它。用户输入在这个阶段发生。
-
onPause - 在活动在后台运行但尚未被杀死时调用它。
-
onStop - 在活动对用户不再可见时调用它。
-
onRestart - 在活动停止后，在重新启动前调用它。通常在用户返回到先前已停止的活动时调用它。
-
onDestroy - 在活动从内存中移除前的最后一个调用。
下面的插图展示了 Android 活动生命周期：
Xamarin - Permissions
在 Android 中，默认情况下，没有任何应用程序有权限对可能对用户或操作系统产生影响的任何操作执行操作。为了让 App 执行一项任务，它必须声明权限。在 Android 系统授予权限之前，App 无法执行此任务。此权限机制阻止应用程序在未经用户同意的情况下执行其希望的操作。
权限将记录在 AndroidManifest.xml 文件中。要添加权限，请双击属性，然后转至 Android Man*所需的权限*将出现。选中你要添加的适当权限。
Camera − 它提供访问设备摄像头的权限。
<uses-permission android:name="android.permission.CAMERA" />Internet − 它提供对网络资源的访问。
<uses-permission android:name="android.permission.INTERNET" />ReadContacts − 它提供访问设备上联系人的权限。
<uses-permission android:name="android.permission.READ_CONTACTS" />ReadExternalStorage − 它提供对外部存储器读写数据的权限。
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />Calendars − 它允许应用程序访问用户设备上的日历和事件。此权限可能很危险，因为它赋予应用程序在所有者不知情的情况下向来宾发送电子邮件的能力。添加此权限的语法如下所示 −
<uses-permission android:name="android.permission-group.CALENADAR" />SMS − 具有此权限的应用程序有能力使用设备的消息服务。它包括读取、写入和编辑短信和彩信。其语法如下所示。
<uses-permission android:name="android.permission-group.SMS" />Location − 具有此权限的应用程序可以使用 GPS 网络访问设备的位置。
<uses-permission android:name="android.permission-group.LOCATION" />Bluetooth − 具有此权限的应用程序可以使用蓝牙功能的设备无线地交换数据文件。
<uses-permission android:name="android.permission.BLUETOOTH" />Xamarin - Building the App GUI
TextView
TextView 是 Android 微件的一个非常重要的组件。它主要用于在 Android 屏幕上显示文本。
为了创建一个 textView，只需打开 main.axml ，并在 linear layout 标签之间添加以下代码。
<TextView
android:text = "Hello I am a text View"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/textview1" />Button
按钮是一个控件，在点击时用于触发一个事件。在 Main.axml 文件下，键入以下代码以创建按钮。
<Button
android:id = "@+id/MyButton"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/Hello" />打开 Resources\Values\Strings.xml ，并在 <resources> 标签之间键入以下代码。
<string name="Hello">Click Me!</string>上述代码提供了我们创建的按钮的值。接下来，我们打开 MainActivity.cs 并创建在按钮点击时要执行的动作。在 base.OnCreate （bundle）方法下键入以下代码。
Button button = FindViewById<Button>(Resource.Id.MyButton);
button.Click += delegate { button.Text = "You clicked me"; };
当用户单击该按钮时，上述代码会显示“You Clicked Me”。
FindViewById<< -→ 该方法找到已识别的视图的 ID。它在 .axml 布局文件中搜索 id。
Checkbox
当希望从一组选项中选择多个选项时，使用复选框。在此示例中，我们将创建一个复选框，选中后，显示已选中，否则显示未选中。
首先，我们在项目中打开 Main.axml 文件，并键入以下代码行以创建一个复选框。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "#d3d3d3"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<CheckBox
android:text = "CheckBox"
android:padding = "25dp"
android:layout_width = "300dp"
android:layout_height = "wrap_content"
android:id = "@+id/checkBox1"
android:textColor = "@android:color/black"
android:background = "@android:color/holo_blue_dark" />
</LinearLayout>下一步，转到 MainActivity.cs 来添加功能代码。
CheckBox checkMe = FindViewById<CheckBox>(Resource.Id.checkBox1);
checkMe.CheckedChange += (object sender, CompoundButton.CheckedChangeEventArgs e) => {
CheckBox check = (CheckBox)sender;
if(check.Checked) {
check.Text = "Checkbox has been checked";
} else {
check.Text = "Checkbox has not been checked";
}
};从上述代码中，我们首先使用 findViewById 找到复选框。接下来，我们为复选框创建一个处理程序方法，并在处理程序中，我们创建一个 if else 语句，根据选择的结果显示消息。
CompoundButton.CheckedChangeEventArgs → 复选框的状态更改时，此方法将触发事件。
Progress Bar
进度条是一个用于显示操作进度的控件。要添加进度条，请在 Main.axml 文件中添加以下代码行。
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/progressBar1" />下一步，转到 MainActivity.cs 并设置进度条的值。
ProgressBar pb = FindViewById<ProgressBar>(Resource.Id.progressBar1);
pb.Progress = 35;在上述代码中，我们创建了一个值为 35 的进度条。
Radio Buttons
这是一个 Android 小部件，允许人从一组选项中选择一个。在本部分中，我们将创建一个包含汽车列表的单选组，该组将获取选中的单选按钮。
首先，我们添加一个单选组和 textview ，如下面的代码所示 −
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "@android:color/darker_gray"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<TextView
android:text = "What is your favourite Car"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/textView1"
android:textColor = "@android:color/black" />
<RadioGroup
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/radioGroup1"
android:backgroundTint = "#a52a2aff"
android:background = "@android:color/holo_green_dark">
<RadioButton
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:text = "Ferrari"
android:id = "@+id/radioFerrari" />
<RadioButton
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:text = "Mercedes"
android:id = "@+id/radioMercedes" />
<RadioButton
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:text = "Lamborghini"
android:id = "@+id/radioLamborghini" />
<RadioButton
android:text = "Audi"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/radioAudi" />
</RadioGroup>
</LinearLayout>当单击单选按钮时，执行一个动作，我们添加一个活动。转到 MainActivity.cs 并创建一个新事件处理程序，如下所示。
private void onClickRadioButton(object sender, EventArgs e) {
RadioButton cars = (RadioButton)sender;
Toast.MakeText(this, cars.Text, ToastLength.Short).Show
();
}Toast.MakeText() → 这是一个视图方法，用于在小弹出窗口中显示消息/输出。在 OnCreate() 方法底部的 SetContentView() 之后，添加以下代码片段。这将捕获每个单选按钮并将其添加到我们创建的事件处理程序中。
RadioButton radio_Ferrari = FindViewById<RadioButton>
(Resource.Id.radioFerrari);
RadioButton radio_Mercedes = FindViewById<RadioButton>
(Resource.Id.radioMercedes);
RadioButton radio_Lambo = FindViewById<RadioButton>
(Resource.Id.radioLamborghini);
RadioButton radio_Audi = FindViewById<RadioButton>
(Resource.Id.radioAudi);
radio_Ferrari.Click += onClickRadioButton;
radio_Mercedes.Click += onClickRadioButton;
radio_Lambo.Click += onClickRadioButton;
radio_Audi.Click += onClickRadioButton;现在，运行你的应用程序。它应该显示以下屏幕作为输出 −
Toggle Buttons
切换按钮用于在两种状态之间切换，例如，它可以在开（ON）和关（OFF）之间切换。打开 Resources\layout\Main.axml 并添加以下代码行以创建一个切换按钮。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "#d3d3d3"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<ToggleButton
android:id = "@+id/togglebutton"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:textOn = "Torch ON"
android:textOff = "Torch OFF"
android:textColor = "@android:color/black" />
</LinearLayout>单击切换栏时，我们可以向其中添加操作。打开 MainActivity.cs ，并在 OnCreate() 方法类之后添加以下代码行。
ToggleButton togglebutton = FindViewById<ToggleButton> (Resource.Id.togglebutton);
togglebutton.Click += (o, e) => {
if (togglebutton.Checked)
Toast.MakeText(this, "Torch is ON", ToastLength.Short).Show ();
else
Toast.MakeText(this, "Torch is OFF",
ToastLength.Short).Show();
};现在，当您运行 App 时，它应显示以下输出 −
Ratings Bar
等级栏是由星构成的窗体元素，应用程序用户可以使用这些星来评估您为他们提供的内容。在您的 Main.axml 文件中，使用 5 颗星创建一个新的等级栏。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "#d3d3d3"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<RatingBar
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:id = "@+id/ratingBar1"
android:numStars = "5"
android:stepSize = "1.0" />
</LinearLayout>运行应用程序后，它应显示以下输出 −
Autocomplete Textview
这是一个文本视图，在用户输入时显示全部建议。我们要创建一个自动填充文本视图，其中包含一个人员姓名列表，以及一个单击后将显示所选名称的按钮。
打开 Main.axml 并编写以下代码。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:background = "#d3d3d3"
android:layout_height = "fill_parent">
<TextView
android:text = "Enter Name"
android:textAppearance = "?android:attr/textAppearanceMedium"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:id = "@+id/textView1"
android:padding = "5dp"
android:textColor = "@android:color/black" />
<AutoCompleteTextView
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:id = "@+id/autoComplete1"
android:textColor = "@android:color/black" />
<Button
android:text = "Submit"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:id = "@+id/btn_Submit"
android:background="@android:color/holo_green_dark" />
</LinearLayout>以上的代码将生成一个用于输入的 TextView、用于显示建议的 AutoCompleteTextView 和一个用于显示从 TextView 输入的名称的按钮。转到 MainActivity.cs 以添加该功能。
创建如下所示的新事件处理程序方法。
protected void ClickedBtnSubmit(object sender, System.EventArgs e){
if (autoComplete1.Text != ""){
Toast.MakeText(this, "The Name Entered ="
+ autoComplete1.Text, ToastLength.Short).Show();
} else {
Toast.MakeText(this, "Enter a Name!", ToastLength.Short).Show();
}
}创建的处理程序将检查自动填充文本视图是否为空。如果它不为空，则显示所选的自动填充文本。在 OnCreate() 类中键入以下代码。
autoComplete1 = FindViewById<AutoCompleteTextView>(Resource.Id.autoComplete1);
btn_Submit = FindViewById<Button>(Resource.Id.btn_Submit);
var names = new string[] { "John", "Peter", "Jane", "Britney" };
ArrayAdapter adapter = new ArrayAdapter<string>(this,
Android.Resource.Layout.SimpleSpinnerItem, names);
autoComplete1.Adapter = adapter;
btn_Submit.Click += ClickedBtnSubmit;ArrayAdapter − 这是一个收集处理程序，它从列表收集中读取数据项并将其作为视图返回或显示在屏幕上。
现在，当您运行应用程序时，它应显示以下输出。
Xamarin - Menus
Popup Menus
弹出菜单是指附属于视图的菜单；它也称为 shortcut menu 。让我们来看看如何向 Android 应用程序添加弹出菜单。
创建一个新项目并将其命名为 popUpMenu App 。打开 Main.axml 并创建一个按钮，该按钮将用于显示弹出菜单。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "#d3d3d3"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<Button
android:id = "@+id/popupButton"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "Show popup menu"
android:background = "@android:color/holo_green_dark"
android:textColor = "@android:color/black" />
</LinearLayout>在 Resources 文件夹下创建一个新文件夹，并将其命名为 Menu 。在 Menu 文件夹内，添加一个名为 popMenu.xml 的新 xml 文件。
在 popMenu.xml 下，添加以下菜单项。
<?xml version = "1.0" encoding="utf-8"?>
<menu xmlns:android = "http://schemas.android.com/apk/res/android">
<item
android:id = "@+id/file_settings"
android:icon = "@drawable/img_settings"
android:title = "Settings"
android:showAsAction = "ifRoom">
<item
android:id = "@+id/new_game1"
android:icon = "@drawable/imgNew"
android:title = "New File Settings"/>
<item
android:id = "@+id/help"
android:icon = "@drawable/img_help"
android:title = "Help" />
<item
android:id = "@+id/about_app"
android:icon = "@drawable/img_help"
android:title = "About app"/>
</item>
</menu>添加菜单项后，转到 mainActivity.cs 以在单击按钮时显示弹出菜单。
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
Button showPopupMenu = FindViewById<Button>(Resource.Id.popupButton);
showPopupMenu.Click += (s, arg) => {
PopupMenu menu = new PopupMenu(this, showPopupMenu);
menu.Inflate(Resource.Menu.popMenu);
menu.Show();
};
}现在，构建并运行您的应用程序。它应产生以下输出 −
Options Menu
选项菜单是由 App 主要菜单组成的集合，主要用于存储设置、搜索等。在这里，我们将在设置菜单中创建三个项目，即 New File Settings, Help, and About App 。
为创建一个选项菜单，我们必须在 resources 文件夹中创建一个新的 XML 布局文件。首先，我们将添加一个新的 XML 文件。鼠标右键单击 Layout folder ，然后转到 Add → New item → Visual C# → XML File 。
为 layout file 选择一个合适的名字。在我们的示例中，我们将把我们的文件称为 myMenu.xml 。
在 myMenu.xml 中，我们将创建一个新菜单并在其中添加项目。以下代码展示了如何执行此操作。
<?xml version = "1.0" encoding = "utf-8"?>
<menu xmlns:android = "http://schemas.android.com/apk/res/android">
<item
android:id = "@+id/file_settings"
android:icon = "@drawable/img_settings"
android:title = "Settings"
android:showAsAction = "ifRoom">
<menu>
<item
android:id = "@+id/new_game1"
android:icon = "@drawable/imgNew"
android:title = "New File Settings" />
<item
android:id = "@+id/help"
android:icon = "@drawable/img_help"
android:title = "Help" />
<item
android:id = "@+id/about_app"
android:icon = "@drawable/img_help"
android:title = "About app"/>
</menu>
</item>
</menu>接下来，我们将导航到 MainActivity.cs 并为 onOptionsMenu() 创建一个覆盖类。
public override bool OnCreateOptionsMenu(IMenu menu) {
MenuInflater.Inflate(Resource.Menu.myMenu, menu);
return base.OnPrepareOptionsMenu(menu);
}接下来，我们创建一个操作以在选择 settings menu 时对其进行响应。为此，我们为 OnOptionsItemSelected() 菜单创建另一个覆盖类。
public override bool OnOptionsItemSelected(IMenuItem item) {
if (item.ItemId == Resource.Id.file_settings) {
// do something here...
return true;
}
return base.OnOptionsItemSelected(item);
}我们最终的完整代码如下所示：
namespace optionsMenuApp {
[Activity(Label = "options Menu", MainLauncher = true, Icon = "@drawable/icon")]
public class MainActivity : Activity {
public override bool OnCreateOptionsMenu(IMenu menu) {
MenuInflater.Inflate(Resource.Menu.myMenu, menu);
return base.OnPrepareOptionsMenu(menu);
}
public override bool OnOptionsItemSelected(IMenuItem item) {
if (item.ItemId == Resource.Id.file_settings) {
// do something here...
return true;
}
return base.OnOptionsItemSelected(item);
}
}
}现在，构建并运行您的应用程序。它应产生以下输出 −
Xamarin - Layouts
Linear Layout
在线性布局中，内容水平或垂直排列。
Linear Layout ─ Horizontal
此布局的内容水平排列。对于此演示，我们将创建 3 个按钮并将它们水平排列在线性布局中。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "horizontal"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
android:background = "#d3d3d3"
android:minWidth="25px"
android:minHeight="25px">
<Button
android:id="@+id/MyButton1"
android:layout_width="wrap_content"
android:layout_margin="10dp"
android:layout_height="wrap_content"
android:text="Button 1"
android:background="@android:color/holo_green_dark" />
<Button
android:id="@+id/MyButton2"
android:layout_width="wrap_content"
android:layout_margin="10dp"
android:layout_height="wrap_content"
android:text="Button 2"
android:background="@android:color/holo_green_dark" />
<Button
android:id="@+id/MyButton3"
android:layout_width="wrap_content"
android:layout_margin="10dp"
android:layout_height="wrap_content"
android:text="Button 3"
android:background="@android:color/holo_green_dark" />
</LinearLayout>结果输出如下所示 -
Linear Layout ─ Vertical
这种类型的布局将子视图垂直放置。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
android:background = "#d3d3d3"
android:minWidth = "25px"
android:minHeight = "25px">
<Button
android:id = "@+id/MyButton1"
android:layout_width = "fill_parent"
android:layout_margin = "10dp"
android:layout_height = "wrap_content"
android:text = "Button 1"
android:background = "@android:color/holo_green_dark" />
<Button
android:id = "@+id/MyButton2"
android:layout_width = "fill_parent"
android:layout_margin = "10dp"
android:layout_height = "wrap_content"
android:text = "Button 2"
android:background = "@android:color/holo_green_dark" />
<Button
android:id = "@+id/MyButton3"
android:layout_width = "fill_parent"
android:layout_margin = "10dp"
android:layout_height = "wrap_content"
android:text="Button 3"
android:background = "@android:color/holo_green_dark" />
</LinearLayout>其结果输出如下 -
Relative Layout
在此视图中，子视图的位置相对于其父视图或其兄弟视图。在以下示例中，我们将创建 3 个 EditText 视图和一个按钮，然后相对排列它们。
创建一个新项目并将其命名为 relative layout app 。打开 main.axml 并添加以下代码。
<?xml version = "1.0" encoding = "utf-8"?>
<RelativeLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:layout_width = "match_parent"
android:layout_height = "match_parent"
android:paddingLeft = "16dp"
android:background = "#d3d3d3"
android:paddingRight = "16dp">
<EditText
android:id = "@+id/name"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:hint = "First Name"
android:textColorHint = "@android:color/background_dark"
android:textColor = "@android:color/background_dark" />
<EditText
android:id = "@+id/lastName"
android:layout_width = "0dp"
android:layout_height = "wrap_content"
android:hint = "Last Name"
android:layout_below = "@id/name"
android:textColorHint = "@android:color/background_dark"
android:textColor = "@android:color/background_dark"
android:layout_alignParentLeft = "true"
android:layout_toLeftOf = "@+id/age" />
<EditText
android:id = "@id/age"
android:layout_width = "80dp"
android:layout_height = "wrap_content"
android:layout_below = "@id/name"
android:hint = "Age"
android:textColorHint = "@android:color/background_dark"
android:textColor = "@android:color/background_dark"
android:layout_alignParentRight = "true" />
<Button
android:layout_width = "85dp"
android:layout_height = "wrap_content"
android:layout_below = "@id/age"
android:layout_alignParentRight = "true"
android:text = "Submit"
android:background = "@android:color/holo_green_dark" />
</RelativeLayout>此代码中我们使用的重要参数为 -
-
android:layout_below - 它将子视图元素对其父视图下方。
-
android:layout_alignParentLeft - 它将父元素左对齐。
-
android:layout_toLeftOf - 此属性将一个元素左对齐另一个元素。
-
android:layout_alignParentRight - 它将父元素右对齐。
当您现在构建并运行该应用程序时，它将生成以下输出屏幕 -
Frame Layout
框架布局用于仅显示一个项目。在此布局中排列多个项目而不会让它们相互重叠是很困难的。
启动一个新项目并将其命名为 frameLayoutApp 。创建新的框架布局，如下所示。
<?xml version = "1.0" encoding = "utf-8"?>
<FrameLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<ImageView
android:id = "@+id/ImageView1"
android:scaleType = "matrix"
android:layout_height = "fill_parent"
android:layout_width = "fill_parent"
android:src = "@drawable/img1" />
<TextView
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:textSize = "50dp"
android:textColor = "#000"
android:text = "This is a Lake" />
<TextView
android:gravity = "right"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:textSize = "50dp"
android:text = "A very Deep Lake"
android:layout_gravity = "bottom"
android:textColor = "#fff" />
</FrameLayout>以上代码创建了一个 imageView ，它填满了整个屏幕。然后两个文本视图悬浮在 imageView 以上。
现在，构建并运行您的应用程序。它将显示以下输出 -
Table Layout
在此布局中，视图排列在 rows 和 columns 中。让我们看看其工作方式。
<?xml version = "1.0" encoding = "utf-8"?>
<TableLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:layout_width = "fill_parent"
android:background = "#d3d3d3"
android:layout_height = "fill_parent"
android:stretchColumns = "1">
<TableRow>
<TextView
android:text = "First Name:"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:textColor = "@android:color/black" />
<EditText
android:width = "100px"
android:layout_width = "fill_parent"
android:layout_height = "30dp"
android:textColor = "@android:color/black" />
</TableRow>
<TableRow>
<TextView
android:text = "Last Name:"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:textColor = "@android:color/black" />
<EditText
android:width = "50px"
android:layout_width = "fill_parent"
android:layout_height = "30dp"
android:textColor = "@android:color/black" />
</TableRow>
<TableRow>
<TextView
android:text = "Residence:"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:textColor = "@android:color/black" />
<EditText
android:width = "100px"
android:layout_width = "fill_parent"
android:layout_height = "30dp"
android:textColor = "@android:color/black" />
</TableRow>
<TableRow>
<TextView
android:text = "Occupation:"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:textColor = "@android:color/black" />
<EditText
android:width = "100px"
android:layout_width = "fill_parent"
android:layout_height = "30dp"
android:textColor = "@android:color/black" />
</TableRow>
<TableRow>
<Button
android:text = "Cancel"
android:layout_width = "wrap_content"
android:layout_margin = "10dp"
android:layout_height = "wrap_content"
android:background = "@android:color/holo_green_dark" />
<Button
android:text = "Submit"
android:width = "100px"
android:layout_margin = "10dp"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:background = "@android:color/holo_green_dark" />
</TableRow>
</TableLayout>以上代码创建了一个使用 tables 和 rows 布置的简单数据输入表单。
Xamarin - Android Widgets
Date Picker
这是一个用于显示日期的小组件。在此示例中，我们将创建一个日期选择器，它会在文本视图中显示设置的日期。
首先，创建一个新项目并将其称为 datePickerExample 。打开 Main.axml 并创建一个 datepicker 、 textview 和一个 button 。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<DatePicker
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/datePicker1" />
<TextView
android:text = "Current Date"
android:textAppearance = "?android:attr/textAppearanceLarge"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/txtShowDate" />
<Button
android:text = "Select Date"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/btnSetDate" />
</LinearLayout>接下来，转到 Mainactivity.cs 。我们首先在 mainActivity:Activity 类中创建一个文本视图的私有实例。
该实例将用于存储选定的日期或默认日期。
private TextView showCurrentDate;接下来，在 setContentView() 方法之后添加以下代码。
DatePicker pickDate = FindViewById<DatePicker>(Resource.Id.datePicker1);
showCurrentDate = FindViewById<TextView>(Resource.Id.txtShowDate);
setCurrentDate();
Button button = FindViewById<Button>(Resource.Id.btnSetDate);
button.Click += delegate {
showCurrentDate.Text = String.Format("{0}/{1}/{2}",
pickDate.Month, pickDate.DayOfMonth, pickDate.Year);
};在上面的代码中，我们通过使用 FindViewById 类从我们的 main.axml 文件中找到它们，从而引用了我们的日期选择器、文本视图和按钮。
引用后，我们设置了按钮单击事件，该单击事件负责将选定的日期从日期选择器传递到文本视图。
接下来，我们创建 setCurrentDate() 方法，以将默认当前日期显示到我们的文本视图。以下代码说明了如何执行此操作。
private void setCurrentDate() {
string TodaysDate = string.Format("{0}",
DateTime.Now.ToString("M/d/yyyy").PadLeft(2, '0'));
showCurrentDate.Text = TodaysDate;
}DateTime.Now.ToString() 类将今天的日期时间绑定到字符串对象。
现在，构建并运行该应用程序。它应该显示以下输出：
Time Picker
时间选择器是一个用于显示时间以及允许用户选择和设置时间的小组件。我们将创建一个基本的 time picker 应用程序，该应用程序会显示时间，还允许用户更改时间。
转到 main.axml 并添加一个新按钮、文本视图和时间选择器，如下面的代码中所示。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "#d3d3d3"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<TimePicker
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/timePicker1" />
<TextView
android:text = "Time"
android:textAppearance = "?android:attr/textAppearanceLarge"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/txt_showTime"
android:textColor = "@android:color/black" />
<Button
android:text = "Set Time"
android:layout_width = "200dp"
android:layout_height = "wrap_content"
android:id = "@+id/btnSetTime"
android:textColor = "@android:color/black"
android:background = "@android:color/holo_green_dark" />
</LinearLayout>转到 MainActivity.cs 来添加将设置日期显示在创建的文本视图上的功能。
public class MainActivity : Activity {
private TextView showCurrentTime;
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
TimePicker Tpicker = FindViewById<TimePicker>(Resource.Id.timePicker1);
showCurrentTime = FindViewById<TextView>(Resource.Id.txt_showTime);
setCurrentTime();
Button button = FindViewById<Button>(Resource.Id.btnSetTime);
button.Click += delegate {
showCurrentTime.Text = String.Format("{0}:{1}",
Tpicker.CurrentHour, Tpicker.CurrentMinute);
};
}
private void setCurrentTime() {
string time = string.Format("{0}",
DateTime.Now.ToString("HH:mm").PadLeft(2, '0'));
showCurrentTime.Text = time;
}
}在上面的代码中，我们首先通过 FindViewById<> 类引用 timepicker 、 set time 按钮和文本视图以显示时间。然后，我们为“设置时间”按钮创建了一个单击事件，该事件会在单击时将时间设置为某人选择的时间。默认情况下，它显示当前系统时间。
setCurrentTime() 方法类初始化 txt_showTime textview 显示当前时间。
现在，构建并运行您的应用程序。它应显示以下输出 −
Spinner
旋钮是用来自一组中选择一个选项的小部件。它相当于一个下拉框/组合框。首先，创建一个新项目并称其为 Spinner App Tutorial 。
在 layout folder 下打开 Main.axml 并创建一个 spinner 。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<Spinner
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/spinner1"
android:prompt = "@string/daysOfWeek" />
</LinearLayout>打开 values folder 中 Strings.xml 文件，并添加以下代码来创建 spinner items 。
<resources>
<string name = "daysOfWeek">Choose a planet</string>
<string-array name = "days_array">
<item>Sunday</item>
<item>Monday</item>
<item>Tuesday</item>
<item>Wednesday</item>
<item>Thursday</item>
<item>Friday</item>
<item>Saturday</item>
<item>Sunday</item>
</string-array>
</resources>接下来，打开 MainActivity.cs 以添加用于显示已选星期的功能。
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
// Set our view from the "main" layout resource
SetContentView(Resource.Layout.Main);
Spinner spinnerDays = FindViewById<Spinner>(Resource.Id.spinner1);
spinnerDays.ItemSelected += new EventHandler
<AdapterView.ItemSelectedEventArgs>(SelectedDay);
var adapter = ArrayAdapter.CreateFromResource(this,
Resource.Array.days_array, Android.Resource.Layout.SimpleSpinnerItem);
adapter.SetDropDownViewResource(Android.Resource.Layout.SimpleSpinnerDropD ownItem);
spinnerDays.Adapter = adapter;
}
private void SelectedDay(object sender, AdapterView.ItemSelectedEventArgs e) {
Spinner spinner = (Spinner)sender;
string toast = string.Format("The selected
day is {0}", spinner.GetItemAtPosition(e.Position));
Toast.MakeText(this, toast, ToastLength.Long).Show();
}现在，构建并运行此应用程序。它应显示以下输出 −
在上述代码中，我们引用了 main.axml 文件中创建的旋钮，方法是通过 FindViewById<> 类。然后，我们创建了一个 arrayAdapter() ，该类用于绑定 strings.xml 类的数组项。
最后，我们创建了 SelectedDay() 方法，该类用于显示已选星期。
Xamarin - Android Dialogs
Alert Dialog
在本节中，我们将创建一个按钮，单击后显示一个警示对话框。对话框包含两个按钮，即 Delete 和 Cancel 按钮。
首先，转至 main.axml 并创建线性布局内的按钮，如下面的代码所示。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:background = "#d3d3d3"
android:layout_height = "fill_parent">
<Button
android:id="@+id/MyButton"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "Click to Delete"
android:textColor = "@android:color/background_dark"
android:background = "@android:color/holo_green_dark" />
</LinearLayout>接下来，打开 MainActivity.cs 来创建警示对话框并添加其功能。
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
Button button = FindViewById<Button>(Resource.Id.MyButton);
button.Click += delegate {
AlertDialog.Builder alertDiag = new AlertDialog.Builder(this);
alertDiag.SetTitle("Confirm delete");
alertDiag.SetMessage("Once deleted the move cannot be undone");
alertDiag.SetPositiveButton("Delete", (senderAlert, args) => {
Toast.MakeText(this, "Deleted", ToastLength.Short).Show();
});
alertDiag.SetNegativeButton("Cancel", (senderAlert, args) => {
alertDiag.Dispose();
});
Dialog diag = alertDiag.Create();
diag.Show();
};
}完成后，构建并运行你的应用程序来查看输出。
在上面的代码中，我们创建了一个称为 alertDiag 的警报对话框，它具有以下两个按钮 -
-
setPositiveButton - 它包含 Delete 按钮操作，单击后会显示确认消息 Deleted 。
-
setNegativeButton - 它包含一个 Cancel 按钮，单击该按钮会直接关闭警报对话框。
Xamarin - Gallery
库房是一种用来显示水平可滚动列表中项的视图类型。然后，选定项目就会显示在中心。在此示例中，您将创建一个包含水平可滚动图像的库房。单击图像后，将显示选定图像的数字。
首先，创建一个项目并指定一个名称，例如“库房应用程序教程”。在您开始编码前，将图片粘贴到 resource /drawable folder 中。导航到 resources folder 中的 main.axml ，以及线性布局标记之间的库房。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#d3d3d3">
<Gallery
android:id="@+id/gallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dp" />
</LinearLayout>创建一个名为 ImageAdapter 的新类。此类将用于将图像绑定到我们在上面创建的库房中。
第一步是添加一个类，其中包含我们用于存储字段的 cont 上下文。
public class ImageAdapter : BaseAdapter {
Context cont;
public ImageAdapter(Context ct) {
cont = ct;
}
}接下来，我们计算图像数组，并返回其大小。
public override int Count {
get {
return imageArraylist.Length;
}
}在下一步中，我们获取项目的坐标。以下代码演示了如何执行此操作。
public override Java.Lang.Object GetItem(int position) {
return null;
}
public override long GetItemId(int position) {
return 0;
}在下一步中，我们创建 imageview ，用于适配器引用的项目。
public override View GetView(int position,View convertView, ViewGroup parent) {
ImageView img = new ImageView(cont);
img.SetImageResource(imageArraylist[position]);
img.SetScaleType(ImageView.ScaleType.FitXy);
img.LayoutParameters = new Gallery.LayoutParams(200, 100);
return img;
}在最后一步中，我们创建 resources.drawable 文件夹中添加的图像引用。为执行此操作，我们创建一个存储图库的数组。以下代码说明了如何执行此操作。
int[] imageArraylist = {
Resource.Drawable.img1,
Resource.Drawable.img2,
Resource.Drawable.img3,
Resource.Drawable.img4,
Resource.Drawable.img5,
Resource.Drawable.img6,
};
}接下来，我们转到 mainActivity.cs 并在 OnCreate() 方法下插入以下代码。
Gallery myGallery = (Gallery)FindViewById<Gallery>(Resource.Id.gallery);
myGallery.Adapter = new ImageAdapter(this);
myGallery.ItemClick += delegate(object sender, AdapterView.ItemClickEventArgs args) {
Toast.MakeText(this,
args.Position.ToString(), ToastLength.Short).Show();
}最后，构建并运行应用程序来查看输出。
Xamarin - Andriod Views
ListViews
列表视图是显示可滚动项目列表的用户界面元素。
Binding data to listviews
在此示例中，您将创建用于显示一周日期的 listView。首先，让我们创建一个新的 XML 文件，并将其命名为 listViewTemplate.xml 。
在 listViewTemplate.xml 中，我们添加一个新的 textview，如下所示。
<?xml version = "1.0" encoding = "utf-8" ?>
<TextView xmlns:android = "http://schemas.android.com/apk/res/android"
android:id = "@+id/textItem"
android:textSize ="20sp"
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"/>接下来，转到 Main.axml 并在线性布局内创建一个新的 listview。
<ListView
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/listView1" />打开 MainActivity.cs 并输入以下代码以将数据绑定到我们创建的 listview。该代码必须写在 OnCreate() 方法中。
SetContentView(Resource.Layout.Main);
var listView = FindViewById<ListView>(Resource.Id.listView1);
var data = new string[] {
"Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"
};
listView.Adapter = new ArrayAdapter(this, Resource.Layout.ListViewTemplate, data);Var data = new string[] 只是以数组形式保存我们的项目。
数组适配器将我们集合中的项目作为视图返回。默认情况下，数组适配器使用默认的 textView 来显示每个项目。在上述代码中，我们在 ListViewTemplate.xml 中创建了自己的 textview 并使用下所示的构造函数引用它。
ArrayAdapter(this, Resource.Layout.ListViewTemplate, data);最后，构建并运行应用程序来查看输出。
GridViews
网格视图是允许应用程序以二维方式布置内容的可滚动网格视图组。
要添加网格视图，请创建一个新项目并将其称为 gridViewApp 。转至 Main.axml 并按如下所示添加一个网格。
<?xml version = "1.0" encoding="utf-8"?>
<GridView xmlns:android = "http://schemas.android.com/apk/res/android"
android:id = "@+id/gridview"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
android:columnWidth = "90dp"
android:numColumns = "auto_fit"
android:verticalSpacing = "10dp"
android:horizontalSpacing = "10dp"
android:stretchMode = "columnWidth"
android:gravity = "center" />接下来，创建一个新类并将其命名为 ImageAdpter.cs 。此类将包含所有将在网格中显示的项目的适配器类。
在 ImageAdapter 中，添加以下代码 −
public class ImageAdapter : BaseAdapter {
Context context;
public ImageAdapter(Context ch) {
context = ch;
}
public override int Count {
get {
return cars.Length;
}
}
public override long GetItemId(int position) {
return 0;
}
public override Java.Lang.Object GetItem(int position) {
return null;
}
public override View GetView(int position,
View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
imageView = new ImageView(context);
imageView.LayoutParameters = new GridView.LayoutParams(100, 100);
imageView.SetScaleType(ImageView.ScaleType.CenterCrop);
imageView.SetPadding(8, 8, 8, 8);
} else {
imageView = (ImageView)convertView;
}
imageView.SetImageResource(cars[position]);
return imageView;
}
int[] cars = {
Resource.Drawable.img1, Resource.Drawable.img2,
Resource.Drawable.img3, Resource.Drawable.img4,
Resource.Drawable.img5, Resource.Drawable.img6,
};
}在上述代码中，我们只是将汽车图片绑定到了图像适配器。接下来，打开 MainActivity.cs 并在 setContentView() 后添加以下代码。
var gridview = FindViewById<GridView>(Resource.Id.gridview);
gridview.Adapter = new ImageAdapter(this);
gridview.ItemClick += delegate(object sender,
AdapterView.ItemClickEventArgs args) {
Toast.MakeText(this,
args.Position.ToString(), ToastLength.Short).Show();
};上述代码在 main.axml 中找到网格视图，并将其绑定到 imageAdapter 类。 Gridview.ItemClick 创建一个 onClick 事件，当用户单击某个图像时，该事件会返回所选图像的位置。
现在，构建并运行您的应用程序以查看输出。
Xamarin - Multiscreen App
在本章中，我们将创建一个允许用户注册的登录系统。然后，我们将在成功登录后将注册用户带到我们的应用程序的主屏幕。
首先，创建一个新项目并将其命名为 Login System 。在您的新项目中，转到 main.axml 并添加两个按钮和一个进度条，如下所示。
<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
android:background = "@android:color/background_light"
android:weightSum = "100"
android:minWidth = "25px"
android:minHeight = "25px">
<TextView
android:text = "Login App"
android:textAppearance = "?android:attr/textAppearanceMedium"
android:layout_width = "match_parent"
android:layout_weight = "20"
android:layout_height = "0dp"
android:textColor = "#368DEB"
android:id = "@+id/txtCreatAccount"
android:gravity = "center"
android:textStyle = "bold"
android:textSize = "25sp" />
<Button
android:text = "Sign In"
android:layout_width = "match_parent"
android:layout_weight = "15"
android:layout_height = "0dp"
android:background = "@drawable/btnSignInStyle"
android:id = "@+id/btnSignIn"
android:layout_marginLeft = "20dp"
android:layout_marginRight = "20dp"
android:textSize = "15sp" />
<Button
android:text = "Sign Up"
android:layout_width = "match_parent"
android:layout_weight = "15"
android:layout_height = "0dp"
android:background = "@drawable/btnSignUpStyle"
android:id = "@+id/btnSignUp"
android:layout_marginLeft = "20dp"
android:layout_marginRight = "20dp"
android:textSize = "15sp" />
<RelativeLayout
android:layout_width = "match_parent"
android:layout_height = "0dp"
android:layout_weight = "50"
android:minWidth = "25px"
android:minHeight = "25px">
<ProgressBar
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:id = "@+id/progressBar1"
android:background = "@drawable/progressBarStyle"
android:layout_centerInParent="true"
android:indeterminate = "true"
xmlns:tools = "
http://schemas.android.com/tools"
tools:visibility = "invisible" />
</RelativeLayout>
</LinearLayout>在创建用户界面后，重要的是对按钮进行样式化以使它们看起来更具吸引力。为此，在 drawable folder 下创建一个新的 XML 文件并将文件命名为 btnSignInStyle.xml 。
在 XML 文件中，添加以下代码行。
<selector xmlns:android = "http://schemas.android.com/apk/res/android">
<item android:state_pressed = "false">
<layer-list>
<item android:right = "5dp" android:top = "5dp">
<shape>
<corners android:radius = "2dp"/>
<solid android:color = "#D6D6D6"/>
</shape>
</item>
<item android:left = "2dp" android:bottom = "2dp">
<shape>
<corners android:radius = "4dp"/>
<gradient android:angle = "270"
android:endColor = "#486EA9" android:startColor = "#486EA9"/>
<stroke android:width = "1dp" android:color = "#BABABA"/>
<padding android:bottom = "10dp"
android:right = "10dp" android:left = "10dp" android:top = "10dp"/>
</shape>
</item>
</layer-list>
</item>
<item android:state_pressed = "true">
<layer-list>
<item android:right = "5dp" android:top = "5dp">
<shape>
<corners android:radius = "2dp"/>
<solid android:color = "#D6D6D6"/>
</shape>
</item>
<item android:left = "2dp" android:bottom = "2dp">
<shape>
<corners android:radius = "4dp"/>
<gradient android:angle = "270"
android:endColor = "#79C791" android:startColor = "#486EA9"/>
<stroke android:radius = "4dp" android:color = "#BABABA"/>
<padding android:bottom = "10dp"
android:right = "10dp" android:left = "10dp" android:top = "10dp"/>
</shape>
</item>
</layer-list>
</item>
</selector>以上代码在加载时设置按钮的颜色并在单击时设置按钮的边框半径。
接下来，我们为 signup 按钮创建一个与上面类似的样式 XML。为此，在 drawable 文件夹下创建另一个 XML 称之为 btnSignUpStyle.xml 。它将继承 btnSignInStyle.xml 中的一切。唯一的区别是按钮的渐变起始和结束颜色。
在 btnSignUpStyle.xml 中将 startColor 和 endColor 更改为
<gradient android:angle="270"
android:endColor="#008000" android:startColor="#008000"/>转到 layout folder 并创建新的 AXML 文件，称之为 registerDailog.axml。此文件将包含我们应用程序中新用户的注册详细信息。该页面将包含三个 EditTexts 和一个用于提交数据的按钮。在您的线性布局代码中添加以下代码。
<EditText
android:layout_width = "match_parent"
android:layout_marginBottom = "10dp"
android:layout_marginTop = "25dp"
android:layout_marginRight = "25dp"
android:layout_marginLeft = "25dp"
android:layout_height = "35dp"
android:paddingLeft = "10dp"
android:id = "@+id/txtUsername"
android:hint = "Username"
android:textColor = "#000" />
<EditText
android:layout_width = "match_parent"
android:layout_height = "35dp"
android:id = "@+id/txtEmail"
android:layout_marginBottom = "10dp"
android:layout_marginTop = "25dp"
android:layout_marginRight = "25dp"
android:layout_marginLeft = "25dp"
android:paddingLeft = "10dp"
android:textColor = "#000"
android:hint = "Email" />
<EditText
android:layout_width = "match_parent"
android:layout_height = "35dp"
android:layout_marginBottom = "10dp"
android:layout_marginTop = "25dp"
android:layout_marginRight = "25dp"
android:layout_marginLeft = "25dp"
android:paddingLeft = "10dp"
android:textColor = "#000"
android:id = "@+id/txtPassword"
android:hint = "Password" />
<Button
android:text = "Sign Up"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/btnSave"
android:textSize = "20dp"
android:textColor = "#fff"
android:textStyle = "bold"
android:height = "70dp"
android:background = "@drawable/btnSignUpStyle"
android:paddingLeft = "5dp"
android:paddingRight = "5dp"
android:paddingTop = "5dp"
android:paddingBottom = "5dp"
android:layout_marginLeft = "25dp"
android:layout_marginRight = "25dp"
android:layout_centerHorizontal = "true" />接下来，添加一个名为 signUpDialog.cs 的新类。此类将包含创建对话框所需的代码。以下示例显示了该代码。
public class OnSignUpEvent:EventArgs {
private string myUserName;
private string myEmail;
private string myPassword;
public string UserName {
get {
return myUserName;
}
set{
myUserName = value;
}
}
public string Email {
get {
return myEmail;
}
set {
myEmail = value;
}
}
public string Password {
get {
return myPassword;
}
set {
myPassword = value;
}
}
public OnSignUpEvent(string username, string
email, string password):base() {
UserName = username;
Email = email;
Password = password;
}
class SignUpDialog:DialogFragment {
private EditText txtUsername;
private EditText txtEmail;
private EditText txtPassword;
private Button btnSaveSignUp;
public event EventHandler<OnSignUpEvent> onSignUpComplete;
public override View OnCreateView(LayoutInflater inflater,
ViewGroup container, Bundle savedInstanceState) {
base.OnCreateView(inflater, container, savedInstanceState);
var view = inflater.Inflate(Resource.Layout.registerDialog, container, false);
txtUsername = view.FindViewById<EditText>(Resource.Id.txtUsername);
txtEmail = view.FindViewById<EditText>(Resource.Id.txtEmail);
txtPassword = view.FindViewById<EditText>(Resource.Id.txtPassword);
btnSaveSignUp = view.FindViewById<Button>(Resource.Id.btnSave);
btnSaveSignUp.Click += btnSaveSignUp_Click;
return view;
}
void btnSaveSignUp_Click(object sender, EventArgs e) {
onSignUpComplete.Invoke(this, new OnSignUpEvent(txtUsername.Text,
txtEmail.Text, txtPassword.Text));
this.Dismiss();
}
}
}在以上代码中，我们使用了 get 和 set 属性。 get 方法返回一个变量，而 set 方法将某个值指定给返回的变量。以下是一个示例：
public string Color {
get {
return color;
}
set {
color = value;
}
}在我们的前一个示例中，我们创建了一个覆盖视图的方法。在该方法内，我们创建了一个名为 view 的 var ，它引用了布局文件夹中包含的 registerDialog.axml 。
接下来，转到 mainActivity.cs 来创建对话框片段。
private Button signUp;
private Button submitNewUser;
private EditText txtUsername;
private EditText txtEmail;
private EditText txtPassword;
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
signUp = FindViewById<Button>(Resource.Id.btnSignUp);
submitNewUser = FindViewById<Button>(Resource.Id.btnSave);
txtUsername = FindViewById<EditText>(Resource.Id.txtUsername);
txtEmail = FindViewById<EditText>(Resource.Id.txtEmail);
txtPassword = FindViewById<EditText>(Resource.Id.txtPassword);
signUp.Click += (object sender, EventArgs args) => {
FragmentTransaction transFrag = FragmentManager.BeginTransaction();
SignUpDialog diagSignUp = new SignUpDialog();
diagSignUp.Show(transFrag, "Fragment Dialog");
diagSignUp.onSignUpComplete += diagSignUp_onSignUpComplete;
};
}
void diagSignUp_onSignUpComplete(object sender, OnSignUpEvent e) {
StartActivity(typeof(Activity2));
}上方的代码包含一个按钮点击事件，当点击时，加载注册对话框。在按钮点击内部，我们创建了一个 SignUpDialog 类来加载 registerDialog.axml 文件。
然后我们使用 FragmentTransaction transFrag = FragmentManager.BeginTransaction(); 来将我们的 registerDialog 页面显示为 Android 对话片段。
我们将添加另一个名为 home.axml 的 .axml 文件。一旦用户成功登录系统，此布局将成为登陆界面。在此布局中，我们将添加一个文本视图，如下面的代码所示。
<TextView
android:text = "You have been succesfully registered. Welcome!"
android:textAppearance = "?android:attr/textAppearanceLarge"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/textView1" />接下来，我们创建一个名为 Activity2.cs 的最终活动。在这个活动中，我们将使用 findViewById 查找 home.axml 。
最后，构建并运行你的 App。它将显示以下屏幕作为输出。
Xamarin - Deploying Your App
在完成构建您的应用的过程后，将其用于物理 Android 设备或允许其他人下载您的应用并将其安装到其设备上非常重要。
Releasing Your App
在发布您的应用之前，务必将其转换为 Android 系统可以读取的格式。这种格式称为 apk file 。要创建一个 apk file 。
-
Open your project.
-
转到 Build Menu 并选择 Configuration Manager
-
在配置管理器中，将 Active Solution Configuration 设置为释放应用。
接下来，再次单击 Build Menu 并选择 Export Android Package(.apk) 。
完成后， apk 文件将存储在项目文件夹 /bin/Release 中。
