总目录
前言
本文介绍控件：
一、控件概述
二、Label
三、Image
四、BoxView
五、WebView
环境
1.Visual Studio 2017
2.Xamarin.Froms 4.0.0.8055-pre1
3.Android 4.4(API 19)或更高版本
4.约定：XF代表Xamarin.Forms
内容
一、控件概述
控件(Control)是构建界面的基础元素，通常有以下几种类型：
1.显示型控件：
Label：显示文本，可单行或多行显示；
Image：显示图像；
BoxView：显示矩形；
WebView：显示Web和Html内容；
2.命令型控件
Button：可触发点击事件；
ImageButton：带图片的Button，可触发点击事件；
SearchBar：搜索条，可提供用户搜索功能；
3.设置型控件
Slider：滑动条；
Stepper：步进器；
Switch：开关；
DatePicker：日期选择器；
TimePicker：时间选择器；
4.编辑型控件
Entry：文本框，输入或编辑单行文本；
Editor：编辑器，输入或编辑多行文本；
5.状态型控件
ActivityIndicator：活动指示器，一个转圈圈动画的控件；
ProgressBar：进度条；
6.集合型控件
Picker：选取器，提供一个供选择的列表；
ListView：集合列表；
TableView：表控件，它允许每行显示不同模板的内容，而ListView所有行的模板相同。
显示型控件
二、Label
Label：显示文本，可以调整文本样式。
实现效果
Xaml方式
1.TextDecorations：文本修饰，其属性值为：
- None：无修饰(默认值)；
- Underline：下划线；
- Strikethrough：删除线。
2.FontSize：字体大小，可设置固定值。也可以使用XF内置属性值，XF会根据不同平台选择最佳大小：
- Default：默认；
- Micro：微小；
- Small：小；
- Medium：中；
- Large：大；
3.FontAttributes：字体样式，其属性值为：
- None：无(默认值)；
- Bold：粗体；
- Italic：斜体；
4.TextColor：设置字体颜色。
- 16 进制，例如："#000000"；
- 系统内置，例如："Orange"
5.LineBreakMode：行截断模式，其属性值为：
- NoWrap：不换行；
- WordWrap：按单词换行(默认值)；
- CharacterWrap：按字符换行；
- HeadTruncation：断头，即：显示尾部，头部显示省略号...；
- TailTruncation：断尾，即：显示头部，尾部显示省略号...；
- MiddleTruncation：断中间，即：显示头尾内容，中间显示省略号...。
6.MaxLines：设置可以显示的最行数。
7.FormattedText：格式化文本，由多个Span组成。
C#方式
三、Image
Image：显示图片。
注：需要在不同平台不同分辨率下分别放置图片，本例以Android为例，有以下图片：
实现效果
Xaml
Image有以下重要属性：
1.Source：图片来源，来源有以下几种：
- File：资源文件，如本例所示；
- Uri：网络，例如：Source = "https://server.com/img.jpg";
- Resource：嵌入到应用或类库中的文件，需将图片的生成操作设为：EmbeddedResource；
- Stream：来自图像流；
2.Aspect：图片显示方式，即，如何调整图片的显示，有以下属性值：
- AspectFit：自适应(默认值);
- AspectFill：裁剪填充，超过区域会裁剪，只保留显示区域的图片，图像无扭曲；
- Fill：填充，图像完全填充显示区域，图像会扭曲；
C#方式
四、BoxView
BoxView：显示矩形。
实现效果
Xaml
1.BoxView有以下重要属性：
- Color：设置颜色；
- CornerRadius：设置圆角半径，可以将圆角半径设为正方形宽的一般画出圆形；
- WidthRequest：宽；
- HeightRequest：高。
2.注意：如果BoxView在一个没有约束的布局中，默认会以Fill的方式填充布局，例如：本例中布局Stacklayout没有设置水平约束，如果BoxView也不设置HorizontalOptions属性，那么横向将填充布局。如下图：
C#方式
五、WebView
WebView：显示Web和Html内容。
实现效果
Xaml
1.WebView支持以下内容类型：
- Html和Css网站，也支持JavaScript；
- 文档；
- Html字符串；
- 本地文件，例如：本地的html文件，css文件，图片等。
2.App混合开发：XF作壳，使用WebView显示已有的网页内容。
C#方式
后语
下篇介绍命令型控件，待续...
网友评论