《ASP NET 3.5从基础到项目实战》课件第13章创建基于移动设备的Web程序.ppt

1、 ASP.NET平台不仅可以开发Windows、Web应用程序，还可以开发专用于移动设备使用的应用程序。使用ASP.NET来开发移动Web应用程序和开发普通Web应用程序没有太大的区别。在.NET框架集中提供的System.Web.Mobile命名空间是专门用来开发移动Web应用程序的。本章主要讲解使用ASP.NET开发移动Web应用程序的基础知识和常用控件。13.1移动Web窗体语法 13.2标准控件 13.3高级控件13.1 移动Web窗体语法 使用ASP.NET创建移动Web窗体与创建普通的Web窗体类似，开发人员可以直接从模板中添加，其添加方法也与添加普通的Web窗体相同。13.1.1

2、 在VS2008中添加移动窗体模板VS2008没有直接提供“移动Web窗体”模板，如图13-1所示。图13-1 添加新项13.1.1 在VS2008中添加移动窗体模板对于在VS2008中没有提供“移动Web窗体”模板，这确实很令人疑惑。网上的说法是：据Microsoft Visual Web Developer的团队项目经理Omar Khan的说法，这是因为Visual Studio 2008中的设计视图是基于一个全新的架构设计的，所以暂时这一部分模板还没有跟上，所以ASP.NET mobile controls并不能显示。13.1.2 创建移动Web窗体在完成移动Web窗体创建的准备工作之后

3、，就可以使用VS2008来创建移动Web窗体了。在创建移动Web窗体之前，首先需要来创建一个网站项目。这里的网站项目创建方法与创建普通的Web网站相同。首先打开VS2008，单击“文件”“新建”“网站”命令，如图13-2所示，弹出如图13-3所示的“新建网站”窗口。13.1.2 创建移动Web窗体图13-2 新建网站13.1.2 创建移动Web窗体图13-3“新建网站”窗口13.1.2 创建移动Web窗体网站项目创建成功之后，就可以向网站中添加“移动Web窗体”了，其添加方法和添加普通的Web窗体一样，在解决方案资源管理器中，右击网站名称，在右键菜单中单击“添加新项”命令，这时会打开图13-4

4、所示的“添加新项”窗口。13.1.2 创建移动Web窗体图13-11 “添加新项”窗口13.1.2 创建移动Web窗体选择“我的模板”中的“移动Web窗体”选项，然后在下面的“名称”文本框中为新建的窗体命名，这里使用默认的名称Default.aspx，单击“添加”按钮，即可向网站项目中添加一个新的移动Web窗体。13.1.3 在仿真程序中呈现在移动Web窗体创建成功之后，就需要对已经创建的移动Web窗体进行调试，以检验程序设计的效果如何。在VS2008中提供了“设备仿真管理器”，来实现虚拟手机模拟功能，当然，读者也可使用智能手机对已经建立的程序进行测试。往往在实际开发过程中为了节省成本，会使用

5、“设备仿真管理器”来对程序进行检测。读者可以在“工具”菜单中找到“设备仿真管理器”，单击“设备仿真管理器”选项，即可打开“设备仿真管理器”窗口，如图13-5所示。13.1.3 在仿真程序中呈现图13-5 设备仿真管理器 13.1.3 在仿真程序中呈现读者可以从“设备仿真管理器”列表中任选一款模拟器来模拟手机调试Web程序。在这里选择“Windows Mobile 5.0 Pocket PC SDK”选项下的“CHS Windows Mobile 5.0 Pocket PC R2 Emulator”作为测试模拟器。右击这一模拟器，在右键菜单中单击“连接”命令，这时会打开图13-6所示的模拟器界面

6、。13.1.3 在仿真程序中呈现图13-6 模拟器界面 13.1.3 在仿真程序中呈现模拟器运行之后，在“设备仿真管理器”选中已经运行的模拟器，右击，在右键菜单中单击“插入底座”命令，这时就可以使用ActiveSync进行连接。打开ActiveSync，然后单击“文件”菜单中的“连接设置”命令，会打开图13-7所示的“连接设置”窗口，然后单击“连接”按钮，会打开图13-8所示的“进行连接”窗口，这时ActiveSync正在与模拟器进行连接。13.1.3 在仿真程序中呈现13-7 “连接设置”窗口 13.1.3 在仿真程序中呈现13-8 “进行连接”窗口 13.1.3 在仿真程序中呈现当Acti

7、veSync与模拟器连接成功之后，会在图13-9中出现“移动设备已连接”的提示。单击“确定”按钮之后，ActiveSync界面会提示“已连接”的字样，如图13-10所示。13.1.3 在仿真程序中呈现图13-9 “移动设备已连接”提示 13.1.3 在仿真程序中呈现图13-10 “已连接”提示 13.1.3 在仿真程序中呈现这时就可以在模拟器的IE浏览器中，输入需要测试的移动Web窗体地址来进行测试，如图13-11所示向模拟器的IE浏览器中输入测试地址。单击IE地址栏的“转到”图标，测试结果如图13-12所示。13.1.3 在仿真程序中呈现图13-11 在模拟器中输入测试地址 13.1.3 在

