C#安卓自学示例(5)工欲善其事必先利其器

设计器概述https://developer.xamarin.com/guides/android/user_interface/designer_overview/designer_walkthrough/
这篇文章涵盖 Xamarin.Android 设计器的功能。它涵盖了设计器的基础知识，展示如何使用设计器来直观地布置小部件以及如何编辑属性。它还演示如何使用设计器来处理用户界面和资源跨各种配置，如主题、 语言和设备配置，以及如何设计为像横向和纵向的布局。
概述
Xamarin.Android 支持基于 XML 的文件，以及在代码中创建方案的用户界面,这样用户界面设计的两种声明性的风格。
使用声明性方法时，XML 文件可以手工编辑或修改视觉上使用 Xamarin.Android 设计器。
使用设计器 UI 创建期间允许即时反馈，并使 UI 创作过程不太费力。

演练-使用 Android 的设计器
这篇文章是 Xamarin.Android 设计器演练。它演示如何创建一个小型彩色浏览器应用程序,此用户界面是完全在设计器中创建的。

让我们开始吧 ！
创建一个新项目
第一步是创建一个新的 Xamarin.Android 项目。
安卓的空白应用程序
启动 Visual Studio 并单击新项目......，然后选择 Visual C# > Android > 空白应用程序 (Android) 模板︰

命名新的应用程序 DesignerWalkthrough, 然后单击 ok。

添加布局
让我们创建线性布局，我们将使用保存的用户界面元素。
在 Visual Studio 中，资源/布局在解决方案资源管理器中用鼠标右键单击并选择添加 > 新项目......在添加新项对话框中，选择 Android 布局。命名文件 ListItem.axml，并单击添加:

在设计器中将显示新的 ListItem布局︰

请单击源选项卡底部的设计器以查看此布局的 XML源︰

创建列表项的用户界面

接下来，我们要创建颜色浏览器应用程序单击设计器选项卡以返回到设计表面的用户界面。在工具箱中，向下滚动到图像与媒体节和仔细阅读每个项目，直到你找到ImageView为止︰

可以将 ImageView进入搜索栏查找 ImageView部件︰

将这个 ImageView 拖到设计图面上︰

这个 ImageView 将用于在我们的颜色浏览器应用程序中显示的颜色色板。
接下来，拖动线性布局 （垂直） 部件从工具箱拖到设计器。请注意，蓝色的轮廓指示的边界添加线性布局，并且显示它驻留 imageView1 (ImageView)下方:

接下来，一个文本 （大） 小部件到新添加的线性布局从工具箱拖动。通知设计器使用绿色突出显示以指示将插入新的小部件的位置︰

接下来，添加小部件的文本 （小） 部件︰

到这里应类似于下面的屏幕快照︰

如果两个 textView 小部件不在 linearLayout1 内，可以将它们拖动到文档大纲中的 linearLayout1 和他们的位置，所以他们显示 （在 linearLayout1 下缩进） 上面的屏幕快照所示。

如果两个 textView 小部件不在 linearLayout1 内，可以将它们拖动到文档大纲中的 linearLayout1 和他们的位置，所以他们显示 （在 linearLayout1 下缩进） 上面的屏幕快照所示。
安排用户界面
让我们修改 UI 显示 ImageView 在左边，与堆积 ImageView 右侧的两个 TextView 小部件。
设置绕排内容
1.选择 ImageView。
2.在属性窗口中，单击按分类顺序排序图标和向下的滚动到布局-分组节。
3.将 layout_width 设置更改为 wrap_content:

形，对右手边的小部件来切换到 wrap_content 其宽度设置︰

再次单击该三角形返回宽度设置为 match_parent。

然后，选择根线性布局︰

返回到属性窗口，单击按字母顺序排序图标和滚动直到你找到方向。更改方向设置为横向︰

现在应类似于下面的屏幕快照︰

设置边距
接下来，我们将修改 UI 提供更多的空间，小部件之间的填充和边距设置。选择 ImageView，单击属性窗口中向下的滚动到布局部分的分类搜索图标。更改为 50dp 和填料添加到 10dp 的最小高度为 70dp，最小宽度。这适用 ImageView 四面八方周围的边距和垂直拉长它︰

底部，左，右，和顶级的填充设置可以通过进入 paddingBottom、 paddingLeft、 paddingRight 和 paddingTop 字段值上独立设置。例如，将 paddingLeft 字段 5dp 和 paddingBottom，paddingRight 和 paddingTop 字段设置为 10dp:

接下来，调整线性布局小部件包含两个 TextView 小部件的位置。在文档大纲，选择 linearLayout1。在属性窗口中，滚动到布局-分组一节。分别设置 layout_marginBottom、 layout_marginLeft、 layout_marginRight 和 layout_marginTop 为 5dp、 5dp、 0dp 和 5dp:

删除默认的图像
因为我们使用 ImageView 来显示颜色 （而不是图像），让我们删除添加的模板的默认图像源。
清除 ImageView src 设置
1.选择 ImageView。
2.在属性，找到的 src 字段。
3.清除 src 设置，以便它是空白︰

添加列表视图容器
既然定义了 ListItem 布局，我们会向主要布局中添加 ListView。此列表视图将包含列表的列表项目。在工具箱中，找到 ListView 控件并将它拖到设计图面上。列表视图设计器中的将显示为空白除了概述其边界，当它被选中的蓝色线条。您可以查看文档大纲，验证 ListView 已正确添加︰

这篇文章由于出现下面问题,无法继续转介了.

有人就说了,说你不花钱,不能怪人家出错了.不花钱自有我不花钱的理由,后续将凡是能运行的转介发布,希望有点用处.