8、仿真程序中呈现图13-12 测试结果 13.2 标准控件用于开发移动Web窗体的控件与开发普通Web窗体的服务器控件相对应，都是在服务器端进行解析，同时也必须带有runat=server的标记，这些控件经过处理后会生成客户端呈现代码发送到客户端。13.2.1 Form控件在移动Web窗体中，Form控件的定义格式如下。而在普通的Web窗体中是没有mobile标志的，在移动Web窗体中，Form控件同样具有Name、Method、Action、Enctype和target属性，它们所表述的意义与普通Web窗体中表述的意义是相同的。13.2.2 Panel控件在移动Web窗体中，Panel控件用来

9、作为控件的容器使用，可以将其他的服务器控件装载到其内部。Panel控件可以对其内部的所有控件做整体的控制，如当Panel控件为隐藏状态时，其内部的所有控件都处于隐藏状态，这样就为程序的灵活性提供了可靠的保证。在移动Web窗体中，Panel控件的HTML代码显示如下。13.2.3 用户输入控件在移动Web窗体开发过程中，用来作为用户输入的控件是TextBox控件。TextBox控件既可以作为普通的用户输入控件，也可以作为密码控件使用。下面是TextBox控件的两种使用状态，如图13-13和图13-14所示。13.2.3 用户输入控件图13-13 作为普通控件图13-14 作为密码控件13.2.3

10、 用户输入控件TextBox控件的常用属性 属性描述MaxLength用于设置TextBox控件最多可接收的列数BackColor用于设置TextBox控件的背景色Font用于设置TextBox控件的字体样式Visible用于设置TextBox控件的可见状态Password用于设置TextBox控件的显示模式13.2.4 列表控件列表控件可以同时显示很多数据项，以方便用户做相应的选择，常用的列表控件包括SelectionList、List、ObjectList。本节主要讲解SelectionList控件的使用方法，其他列表的使用方法与它类似，读者可以参照SelectionList控件的使用方法

11、来学习其他列表控件的使用方法。13.3 高级控件在.NET框架中还为移动Web窗体提供了高级服务器控件，这些控件对ASP.NET开发移动Web应用程序具有重要意义。它们的使用方法并不难，之所以称之为高级服务器控件，是因为这些控件封装了大量的功能，仅仅一个控件就可以实现在传统开发中多个控件才能实现的功能，对于提高程序开发的质量和速度具有重要的意义。13.3.1 AdRotator控件广告是网站收入的重要部分，特别是一些电子商务类网站，在移动Web开发中，ASP.NET也提供了相应的广告开发控件，它就是AdRotator控件。AdRotator控件使用XML文件作为数据源，将XML文档中配置好的广

12、告信息呈现到客户端。13.3.1 AdRotator控件AdRotator控件的常用属性属性描述AdvertisementFile指定包含广告信息的XML文件路径Alignment指定空间的对齐方式BackColor指定空间的背景色ForeColor指定空间的前景色Font-Bold指定控件中的文本字体是否以粗体显示Font-Italic指定控件中的文本字体是否以斜体显示Font-Name指定空间中的文本字体名称Font-Size指定空间中的文本字体尺寸ImageKey指定获取图像URL的广告名称KeywordFilter指定限制目录之后广告的过滤器NavigateUrlKey指定获取目标UR

13、L的广告元素名称OnAdCreated指定在提交页面之前、创建控件之后所要执行的函数名称StyleReference指定一个应用于控件的样式参数13.3.2 Image控件.NET框架中为移动Web窗体提供了Image控件，此控件主要用来在客户端显示图片，Image控件在移动Web设计中具有重要的作用，它不仅可以起到美化界面的作用，同时也可以作为动态的广告位来呈现。另外Image控件还有许多重要的属性来辅助它实现更多的功能。13.3.2 Image控件Image控件的常用属性属性描述AlternateText指定图像所对应的替换文本Alignment指定图像的排列方式BackColor指定图像

14、的背景色ImageUrl指定图像的URLNavigateUrl设置或返回目标URL链接SoftkeyLabel当NavigateURL属性被定义时，设置或返回一个软键softkey的文本显示StyleReference指定一个应用于控件的样式参数13.3.3 Calendar控件在移动Web窗体中，Calendar控件的使用方法非常简单，同时与普通Web应用程序中的Calendar控件极为类似。13.3.3 Calendar控件Calendar控件的常用属性属性描述Alignment指定控件的排列方式BackColor指定控件的背景色CalendarEntryText向Calendar控件中输

15、入在CHTML 和 WML设备中使用的文本 FirstDayOfWeek指定在第一列中显示星期几。如果该属性设置为“default”，那么它将自动使用服务器本地属性设置来确定在第一列中显示星期几ForeColor指定控件的前景色Font-Bold指定控件中的文本字体是否以粗体显示Font-Italic指定控件中的文本字体是否以斜体显示Font-Name指定控件中的文本字体名称Font-Size指定控件中的文本字体尺寸SelectedDate指定当前可选择的日期，默认值为今天的日期SelectionMode指定用户选择日期的方式，默认值为“日”。如果想屏蔽这个功能，可以将其属性设置为NoneShowDayHeader指定是否需要在日历头部显示星期几的名称，默认值为trueStyleReference指定一个应用于控件的样式参数VisibleDate指定显示月份的日期Wrapping指定控件中的文本是否允许被嵌套