“2021-07-02T14:19:59+08:00“时间格式的转化(两种方法)

方法1:(不是很推荐)

export function dateChangeFormat(format, date) {
  date = new Date(date);
  const dataItem = {
    'Y+': date.getFullYear().toString(),
    'm+': (date.getMonth() + 1).toString(),
    'd+': date.getDate().toString(),
    'H+': date.getHours().toString(),
    'M+': date.getMinutes().toString(),
    'S+': date.getSeconds().toString(),
  };
  Object.keys(dataItem).forEach((item) => {
    const ret = new RegExp(`(${item})`).exec(format);
    if (ret) {
      format = format.replace(ret[1], ret[1].length === 1 ? dataItem[item] : dataItem[item].padStart(ret[1].length, '0'));
    }
  });
  return format;
}


// 使用方式:

import { dateChangeFormat } from '对应路径';
dateChangeFormat('YYYY-mm-dd HH:MM:SS', "2021-07-02T14:19:59+08:00")

参考资料:https://blog.csdn.net/fanyanjiang/article/details/109514758

方法二(moment.js)

参考资料:http://momentjs.cn/docs/#/displaying/

import moment from 'moment';


moment('2021-07-02T14:19:59+08:00').format('YYYY-MM-DD HH:mm:ss')即可

  • 4
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ExtAspNet v2.2.1 ExtAspNet是一组专业的Asp.net控件库,拥有原生的AJAX支持和丰富的UI效果, 目标是创建没有JavaScript,没有CSS,没有UpdatePanel,没有WebServices的Web应用程序。 支持的浏览器: IE 7.0+, Firefox 3.0+, Chrome 2.0+, Opera 9.5+, Safari 3.0+ 注:ExtAspNet基于一些开源的程序ExtJS, HtmlAgilityPack, Nii.JSON, YUICompressor。 示例: http://extasp.net/ 开源: http://extaspnet.codeplex.com/ 博客: http://sanshi.cnblogs.com/ 邮箱: [email protected] 发布历史: +2010-03-28 v2.2.1 +为TabStrip的GetAddTabReference函数增加重载方法,以便指定Tab的图标(feedback:mmdcup)。 -修正此函数通过PageContext.RegisterStartupScript调用时不能正确显示Icon的BUG(feedback:zhaowenke)。 -修正basic/hello.aspx示例在单独浏览器打开后,不能弹出对话框的BUG。 -隐藏示例首页最外层RegionPanel的边框ShowBorder="false"。 +集成Extjs最新版本v3.1.1。 -增加一个新的Theme - Access。 -修正了Firefox下Zoom In/Out时页面消失的BUG。 -删除Panel的EnableLightBackgroundColor属性,同时EnableBackgroundColor只支持Blue和Gray两种Theme。 +2010-01-31 v2.2.0 -使得Asp.net的控件ImageButton具有和Asp.net的Button控件类似的行为(Ajax提交)(feedback:261629698)。 +TabStrip增加GetAddTabReference和GetRemoveTabReference两个函数,用来向TabStrip控件动态增加删除Tab。 -增加示例tabstrip/tabstrip_addtab.aspx。 -重构了示例网站的架构,目前只有一层IFrame结构。 -为TabStrip增加EnableTabCloseMenu属性,是否启用右键菜单,可用来关闭当前Tab和所有其他Tab。 -为NumberBox增加DecimalPrecision属性,用来控制小数点后的位数(需要设置NoDecimal="false")(feedback:zqmars)。 -Window控件更新。 -关闭按钮默认直接关闭,不会弹出确认对话框。 -GetConfirmFormModifiedHideReference的函数中的ConfirmFormModified简化为Confirm,所以此函数更名为GetConfirmHideReference。 -增加两个属性EnableConfirmOnClose(默认false),CloseAction(Hide, HideRefresh, HidePostBack)。 -修正EnableMaximize属性不能使Window最大化的BUG,修正了双击标题栏不能最大化的BUG。 -删除Button控件的SystemIcon属性,比如以前这样定义SystemIcon="Close",现在需要这样定义Icon="SystemClose"。 -WindowPosition默认居中,而不是黄金分割位置。 +Button, Window等控件弹出位置属性的变化。 -Window的Target属性由字符串类型变为枚举类型,注意更新以前的代码:Target="_self" -> Target="Self", Target="_parent" -> Target="Parent"。 -MenuButton, LinkButton, Button, LinkButtonField的ConfirmTarget属性由字符串变为枚举类型,可以取三个枚举值Self, Parent, Top。 -Confirm.GetShowReference的最后一个参数target变为枚举类型。 -Alert.GetShowReference中的showInParent参数也变为Target枚举类型。 -MenuButton, LinkButton, Button, LinkButtonField增加ValidateTarget用来控制表单验证失败时提示对话框的显示位置。 +2010-01-06 v2.1.9 -集成Extjs最新版本v3.1.0。 -修正灰色皮肤的CSS问题。 -修正Grid的列名中不能包含中文字符的BUG(feedback:davidwen)。 -为Web.config和PageManager增加属性AjaxTimeout(单位秒,默认30秒)。 -修正了在Grid的PageIndexChange事件中不能获取SelectedRowIndexArray属性的BUG(feedback:Violet)。 -Button控件将不再自动拥有display:inline属性,如果希望两个按钮在一行显示,请为第一个按钮设置CssStyle="float:left;"属性。 -修正了弹出菜单的位置在Firefox下不正确的BUG(feedback:eroach)。 -为TriggerBox和TwinTriggerBox增加EnableEdit属性。 -使用Hidden来显示隐藏ExtAspNet控件,而不是使用Visible属性(Visible目前设置为只读属性)。 -使用Hidden控制Window控件的显示隐藏,Popup已经标记为Obsolete属性。 -Window的实例方法GetCloseReference等以及ActiveWindow的静态方法GetCloseReference等,其中的Close全部改为Hide。 -增加TabStrip中Tab控件可关闭属性EnableClose(默认为false)以及两个方法GetShowReference和GetHideReference(feedback:anson)。 -修正绑定到Tree的XMLDocument中Icon属性映射错误(feedback:nopnop9)。 -修正HtmlEditor不能编辑的BUG(feedback:TheBox)。 -修正IE下有时会出现空白页面的情况(feedback:olivia919)。 +2009-12-06 v2.1.8 -修正了使用IFrame的Window关闭后不能再次打开的BUG(feedback:alexa99)。 -修正了IE下Grid中的一个JS问题(feedback:lqm4108)。 -修正Alert消息中引号未编码导致的JS错误(feedback:sun1299shine)。 +集成extjs3.0.3。 -修正弹出对话框的宽度计算错误(会保持最小的状态)。 -增加新的皮肤Gray。 -为示例工程添加改变语言和皮肤的下拉列表。 -为PageContext增加静态函数Refresh,在切换语言和皮肤时使用。 +2009-12-01 v2.1.7 -增加示例(iframe/parent_postback_run3.aspx),如何通过简单的Javascript代码回发父页面(feedback:eroach)。 -修正一些书写错误(feedback:bmck)。 -从Region控件中删除SplitColor属性,增加CollapseMode, EnableSplitTip, SplitTip, CollapsibleSplitTip属性(feedback:bmck)。 -BorderPanel更名为RegionPanel。 -DropDownList拥有MarkInvalid方法(feedback:sun1299shine)。 -增加中国的省市县三级联动示例(data/shengshixian.aspx)(feedback:Blues T)。 -修正了使用IFrameUrl的Tab在切换过程中会重复加载的问题,这是一个在v2.1.6引入的问题(feedback:eroach)。 -修正了启用AutoPostBack的Grid,其RowClick会覆盖LinkButtonField, HyperLinkField, CheckBoxField的点击事件(feedback:yymaoji)。 +2009-11-26 v2.1.6 +修正动态创建Grid列的BUG(feedback:gxpan)。 -增加示例(data/grid_dynamic_columns.aspx)。 -修正Form不能自适应浏览器大小的改变(feedback:kaywood)(WorkItem#6309)。 -增加重载方法Alert.Show(message, title, icon)(feedback:TheBox)(WorkItem#6353)。 -为容器控件(比如Panel,Region,Tab等)增加AJAX属性IFrameUrl(feedback:BluesT)。 -重新设计模拟树的下拉列表的实现,避免选中某项后的闪烁。 +2009-11-21 v2.1.5 +Tree优化。 -修正Expanded项和Checked项的状态在回发改变后不能保持的BUG。 -GetNodeById更名为FindNode,保持和FindControl一致命名。 -删除CheckedNodeIDArray属性,增加GetCheckedNodes和GetCheckedNodeIDs函数。 -删除ExpandedNodeIDArray属性,增加GetExpandedNodes和GetExpandedNodeIDs函数。 -增加示例(data/tree_select_run.aspx),如何选中当前节点的所有子节点(feedback:wjl_wjl520)。 +TreeNode的属性NodeId被重命名为NodeID,这是ExtAspNet中的一个命名约定。 -同时更名的还有GridColumn的ColumnId->ColumnID,GetColumnId->GetColumnID。 -Grid1.Columns.FindColumnById函数被Grid1.FindColumn所替代。 -为TreeCheckEventArgs,TreeExpandEventArgs,TreeCommandEventArgs增加Node属性。 -为所有控件增加Focus(覆盖Control默认的Focus函数)和GetFocusReference函数。 -增加示例(other/custom_postback.aspx)(feedback:thebox)。 -如何自定义Javascript脚本和C#处理函数来响应键盘事件。 -为Tree增加AutoLeafIdentification属性。 -增加示例(tree_auto_leaf_identification.aspx)(feedback:wdrabbit)。 +2009-11-17 v2.1.4 -修正Window的关闭按钮提示信息一直是中文的BUG(feedback:thebox)。 -部分ExtAspNet控件的设计时支持(会在后续版本中逐步完善)。 -v0.2beta2版本中关于PersistChildren(true)的描述有误,这个是设计时属性,和运行时是否保持状态没有关系。 -修正CheckBox控件的CheckedChanged事件会被触发两次的BUG(Data PostBack->AutoPostBack, Event PostBack->EnablePostBack)。 -为TextBox,TextArea,DatePicker,NumberBox,TriggerBox等控件增加AutoPostBack属性(feedback:dk3214)。 +为表单字段增加RequiredMessage,MaxLengthMessage,MinLengthMessage属性,用于指定验证失败时提示信息。 -为空则使用默认的提示信息,默认的提示信息支持多语言,建议一般情况下使用默认信息。 +为表单字段增加MarkInvalid和GetMarkInvalidReference函数(feedback:sun1299shine)。 -增加示例:form/form_validate.aspx +2009-10-19 v2.1.3 +增加支持在AJAX时改变的控件属性列表(/ajax.aspx)。 -ExtAspNet支持原生的AJAX,也就是说控件的属性改变在AJAX过程中会反映到页面中,但并不是所有的控件属性都支持AJAX改变。 -加载s.gif图片在本机进行,不会请求extjs.com远程资源(feedback:efrigate43,abaocoole)。 -在AJAX回发后确保Asp.net的按钮控件仍然具有AJAX的特性。 -更新/basic/login.aspx示例,使用验证图片(feedback:kedee)。 -为Grid增加AutoPostBack属性和RowClick事件,示例在/data/grid_autopostback.aspx(feedback:chenguizhu2006)。 -为所有的表单字段增加AJAX属性ReadOnly(feedback:skydb)。 -Grid中TemplateField生成到页面中控件具有唯一ID,例如Grid1_ct5_Label2,Grid1_ct6_Label2(feedback:geruger)。 +2009-09-27 v2.1.2 -为Tree控件增加GetExpandAllNodesReference和GetCollapseAllNodesReference两个函数。 -修正RELEASE版本下多语言加载的BUG(feedback:yigehaoren)。 -增加pt_BR语言,由Ujvari提供。 +为所有Panel(包括Grid,Tree,Form等)增加枚举类型Icon,其中包含1700多个小图标。 -如果Panel具有IconUrl属性,则IconUrl优先于Icon。 -所有Icon的列表在icon.aspx。 -为Button,MenuItem(MenuButton,MenuHyperLink),AccordionLink,TreeNode,Image(如果ImageUrl为空,则取Icon的值)增加Icon属性。 +2009-09-15 v2.1.1 -修正不能动态修改AccordionPane属性Items的BUG。 +为Button, MenuButton, LinkButton, LinkButtonField增加ConfirmTarget。 -如果需要在父页面弹出确认对话框,需要设置ConfirmTarget="_parent"(类似Window控件的Target="_parent")。 +为ExtAspNet.Alert.Show增加点击确定的JavaScript回调函数。 -一个典型应用,在Window控件中打开新页面,如果传递的参数不正确,则首先提示参数不对然后关闭此弹出窗口。 -ExtAspNet.Alert.Show("参数错误!", String.Empty, ExtAspNet.ActiveWindow.GetCloseReference()); +TreeNode的前面的多选框可以自动回发了。 -为TreeNode增加AutoPostBack属性,增加事件数据类TreeCheckEventArgs,为Tree增加事件NodeCheck。 -示例在:http://extasp.net/data/tree_run.aspx -Grid增加GetNoSelectionAlertInParentReference函数,用来表示没有选中任何一项时在父页面弹出对话框的JS代码。 -修正IE7下不能以下划线作为CSS中类名的前缀的BUG(feedback:Steve.Wei)。 -添加定时器控件Timer,用来定时发起AJAX请求。 +2009-09-06 v2.1.0 -Button的Pressed属性值能够正确的反映客户端的变化。 -优化Tree控件的AJAX实现。 +为页面的Form添加autocomplete="off"属性。 -参考http://www.cnblogs.com/sanshi/archive/2009/09/04/1560146.html#1635830 +添加对extjs3.0中所有语言的支持。 -ExtAspNet扩展的多语言包在js\languages\extaspnet目录下,目前只有en,zh_CN,zh_TW三种实现 -你可以向其中添加自己的语言版本,并执行js\languages下的pack.bat打包,最后编译工程。 +2009-09-01 v2.0.9 -为ExtAspNet.Alert添加两个静态方法ShowInParent和GetShowInParentReference,用于在父页面弹出窗口。 +在aspx页面中必须显示的声明控件的集合属性(比如Tabs(TabStrip), Items(PanelBase), Nodes(TreeNode))。 -这将会影响所有的aspx页面,所以要特别关注。 -重命名AccordionPanel为AccordionPane (这也是在Asp.net AJAX中使用的名称). +所有的面板默认有两个集合属性(Toolbars和Items). -尽管TabStrip, From, Tree, Accordion继承了Items属性,但是你并不能对其设置(此时Items是只读的). -这将会影响所有的aspx页面,一定要将工具条(Toolbars)和Items区分开来。 -祝你生日快乐 - 小师妹妹。 +2009-08-29 v2.0.8 -ExtAspNet支持多语言(en,zh_CN,zh_TW),可以在Web.config中修改。 -将所有的示例转化为英语版本。 -修正Tree控件的一个BUG(定义Mappings属性时)。 +PageManager.Instance应该存在于HttpContext.Current,而不是一个全局变量。 -这个BUG导致Asp.net compatibility中的示例无法完成,现在已经修正。 +去除PageManager中方法AddAjaxAspnetControls,增加属性AjaxAspnetControls。 -这个属性和Button得ValidateForms属性类似,可以查看Asp.net compatibility中的示例。 +2009-08-25 v2.0.7 -为按钮增加DisableControlBeforePostBack属性 - 回发之前是否禁用按钮,防止重复提交 - 默认为true。 -Grid的Values属性访问限制由internal改为public,这就意味这可以自由改变Grid中每个单元格的值了。 -增加示例-如何将Grid控件导出为Excel(data\grid_excel_run.aspx)(feedback:503684912)。 -如果TreeNode的属性Enabled="false",则此项变灰并且不会被选中(feedback:your568)。 -修正TreeNode的属性NavigateUrl不接受服务器端URL(以~/开头)的BUG。 -增加Accordion和Tree配合使用的示例(other\accordion_tree_run.aspx)。 -修正Panel图标不能显示的BUG(CSS中class名不能有$字符)。 +去除PageLayout控件,此控件可以使用BorderLayout和指定PageManager的AutoSizePanelID属性来代替。 -这样所有需要占据全屏的Panel(不管你是Accordion,Panel,ContentPanel,Form,GroupPanel,SimpleForm,Tree还是Grid,TabStrip)都可以通过这种方式全屏。 -简单方便,示例可以参考 default.aspx 或者 other\accordion_tree_run.aspx。 +2009-08-14 v2.0.6 -动态生成菜单实例(other\menu_dynamic_run.aspx和other\menu_dynamic2_run.aspx)(feedback:shguo)。 -优化AJAX的内部实现,每个页面保存的ViewState现在减少1/3左右(重要更新)。 -优化Tree节点的NodeId自动生成,减少ViewState占用。 +2009-08-09 v2.0 beta5 +ExtAspNet和Asp.net的提交按钮兼容问题(feedback:千帆)。 -在2009-03-03 v1.3.0曾经提到这个兼容问题,并有这样的规则,如果Asp.net的按钮AJAX提交,必须设置UseSubmitBehavior="false" --也就是说生成的input的type不能是"submit",而这个限制在有些情况下是不可原谅的。 --我们做了优化,现在要使一个Asp.net的按钮能够AJAX提交,你不需要做任何设置(PageManager的属性EnableAjax为true即可,这是默认属性)。 +PageManager的实例方法AddAjaxUpdateControl改名为AddAjaxAspnetControls,现在可以在Page_Load中设置需要在AJAX中需要更新的Asp.net控件了。 -在Page_Load中设置了哪些需要在AJAX中更新的Asp.net控件会在回发时保持状态,可以通过RemoveAjaxAspnetControls来去除不需要更新的控件。 -示例在aspnet\fckeditor_run.aspx和aspnet\aspnet_run.aspx。 -FCKEditor和上传控件兼容。示例在aspnet\fileupload_run.aspx。 -修正ToolbarText的文本在AJAX下更新的BUG。 -Button的Pressed属性在AJAX可更新(feedback:mgzhenhong)。 -更新所有示例。在IE7.0,IE8.0,Firefox3.5,Chrome2.0下测试通过。 +2009-08-02 v2.0 beta4 +和Asp.Net的Forms Authentication兼容[feedback:mgzhenhong]。 -采用和Asp.Net Ajax类似的处理方式,需要在配置文件Web.config增加一个httpModules。 -现在支持Response.Redirect,你可以选择Response.Redirect或者ExtAspNet.PageContext.Redirect重定向页面,两者效果一样。 -支持FormsAuthentication.RedirectFromLoginPage(accountID, false);这样的方法。 -Button增加Type属性(button,reset,submit)[feedback:mgzhenhong]。 -修正Alert.Show方法不能指定文本前图片的BUG[feedback:xmq&mgzhenhong]。 -修正IE下某些弹出窗口的IFrame第一次不能加载的BUG。 -增加Menu和Accordion的示例。 -修正Window控件的IconUrl有时不显示(Target="_parent")的BUG[feedback:xmq&mgzhenhong]。 +2009-07-22 v2.0 beta3 -兼容FCKEditor。 -在IE8.0,Firefox3.5下测试通过。以后ExtAspNet将不会对IE6.0提供支持。 +2009-07-13 v2.0 beta2 -集成extjs最新版本v3.0。 +兼容IE6.0-7.0-8.0。 -这应该是Extjs3.0的一个BUG,在IE6.0-7.0下面设置Ext.QuickTips.init();会导致button的click事件无法响应(IE8下无此问题)。 -目前先禁用IE6.0-7.0的QuickTips。 -优化底层JavaScript。 +2009-07-05 v2.0 beta1 -更新extjs库到最新版本v3.0 RC2; 目前只有一个缺省皮肤(Theme)。 -使用YUI Compressor压缩JavaScript和CSS文件。 -Release版本每个页面只包含一个JavaScript文件(语言文件除外)和一个CSS文件。 -ExtAspNet自身的CSS会紧挨着页面<title>标签引入,这样在<head>中自定义的样式可以覆盖ExtAspNet缺省样式。 +Alert对话框会遮挡所有的Window窗口。 -使用一个变通的方法解决,因为无法改变Ext.Message的默认z-index(9000)所以将box.window_default_group的zseed调整为6000。 -为所有按钮的左右增加5px的空白边距:.x-btn button { margin: 0 5px !important; }。 -因为下拉列表不可编辑,所以不能为空,如果不设置SelectedIndex或SelectedValue,则默认选中第一项。 -重新绑定模拟树的下拉列表后,选中项的前面有图片的HTML标签的BUG。 -更新自定义JavaScript组件Ext.ux.SimplePagingToolbar。 -更新示例工程。 +2009-03-25 v1.3.1 -Tree在AJAX回发展开节点时JS错误[feedback:xlli]。[fixed] -Window中的EnableIFrame==false,则点击关闭按钮时报JS错误。[fixed] -页面包含FileUpload控件,需要点击按钮回发并上传文件,则不能采用原生AJAX方式。(参见示例aspnet/fileupload.aspx)[fixed] -HtmlEditor显示隐藏工具栏按钮不起作用,HtmlEditor目前不支持Enabled和Readonly两个属性。[fixed] +2009-03-03 v1.3.0 -如果弹出的窗口(Ext-Window)含有ASP.NET控件FileUpload,则此弹出窗口在关闭时出现JS错误(http://extjs.com/forum/showthread.php?t=8129)[feedback:xlli]。[fixed] -如果页面中存在ASP.NET控件(TextBox),则第二次提交表单就会报错(视图状态不对,其实时没有更新EventValidation隐藏字段导致的问题)。[fixed] -页面上放置ExtAspNet-Button和ASP.NET-Button,则点击ExtAspNet-Button时激发的是ASP.NET-Button的事件,这个BUG和Extjs2.2.1中Ext.Ajax.serializeForm的实现有关。[fixed] -ExtAspNet内部包含HtmlAgilityPack和Nii.JSON两个开源的第三方类库。[added] +如果以前你听过不要在ExtAspNet工程中使用ASP.NET标准控件的忠告,那么从v1.3.0版本开始,你可以忘掉这个说法,现在ExtAspNet控件和ASP.NET标准控件和平共处了。[fixed] -如果一个ASP.NET按钮控件要使用ExtAspNet的原生AJAX,只需要设置属性 UseSubmitBehavior="false" 即可。 -如果要在一次ExtAspNet的原生AJAX回发时更新ASP.NET控件的值,只需要调用PageManager的公共方法AddAjaxUpdateControl即可(示例:aspnet/aspnet.aspx)。 +2009-02-27 v1.2 beta9 -网络连接出错时的“Ajax Error”改成更加友好的提示信息“本次连接失败!可能是网络连接出错,请刷新页面重试。”。[fixed] -自动测试功能会在以后版本中逐步完善。这个版本完成测试框架,采用Extjs中JS函数进行大部分的测试,对于一些难以测试的地方借助jQuery完成。[fixed] +系统底层代码优化(主要是Javascript的封装和BUG修复)。[fixed] -底层使用Javascript创建一个Window控件的代码由原来的2000字符减少为500个字符。 -PageContext静态类中的GetPageStateChangedFunction改名为GetConfirmFormModifiedReference,底层代码优化。表示“获取当前页面中表单修改的确认提示框的脚本”。 ---[updated]删除PageContext中的GetConfirmFormModifiedReference,使用CurrentActiveWindow中的GetConfirmFormModifiedCloseReference/GetConfirmFormModifiedCloseRefreshReference/GetConfirmFormModifiedClosePostBackReference三个方法代替。 -不会修改弹出页面的URL(Ext-Window中的IFrame),以前为了实现功能为每个弹出页面添加box_parent_client_id查询字符串 -去除PageManager的RegisterPageStateChangedScript属性,现在已经将这个功能实现为静态的JS方法。可以通过PageContext.GetFormModifiedConfirmReference获取此方法的客户端脚本。 ---注意:以前的项目需要在所有的ASPX页面中查找RegisterPageStateChangedScript属性,并删除,否则会运行错误! -A页面有Ext-Window控件弹出B页面,B页面有Ext-Window控件弹出C页面,B页面的Ext-Window控件设置Target='_parent',则弹出的Ext-Window(C页面)会覆盖整个A页面,这是正确的。 ---当时如果用户直接访问B页面,就会报JS错误,因为此时找不到B页面的父页面A了。现在的版本修正为如果找不到父页面,则就在当前页面弹出窗口,这样用户直接访问B页面也不会出错了。 -Window控件的GetIFramePageStateChangedFunction函数改名为GetConfirmFormModifiedCloseReference,表示“获取先确认IFrame的页面中表单改变,然后关闭弹出窗口的客户端脚本”。 ---为Window控件增加如下两个方法GetConfirmFormModifiedCloseRefreshReference和GetConfirmFormModifiedClosePostBackReference,表示“先确认表单改变,然后关闭弹出Ext-Window,再然后刷新父页面或回发父页面”。 ---Window控件的OnClientCloseButtonClick属性如果不设置,则默认采用GetConfirmFormModifiedCloseReference,也即是先判断表单是否更新,然后在关闭窗口。 ---现在可以很方便的为Window控件的关闭按钮添加关闭后刷新父页面或者关闭后回发父页面的行为。 -如果弹出窗口(Window控件)中IFrame的页面不能正常加载(网络暂时出错或页面抛出异常),则此时点击右上角的关闭按钮会报JS错误,因为此时页面尚未加载完毕。 ---此版本修正了这个BUG,即时页面不能加载完全,也能通过右上角的关闭按钮关闭弹出含IFrame的窗体。 -Window控件的IFrameName属性是自动生成的,只读属性。(因为有可能所有的Ext-Window最终都渲染到最外层的页面,为了保证这些IFrame的name不同,IFrameName使用的是GUID,内部处理)。 -CurrentActiveWindow改名为ActiveWindow。 -[特别注意]GetWriteBackValueReference(string controlClientIds, string value, params string[] values)函数现在的定义是GetWriteBackValueReference(params string[] values) ---所有调用GetWriteBackValueReference的地方,需要删除第一个参数(一般是ActiveWindow.GetLoadStateReference())。 +2009-02-23 v1.2 beta8 -ContentPanel中内容不能自动扩展高度的BUG[feedback:huihuang]。[fixed] -DropDownList在Ajax回发时不能计算模拟树的数据[feedback:huihuang]。[fixed] -DropDownList在页面第一次加载时没有不可选择项,则回发时也不会有不可选择项的BUG。[fixed] -升级底层ExtJS类库为v2.2.1(此版本主要是Chrome的支持和部分内存泄漏问题的修正)。[fixed] -页面加载过程中的时间信息保存在Javascript变量window.box.timeInfo中。[added] +增加部分自动测试支持(使用WatiN和NUnit),下个版本将会提供完整的自动测试支持。[fixed] +2008-10-28 v1.2 beta7 -DropDownList没有选中任何一项,回发时报错[feedback:huihuang]。[fixed] -Window显示位置不对,以及不能拖动的BUG[feedback:huihuang]。[fixed] +PageContext优化。[fixed] -去除RegisterExclusiveScript静态函数(这是没有原生ajax之前的产物),使用RegisterStartupScript替代。 -去除RegisterStartupScript的重载函数,只保留最简单的PageContext.RegisterStartupScript(string script)函数。 -Resirect增加重载函数Redirect(string url, string target),其中target可能的取值为_self,_parent,_top,分别表示在当前窗口,父窗口,顶级窗口重定向[feedback:jqpeng]。 -Image控件增加ImageWidth/ImageHeight/ImageCssStyle/ImageCssClass/ImageAlt属性[feedback:jqpeng]。[fixed] -发布包中增加一个Web.config.txt,这是一个空的Web.config文件,包含BOX基本的配置信息。[fixed] -ContentPanel的ShowHeader和ShowBorder属性默认也是true(注意更新以前的应用)。[fixed] -Row和Column布局时,修正IE下设置RowHeight="100%"时显示不正确的BUG。[fixed] -AccordionLink当鼠标移上和移开时,有背景色的变化效果[feedback:huihuang]。[fixed] +TabStrip的Tab控件的EnablePostBack属性会在回发时保持(也即是说如果EnablePostBack=true,回发时没改变EnablePostBack的值,则每次切换到此Tab都会回发)。[fixed] -有这样一个效果,如果Tab1默认显示,Tab1的EnablePostBack=true,则页面加载完毕后会回发Tab1一次。 +2008-10-20 v1.2 beta6 +使用控件的站点必须建立虚拟目录,否则会报JS错误(即是脚本资源没有加载),却原来是HTTPCompress组件的问题。[fixed] -需要替换新的blowery.Web.HttpCompress.dll,解决方案见http://pohee.com/it/http-compression-in-aspnet-20/。 +DropDownList优化。[fixed] -去除EnableFirstItem/FirstItemText/FirstItemValue,这个并不能带来很大的好处,反而容易让开发人员困惑。 现在可以方便的在后台DropDownList1.Items.Insert(0, new ExtAspNet.ListItem("全部", "-1"));来达到同样的效果。 +如果某项(ListItem)的Value为空字符串,则通过SelectedIndex和SelectedValue不能选中[feedback:jqpeng]。 -和Asp.net中的保持一致,ListItem的Value值可以为空字符串。 也就是可以这样写DropDownList1.SelectedValue = ""; -ListItemCollection增加重载函数Add(string text, string value),这样方便后台添加列表项。 -处于布局内的容器控件(Layout!=LayoutType.Container),AutoHeight会自动设置为false(避免开发人员发生此类错误)。[fixed] -注意,控件的高度指的是整个控件的高度,包含BodyPadding(这和CSS中的height不同,CSS中的height是指内容的高度,除去padding/border-width/margin)。[fixed] +为所有控件属性增加在VS中的智能提示。[fixed] -需要将ExtAspNet.XML和ExtAspNet.dll放在一起,这样引用dll时xml会被拷贝到bin目录下,提供VS的智能提示。 +控件的属性如果是枚举类型,如果此属性可以不取值,则默认为None。[fixed] -TriggerIconType.Default -> TriggerIconType.None -SystemIconType.Empty -> SystemIconType.None -RegexPattern.USER_DEFINED -> RegexPattern.None -表单验证属性名称变化(ValueToCompare->CompareValue,ControlToCompare->CompareControl)。[fixed] +注意:一个属性可以拥有多个值的情况。[fixed] -属性和CSS相关则用空格分隔(比如ColumnWidths,BodyPadding)。 -其他的都是逗号分隔(比如ValidateForms,DataKeyNames,DataNavigateUrlFields)。 +AccordionLink实现为控件。[fixed] -可以方便的在子页面(iframe)中通过js切换父页面中选中的菜单项(Accordion->AccordionLink)(示例在other/accordion_links_run.aspx,other/accordion_links_run_iframe_htm)[feedback:jima]。 +确认:可以方便的动态添加控件,并且可以给控件添加服务器端事件(示例在form/form_dynamic_run.aspx)。[fixed] +2008-10-15 v1.2 beta5 -验证表单字段的ValueToCompare属性,为字符串时会出错的BUG。[fixed] +优化下拉列表。[fixed] -验证下拉列表时,应该取ListItem的Value属性进行验证,而不是Text属性。 -DropDownList的Items增加Insert方法(可方便的下拉列表选项添加“全部”)。 -DropDownList不支持EmptyText属性。 -ListItem启用EnableSelect和SimulateTreeLevel属性,这样就可以直接在前台(ASPX)中设置哪些项不可选择,以及创建模拟下拉树。 -DropDownList增加EnableSimulateTree属性(默认为false),如果设置了DataSimulateTreeLevelField,则自动将EnableSimulateTree设置为true。 +2008-09-27 v1.2 beta4 +EnableLargeHeader属性对所有容器的效果一样,Accordion的属性EnableLargeHeader只会改变Accordion的标题大小,而不会对AccordionPanel起作用(示例见other/accordion_run.aspx)。[fixed] -Accordion去除EnableHightlight属性,AccordionPanel增加EnableHightlight属性。 -影响以前使用Box的应用,需要将Accordion的属性去掉,然后为每个AccordionPanel增加EnableLargeHeader和EnableHightlight属性。 -AccordionPanel鼠标移上去的样式调整(现在没有下面的一条白线了)。[fixed] +AccordionPanel增加Links属性,可以绑定列表数据到AccordionPanel,呈现的是链接的列表(示例在other/accordion_links_run.aspx)。[fixed] -原来放置在AccordionPanel中的容器,比如ContentPanel需要在外层加上<Items>标签。 -适当增大AccordionPanel中链接的高度20px->22px,同时对链接的样式也做了微调。 -通过BodyPadding控制链接列表的边距。 -这样能大大减少ASPX中HTML代码和Javascript代码的书写,可以在后台动态添加链接,效果很赞,此需求由马季提出。 +2008-09-25 v1.2 beta3 +代码优化与设计时支持(尚需要不断完善,目前可以在ASPX页切换到“设计时”,方便属性的更改和事件处理函数的添加)。[fixed] -Panel/GroupPanel/ContentPanel/Tree/HiddenField/PageLoading -TabStrip/Toolbar -TabStrip去除Plain属性,增加EnableTitleBackgroundColor(默认为true)。[fixed] -向Form中动态添加控件的BUG,现在form/form_dynamic_run.aspx示例已经能正确运行。[fixed] +大部分容器的子控件集合更正为Items(以前有些是Rows)。[fixed] -影响的控件包括Toolbar/Accordion/AccordionPanel/GroupPanel/Panel/SimpleForm/Window等。 -保留Form的Rows(FormRowCollection)属性和Grid的Rows属性(GridRowCollection)。 -保留TabStrip的Tabs(TabCollection)属性。 -保留PageLayout/BorderLayout的Regions(RegionCollection)属性。 -预祝今晚神七发射成功。 +2008-09-22 v1.2 beta2 +Grid选中项(SelectedRowIndexArray)在ajax回发过程中存在BUG [feedback:xmzhu]。[fixed] -表现为对Grid进行多次删除添加操作后,SelectedRowIndexArray选中项中会存在当前不存在的行序号,导致服务器端遍历选中项时数组越界。所有使用box控件的应用程序都受到此BUG的影响,需尽快更新到新版本。 +代码优化与设计时支持(示例中表单控件都已支持设计)。[fixed] -PageManager/SimpleForm/Button/HyperLink/Label/Image/LinkButton/TextBox -TriggerBox/TwinTriggerBox/Window/TextArea/HtmlEditor/DatePicker/NumberBox -CheckBox/RadioButton/RadioButtonList/DropDownList -Grid +2008-09-19 v1.2 beta1 -Image/LinkButton/HyperLink增加一些Ajax可更新属性。[fixed] +隐藏的方式由HideMode属性控制Visibility/Offsets/Display。[fixed] -修正Form/SimpleForm中隐藏一个表单字段(Hidden=false)会占据页面空间的BUG。 -ToolbarText/ToolbarFill/ToolbarSeparator在ASPX中设置Hidden=true不起作用的BUG [feedback:jbzhang]。[fixed] -Button去除MarginRight属性(可以通过CssStyle="margin-right:5px;"达到相同的效果)[fixed] +2008-09-09 v1.1 +Toolbar去除IsPageMenu属性,在网报中可以用自定义样式实现,而不应该写在控件中。[fixed] -网报:CssClass="toolbar-pagemenu" CssStyle="border:0px;",同时定义样式:.toolbar-pagemenu{ background: rgb(208, 222, 240) url(../images/pagemenu_toolbar_background.gif) repeat-x left top;}。 -Region去除默认的Layout=Fit,如果希望Region使用Fit/Anchor/Column/Row等布局的话,需要手工指定。[fixed] -ToolbarSeparator/ToolbarFill在Ajax更新Hidden属性的BUG。[fixed] +布局整理。[fixed] -新增Column/Absolute/Row三种布局,加上以前的Container/Fit/Anchor/Accordion/Border/Form六种布局,总共有9中布局可供使用。 -其中一些控件默认使用一种布局:SimpleForm(Form)/Form(Form)/Panel-GroupPanel(Container)/Accordion(Accordion)/PageLayout(Border)/BorderLayout(Border)/TabStrip(Card),所有布局控件默认的布局是Container。 -经常用到的布局控件:SimpleForm/Form/Accordion/TabStrip/BorderLayout,经常用到的布局:Fit/Row/Anchor +2008-09-08 v1.1 beta7 -MenuButton/MenuHyperLink增加HideOnClick属性,如果一个菜单项的作用仅仅为了弹出下级菜单,点击没反应,则可以这样设置HideOnClick="false" CssStyle="cursor:default;" [feedback:huayu]。[fixed] -MenuButton/MenuHyperLink/MenuSeparator/MenuText增加Hidden属性(此属性是Ajax可更新属性,如果需要在Ajax时显示隐藏菜单,请使用此属性而不是Visible属性)。[fixed] +大部分的ExtAspNet控件增加Hidden属性(少数几个控件没有此属性:Menu),这样在Ajax时可以显示隐藏控件。[fixed] -注意Visible和Hidden的区别:Visible=false的属性不会渲染到客户端,Hidden=true的控件渲染到客户端但是隐藏。 -US的ExtAspNet改造强烈依赖于此属性,这个版本发布后可以继续。 -网报中唯一没有用到ExtAspNetAjax的地方就是显示隐藏表单字段,现在也可以使用Ajax了。 +2008-09-04 v1.1 beta6 -PageContext.Redirect支持普通页面转向和ExtAspNetAjax下页面转向。[fixed] +模拟树的下拉列表的BUG(会使一些可选项变成不可选项)[feedback:xmzhu]。[fixed] -因为if("0,2,9,11,".indexOf('1,')>=0){ok},这显然是不对的,此BUG涉及很多控件(Grid,DropDownList,TabStrip)。 -解决方法:testValue += '';if(domValue.split(',').indexOf(testValue) >= 0){ok}。 -DropDownList在Ajax时应该先更新数据再设置选定项 [feedback:xmzhu]。[fixed] -Button/MenuButton增加Ajax可更新属性OnClientClick [feedback:xmzhu]。[fixed] -Tree的Ajax支持(尚需优化)。[fixed] +2008-09-02 v1.1 beta5 -DropDownList如果第一次没有绑定值,应该绑定到[[]](二维数组),而不是[](一维数组)。[fixed] -模拟树的DropDownList,在Ajax重新绑定DataSource后,保持项是否可选状态是最新的(页面第一次加载时,即使没有数据也需要设置DataTextField/DataValueField/DataSimulateTreeLevelField/DataEnableSelectField等属性的值,否则Ajax回发时会出错)。[fixed] -UserControlConnector导致的Ajax错误,去除UpdatePanelConnector控件(以后不会用AspnetAjax,这个控件已经完成使命)。[fixed] -不要使用Asp.net的控件HiddenField,而是使用ExtAspNet的HiddenField,因为Asp.net的控件在Ajax不会被更新,所以会导致视图状态不一致的错误。[fixed] -网报Ajax整合基本完成(除了待审批->下一步[审核/归档/出纳]操作,由于需要显示隐藏表单字段,目前Ajax不支持,使用的还是普通的PostBack)。[fixed] -IE下,RadioButtonList中项如果存在汉字,则会换行的BUG。[fixed] -增加两个Theme[Slate/Black](样式尚需完善)。[fixed] +2008-09-01 v1.1 beta4 -非当前Tab中如果有ContentPanel,则在页面上方会有空白(可以通过设置EnableDeferredRender=false解决,但会减慢页面的加载速度),现在已经解决这个问题。[fixed] -RadioButtonList去除EnableBackgroundColor/EnableLightBackgroundColor属性,背景色是透明的,也就是和父控件(SimpleForm/Form)的背景色一致。[fixed] -TwinTriggerBox的第一个Trigger图标不会先显示再隐藏,而是直接隐藏掉(如果用户设置ShowTrigger1=false)。[fixed] -Web.config中增加配置项FormLabelWidth="80"(默认为80),同时PageManager增加FormLabelWidth属性用来控制页面上所有SimpleForm/Form的表单字段标题的宽度。[fixed] +完善Ajax。[fixed] -RadioButtonList增加Ajax可更新属性SelectedIndex(SelectedValue/SelectedItem)。 -DropDownList增加Ajax可更新属性Enable/SelectedIndex(SelectedValue/SelectedItem)/DataSource。 -Grid增加Ajax可更新属性Columns(也就是说Grid列在回发时隐藏显示了一些,也能正确的Ajax)。 -ToolbarText增加Ajax可更新属性Text。 +2008-08-31 v1.1 beta3 -TabStrip增加EnableDeferredRender属性(是否启用延迟加载Tab,默认启用)。[fixed] -重定向页面,使用系统的方法 PageContext.Redirect(string url),使用Response.Redirect方法会出错。[fixed] +安全的Ajax设计。[fixed] -这个版本Ajax和上个版本(v1.1beta1)在设计思路上有很大区别,同时在速度上会有进一步的提升。 -基本思想:安全的Ajax交互,明确Ajax回发时支持控件哪些属性的改变,这将适合90%的应用场景(并且具有极快的反应速度),对于需要UI大改动的可采用常规回发,系统提供控件级别的EnableAjax属性。 -整理支持Ajax的控件属性改变列表(所有被支持的属性改变都是安全的、快速的,所有不被支持的属性改变不会对UI起作用,同时是安全的,不会有js错误)。 -网报Ajax整合(目前只支持所有的列表页面)(v0.8.1)。[fixed] +2008-08-29 v1.1 beta1 +Window控件是否弹出的状态在回发时维持。[fixed] -控件设计的一个原则,凡是可以在客户端改变的属性都应该在回发时保持属性的状态。 +完全抛弃Asp.NetAjax,ExtAspNet控件内置Ajax支持。[fixed] -这是一个值得骄傲的设计,可以明显提高页面回发的速度(相比普通的回发和Asp.netAjax的回发),对于IFrame框架的交互也起到很好的加速效果。 -不需要做任何配置,所有的回发都是Ajax(在Web.config和PageManager中有设置启用Ajax回发的属性-EnableAjax-默认为true)。 +在这种设计下,其实可以完全抛弃Javascript。 -比如简单的点击一个按钮弹出窗口,可以在Button的OnClick事件中设置Window1.Popup=true,也可以注册Button的OnClientClick=Window1.GetShowReference()。 -第一种方法需要回发,但是我们内置的Ajax支持能很快的返回需要的结果并解析,在网络速度很快的情况下和第二种方法差别不是很大。 -推荐的做法是尽量用客户端实现,客户端实现复杂的直接用服务器端实现。 +目前ExtAspNetAjax的限制。 -只对ExtAspNet控件起作用,对Asp.net控件不起作用。 -对容器控件(有子控件的控件)不起作用,只对最底层的控件起作用。 -对改变控件的Visible属性会有错误。 -Window控件的属性改变只有少数几个起作用(Popup,IFrameUrl)。 -PageManager增加属性EnablePageLoading和EnableAjaxLoading(启用页面第一次加载标示和Ajax加载标示,默认都为true),所以如果使用系统默认的加载标示就不必每个页面都添加PageLoading控件。[fixed] -Grid中的回发事件(主要是LinkButtonField和CheckBoxField(RenderAsStaticField=false))要延迟0ms执行,这样当前行被选中的状态在回发后会得到保持。[fixed] -Grid选中行的状态在第一次回发时不能保持的BUG。[fixed] +2008-08-26 v1.0 +已知问题:IE的ActiveX插件IE Developer Toolbar会对IFrame的加载造成0.5m左右的延迟。 -主要是父页面加载一个比较大的css文件(~100k),则每次打开iframe页面,onload事件的调用都会有500ms左右的延迟,在测试IE性能时要禁用此插件。 +优化弹出窗口中IFrame的显示速度。[fixed] -在当前页面弹出窗口需要~20ms,在父页面弹出窗口需要100~300ms。通过缓存弹出的窗口实例,从而第二次弹出窗口不再需要创建时间。 -PageLayout的Region增加SplitColor属性,默认的背景色是透明的。(在网报中需要设置SplitColor="#CADDF7",以便分隔符的颜色和Toolbar的颜色一致)[fixed] +PageManager增加属性Theme、Language、FormMessageTarget、FormOffsetRight等属性,这些属性可以在Web.config中设置(推荐方法),也可以为每个页面设置。[fixed] -一个典型的应用是为每个用户设置不同的皮肤(根据用户浏览器中Cookie设置的值)(示例在default.aspx)。 -TreeNode增加属性SingleClickExpand,表示点击可切换节点的折叠展开状态。[fixed] +TabStrip中非当前Tab会延迟渲染。[fixed] -这会明显加快页面的渲染速度,网报中一个典型的费用审批页面可以减少200ms的渲染时间。 -由于非当前Tab不会在页面加载时渲染,所以那些Tab中的节点在页面加载后也是不可见的,需要将相关的脚本移动到控件的render事件中。 -不能比较两个DataPicker大小的BUG。[fixed] -TabStrip延迟加载引起的BUG(非当前Tab中的ContentPanel会占据页面空间,已修正)。[fixed] -全新的ExtAspNet.Examples(基础知识/表单控件/数据绑定/容器布局/IFrame框架)。[fixed] +2008-08-19 v0.4 beta6 +PageManager增加两个属性(EnableInlineStyleJavascript/ApplyParentStyleJavascript),可以在IFrame页面中使用父页面的脚本和样式(示例在iframe/default.aspx和iframe/page3.aspx)。[fixed] -测试发现,IFrame页面的加载速度并没有明显加快,可以先不使用此属性。 -RadioButtonList放在在BorderLayout中显示不了的BUG [feedback:zgjiang2]。[fixed] +extjs的BUG,当页面中含有iframe时,Ext.onReady会被调用两次(IE6/IE7)(http://www.extjs.net/forum/showthread.php?t=43246)(示例在test.aspx)[fixed] -现在的解决方法是在初始化时:if(this.initialized){return;}this.initialized=true; +需要先回发页面再弹出IFrame窗口。[fixed] -在回发时设置窗口的Popup和IFrameUrl属性,因为这些属性是可以保持状态的,所以在关闭窗口时要注意设置Popup=false。 -另一种做法(推荐):PageContext.RegisterStartupScript(Window99.GetShowReference("./simpleform.aspx"));。 +2008-08-15 v0.4 beta5 -点击关闭窗口的按钮,在IE6下会有JS错误。[fixed] -增加BorderLayout控件,示例在iframe/borderlayout.aspx。[fixed] +Radiobuttonlist显示有重影(示例在radio.aspx)。[fixed] -全新的样式。 -去除Horizontal属性,增加ColumnNumber(可以设置渲染成几列)。 -GetValueReference取得的值不正确的BUG。 -动态向Form中添加FormRow,并动态的向FormRow中添加表单字段,以及如何取得表单字段的值。(示例在form_dynamic.aspx)[fixed] +IFrame弹出窗口关闭后回发父页面,则会多加载IFrame一次,再次打开窗口会重复加载IFrame2-3次[feedback:xmzhu]。[fixed] -这是一个重要的BUG,会严重影响页面的加载速度。原因是通过脚本改变的IFrameUrl会在回发时保持状态,从而回发父页面后Window中的IFrame被添加到页面,而这是不需要的。 -现在"是否弹出窗口、窗口标题、IFrameUrl"在客户端的改变,不会影响服务器端的属性,也即是不保持状态。此问题解决。(示例在button_iframe.aspx) +2008-08-13 v0.4 beta4 -点击关闭窗口的按钮,在IE下会有JS错误。[fixed] -Window的右上角关闭图标增加提示,优化事件响应。[fixed] -Window的代码重构。[fixed] +修正一个的内存泄漏。[fixed] -IE7下测试,打开iframe/default.aspx页面,iexplorer占内存68.368M。 -内存存在泄漏时,点击iframe/page3.aspx页面8次后iexplorer占118.792M内存。 -修正后,点击iframe/page3.aspx页面8次后iexplorer占76.492M内存。 -IE窗口最小化时,IE会自动进行垃圾回收。 +2008-08-12 v0.4 beta3 -底层的javascript框架Extjs升级为v2.2,Grid的渲染速度有很大提升。[fixed] -Grid的EnableDelayRender默认为true(如果没有设置Grid的高度或通过布局间接设置高度,则行不可见,可以通过AutoHeight="true"解决)。[fixed] +页面正在加载的提示尽早的显示出来。[fixed] -首先在执行js来完成页面渲染之前延迟5ms,以便浏览器把当前页面内容显示出来。 -加载js脚本的script标签放置在页面的最后,放置加载js而阻塞PageLoading的显示。 +2008-08-08 v0.4 beta2 -TabStrip延时加载出错。[fixed] -Window的IFrameUrl处理的BUG,比如Pages_ExtAspNet目录下的页面应该为./FE_ApplyEditor.aspx或~/Pages_ExtAspNet/FE_ApplyEditor.aspx。[fixed] -Window的WindowPosition="Center"并且Target="_parent",则会JS错误。[fixed] -实现网报首页下拉菜单和左侧菜单的导航功能。[fixed] -Window的创建在页面显示后进行,不计算在js渲染时间内。[fixed] -优化费用申请页面(尽量减少不必要的层次嵌套)。[fixed] -button_iframe.aspx默认会加载form.aspx页面(Window控件的BUG)。[fixed] -Window中的保存并关闭按钮和Asp.netAjax冲突。[fixed] -优化关闭Window的js脚本,减少写到页面的js大小。[fixed] -加快“保存并关闭”按钮关闭窗口的速度,使用PageContext.RegisterExclusiveScript(CurrentActiveWindow.GetClosePostBackReference());,示例在(simpleform.aspx)。[fixed] +2008-08-05 v0.4 beta1 -DropDownList去除Traditional属性,和传统的Asp.net控件一样不可编辑。[fixed] -DropDownList增加SelectedText属性(去除了模拟树时通过SelectedItem.Text的多余html字符)。[fixed] -为了加快渲染速度,去掉一些特效(比如Panel的折叠效果,Grid的拖动列效果等)[feedback:dcding]。[fixed] -将生成的js对象的名称简单化,这样可以减少生成的js内容,加快页面加载速度(一个典型页面的js由原来的33.0k降低为21.4k)。[fixed] +弹出窗口中,点击按钮回发然后点击关闭按钮,出现js错误 [feedback:xmzhu]。[fixed] -因为在页面的Page_Load中,if (!IsPostBack){PageContext.RegisterPageStateChangedStartupScript();}通过这样方法向页面注册了一段脚本,但是这段脚本在回发时没有注册到页面,因为js调用此脚本时报错。 -一种解决方法是将向页面注册脚本的函数移动到if语句的外面,即每次都向页面注册此脚本。 -另一种办法就是在PageManager控件中增加RegisterPageStateChangedScript(向页面注册监视页面中表单内容改变的脚本)的属性(会在每次页面回发(包含ajax回发)时注册脚本)(示例在button_iframe.aspx/simpleform.aspx)。 +PageManager控件增加ExecuteOnReadyWhenPostBack属性(示例在onreadyscript.aspx)。[fixed] -这个手工添加onReady函数能够在每次页面回发时都注册脚本(包括Ajax局部回发),这就避免了手工去做的麻烦(已经在网报中遇到这种情况)。 -每个页面必须添加一个PageManager控件,否则会出错,同时去除DesignTimeStyle控件(作为PageManager的属性出现)。[fixed] -TextField等表单字段增加Readonly属性。[fixed] +全新设计的IFrame的架构(尽可能和基于MasterPage的架构保持兼容,和Asp.net Ajax保持兼容)。[fixed] -最大的好处是可以减少页面下载完毕后Javascript渲染时间(可以节约一般的渲染时间)。(所有示例在iframe文件夹下) +示例1,通过点击按钮弹出IFrame窗口,可直接关闭父页面,也可在关闭后刷新或回发父页面。(default.aspx/page2.aspx/simpleform.aspx) -虽然IFrame和Master两种架构差异迥然,或许你以为需要修改一堆代码来完成这种转换,起初我也是这么认为的,但是现在你所要做的仅仅是为Window控件增加一个属性(Target="_parent"),就完成了两种框架的转换,是不是很酷。 -显然,控件本身封装了大量的代码,简单来看现在有三个页面(default.aspx(A)/page2.aspx(B)/simpleform.aspx(C)),其中A包含B页面,当你在B中打开包含有页面C的窗口时,窗口不是在B中打开,而是在A中打开,这样才能保证窗口覆盖整个页面,当你从C中返回需要回发页面B时,却发现取得的是A页面,因为我们窗口是在A页面中创建的。我会通过一篇文章来揭示这一过程,敬请期待。 -示例2,Grid中弹出窗口。(default.aspx/page3.aspx/simpleform.aspx) +示例3,TriggerBox弹出窗口。(default.aspx/triggerbox.aspx/simpleform.aspx) -在整个页面弹出窗口或者在当前页面弹出窗口,仅仅设置Window的Target属性即可。 -示例4,弹出窗口中的弹出窗口。 -对整个Examples更新测试。[fixed] +2008-07-31 v0.3 beta12 -IE下TabStrip在Ajax回发后不会去掉x-hide-display样式,导致Tab显示为空的BUG。[fixed] -对TabStrip/Panel/Window中的IFrame重新设计,如果设置IFrameUrl="#"或者"about:blank",则不渲染iframe到页面节点,同时第二次打开Window中的IFrame不会有残影出现。[fixed] -如果TabStrip的Tab不是激活Tab并且设置了IFrameUrl,则会延迟加载(示例在tabstrip_iframe.aspx)。[fixed] -Tree控件,点击一个节点自动回发,则当前点击的那个节点的选中状态不会保持的BUG [feedback:zgjiang2]。[fixed] +规范关闭窗口时提示用户保存已经修改的内容提示的调用方式(包含iframe中关闭按钮和window右上角关闭图标的调用方式)(示例在grid_iframe.aspx/simpleform.aspx)。[fixed] -内部实现上,点击“保存并关闭按钮”,可以将关闭窗口的脚本更早的执行(在simpleform.aspx,PageContext.RegisterStartupScript增加重载函数),而不是原来的先创建整个页面UI,再关闭窗口。 -参照Yslow的评分规则,将JS文件引用由head移动到body中。[fixed] -Firefox下,如果页面太长会出滚动条,原来在ViewPort样式中有body{overflow:hidden;}。[fixed] +IFrame内的页面宽度和高度会自动设置(是不是还在为1px/2px的白边而烦恼,现在不用了:-)(示例在iframe_autosize.aspx/simpleform.aspx/simpleform2.aspx)[fixed] -增加PageManager控件(需要指定AutoSizePanelID,即需要设置宽度和高度为整个页面的宽度和高度的Panel),HideScrollbar属性用于隐藏滚动条(IE/Firefox)。 +2008-07-24 v0.3 beta11 -web.config配置信息中MessageTarget改名为FormMessageTarget,增加FormOffsetRight配置项,用来定义全局表单字段距离右边界的宽度,同时每个表单字段都增加OffsetRight属性 [feedback:jima]。[fixed] -Window在回发时设置的Title不起作用的BUG。[fixed] -增加Image控件 [feedback:jima]。[fixed] -Tree控件,如果一个节点不是叶子节点并且没有子节点,则应把它的Expanded设置为false,否则会引起页面死循环回发 [feedback:zgjiang2]。[fixed] -Image增加ToolTipTitle/ToolTipAutoHide两个属性,当提示信息特别长时,可以让用户阅读完毕之后手工关闭提示信息(示例在hyperlink.aspx)。[fixed] -去掉DropDownList控件的Text属性(强制性),可以通过设置SelectedValue来设置选中哪一项 [feedback:xmzhu]。[fixed] -过滤提示消息中的换行符(转换为<br/>),否则提示信息可能导致页面渲染错误 [feedback:dcding]。[fixed] +2008-07-23 v0.3 beta10 +完善Tree控件。[fixed] -如何将数据库中的数据绑定到Tree(示例在tree2_bind_database.aspx)。 -ajax加载树节点,放在UpdatePanel中才有ajax的效果(示例在tree2_ajax.aspx)。 -更改TreeNode的ID为NodeId,否则两个树中不能有相同ID的TreeNode,这是不合理的。 -Grid的GridColumn的ID改名成ColumnId,否则同一个页面放置两个Grid,它们的GridColumn的ID不能同名,这是不合理的。注意需要更新以前的代码![fixed] -Grid所有类型的列增加DataTooltipField/DataTooltipFormatString两个字段,以显示ToolTip(示例在grid.aspx)。[fixed] +2008-07-22 v0.3 beta9 +IE6下,左侧导航链接的选中样式,以及鼠标移上去和移开的样式不对。[fixed] -发现原来ie6不能正确解析li的高度,必须手工设置才行(style="height:20px;")。 +IE6/IE7下,模拟树的下拉列表如果文字长度太长,则显示的文字会换行,导致错位。[fixed] -虽然最后未能解决<div style="width: 60px; white-space: nowrap; overflow: hidden; border: solid 1px red;"><div style="width: 16px; height: 18px; float: left;">##</div>差旅交通费</div>在IE和Firefox下显示的不同效果。 -但是通过用<img src="##" />来代替<div style="background:url(##)" />,从而实现FF和IE下样式的统一。 -刚看到old9的解决方案:把“差旅交通费”改成“<span style="margin-right: -1000px;">差旅交通费</span>”,在IE下和FF下的都不换行,:-) -LinkButton增加OnClick事件 [feedback:huihuang]。[fixed] -Window通过设置IFrameUrl和Popup不起作用的BUG。[feedback:xmzhu]。[fixed] +增加树控件(Tree)(示例在tree2.aspx)。[fixed] -可以在回发时维持树的状态(选中行,折叠/展开,CheckBox)。 -可以通过Inline的方式添加树节点,也可以绑定到XmlDocument/XmlDataSource/SiteMap。 -点击树节点可以链接到页面,也可以引发PostBack事件,可以添加自定义脚本。 +2008-07-16 v0.3 beta8 +ContentPanel中放置ExtAspNet控件,则渲染时会出现各种问题,比如下拉列表显示样式出错,Grid没了滚动条等等。[fixed] -隐蔽性非常强,原来在ContentPanel中渲染ExtAspNet控件,如果容器的display='none',则会出现各种问题(主要是大小不对)。 必须设置容器为visibility='hidden',然后在渲染完成后显示容器。 -现在Grid只要显示的设置高度和宽度,或者隐式的设定宽度高度(通过Anchor或Fit布局实现),只要超过Grid容器就会显示滚动条。 +IE6下,在应用Asp.NetAjax后,Form中字段的宽度渲染不正确。[fixed] -调试相当困难,如果你有过在IE下通过alert发现问题的经历,你就能明白。 -最后发现IE6下应用Asp.NetAjax后不仅Form中列的宽度设置不正确,而且主内容区域的宽度设置也不正确,不过最终我们还是顽强的修复了IE6下的这个BUG: 在MasterPage的onReady函数中,首先修正内容区域的宽度(region3.setWidth(pageLayout1.getSize().width - region2.getSize().width - 5);region3.doLayout();),然后修正页面中所有表单的宽度(box_fixFormWidthInIE6();): 示例在 Site.Master 页面。 +集成的AspNetAjax有一个很大的BUG,只要你在页面上进行过ajax操作,当改变窗口大小时你会惊讶的发现内容区域的内容全部为空了![fixed] -解决方法相当怪异,经过一个下午的不断尝试,终于用一个怪异的方法解决(box.{0}.setSize(box.{0}.getSize());box.{0}.doLayout();), 这样的代码让我想起刷新窗口时那个方法(window.location.href=window.location.href;),不管怎么说,我对能很好的解决这个重大的BUG很是欣喜。 +2008-07-14 v0.3 beta6 -增加FlashObject控件。[fixed] -PageLoading增加EnableFadeOut属性(默认false),可以启用淡出效果。[fixed] -Accordion选中样式微调。[fixed] -预加载Form表单出错时提示信息的背景图片。[fixed] +Grid增加EnableDelayRender属性(默认false),可以加快页面的渲染速度(一个典型的20个记录的页面,可提前0.7s-1s显示出来)。[fixed] -因为延迟加载数据不会改变Grid的大小,所以对于非布局内或不设定高度宽度的Grid,需要设置"EnableDelayRender=false"。 -改变Grid中静态的CheckBoxField图片。[fixed] -TabStrip增加TabIndexChanged事件,同时Tab增加EnablePostBack,可以在点击一个Tab时引起回发事件。这在延迟加载Tab的内容非常有用。(示例在tabstrip.aspx)[fixed] +2008-07-12 v0.3 beta5 -页面菜单Toolbar的分割符和背景不相融合。[fixed] -表单字段之间可以比较大小,比如NumberBox可以和Label比较大小,同时增加CompareType,来指定比较的类型(示例在form_compare.aspx)。[fixed] -如果是同种类型的表单字段,不需要指定CompareType,比如两个NumberBox比较值的大小不需要指定CompareType,而一个NumberBox和TextBox比较大小需要指定CompareType。 +如果在编辑页面使用AspNetAjax,则不能在回发时关闭当前窗口[feedback:huihuang](示例在ajax_editor_main.aspx/ajax_editor.aspx)。[fixed] -这是由于ajax后执行的javascript中不能有return false语句。 +在文本框失去焦点时,执行一些Javascript脚本(示例在textbox_blur.aspx) [feedback:xmzhu]。[fixed] -在页面添加onReady函数(会被系统调用),然后用javascript监视文本框值的改变。 -弹出Window默认显示的错误页面,解决方法在当前目录添加一个空的html页面,然后把Window控件的IFrameUrl指向这个页面而不是"#"。[fixed] +弹出的窗口中的弹出窗口的如果内容发生变化,则点击右上角的关闭按钮时会有提示用户先保存的对话框,但是这个对话框的被第二个弹出窗口覆盖了 [feedback:xmzhu]。[fixed] -原来的调用方法太麻烦(见示例中alert\alert_1.aspx和alert\alert_2.aspx,总计 6 行代码),现在只需要 3 行代码就OK了。 -点击提交按钮后变成灰色不可再次点击(示例在button_click_gray.aspx)[feedback:jima]。[fixed] +增加Menu、MenuText、MenuSeparator、MenuButton、MenuHyperLink控件,用于按钮的下拉菜单(示例在button_menu.aspx)。[fixed] -增加SplitButton控件。[fixed] +2008-07-09 v0.3 beta4 -DataPicker默认的日期格式为(yyyy-MM-dd)。[fixed] +Form表单字段(TextBox,DropDownList...)之间可以比较大小 [feedback:huihuang]。[fixed] -增加ControlToCompare/ValueToCompare/CompareOperator/CompareMessage四个属性,示例在form_compare.aspx。 +TabStrip中放置IFrame会出现渲染错误 (示例在tabstrip_iframe.aspx)[feedback:jima]。[fixed] -特殊处理,拥有IFrame的Tab如果不是激活Tab,则不设置Url,只有在激活时才设置Url。 -RadioButtonList增加AutoPostBack属性(示例在radio.aspx) [feedback:xmzhu]。[fixed] -FormRow可以设置各列的宽度百分比 (示例在form_columnwidths.aspx)[feedback:jima]。[fixed] +表单字段Enable=false时显示颜色太浅 [feedback:jima]。[fixed] -覆盖缺省样式的.x-item-disabled,设置不透明。 +2008-07-08 v0.3 beta3 -Grid没有数据,向后翻页按钮可以点击的BUG [feedback:huihuang]。[fixed] +增加HiddenField控件。[fixed] -其实用TextBox也能模拟HiddenField的行为,只需要设置CssStyle="display:none;"即可。 +TriggerBox 如果 EnableTextBox = true,则不能将Text回发(这是html的限制)。[fixed] -最后的解决方案居然是设置 readonly=true,同时更改属性为 Readonly(示例在textbox2.aspx)。 -模拟树的下拉列表在失去焦点后显示的文字不对的BUG。[fixed] +控制下拉列表某些项不可以选择(示例在dropdownlist2.aspx)。[fixed] -增加 DataEnableSelectField 属性,不可选择的项变灰,并且鼠标经过时没有样式。 -LinkButton和Grid的LinkButtonField增加Enable属性(示例在hyperlink.aspx和grid.aspx)。[fixed] +2008-07-07 v0.3 beta2 +增加UpdatePanelConnector控件,支持在布局构建的页面使用Asp.net Ajax。[fixed] -使用UpdatePanelConnector有一个要求:ContentTemplate下只能有一个子节点,比如box:Panel。 -示例在ajax3.aspx/content_page4.aspx。 -示例content_page3.aspx中,点击“Ajax查询”按钮和关闭弹出的窗口(点击右上角的叉)都引发异步更新。 +2008-07-03 v0.3 beta1 +容器控件的AutoHeight/AutoWidth默认为false。[fixed] -使用GroupPanel的地方需要手工添加AutoHeight="true"属性。 +增加UserControlConnector,可以在其中放置用户控件(示例在page_usercontrol.aspx)。[fixed] -也可以在ContentPanel中放置用户控件,注意两者的区别。 +增加ContentPlaceHolderConnector,替换原来Region的ContentPlaceHolderId属性(示例在Site.master)。[fixed] +支持Asp.net ajax异步加载。[fixed] -有很大局限性,只能在ContentPanel中使用,示例在ajax1.aspx/content_ajax2.aspx中。 -对于使用布局构建的页面(比如content_page1.aspx)还不能使用Asp.net ajax,因为页面是整体渲染的,先放弃。 +2008-07-02 v0.2 beta12 +关闭前提示当前页面已经被修改(示例在content_page1.aspx/simpleform.aspx)[fixed] -支持Iframe内按钮和window右上角关闭按钮。 -删除CloseAction属性,可以在后台通过OnClientCloseButtonClick属性指定(为了和iframe中做法一致)。 +iframe中的alert/confirm要覆盖整个父页面,而不仅仅是iframe页面。[fixed] -在Firefox下还有问题。[fix pending] +排序时在标题栏显示排序箭头,可以排序的列标题光标为手形(示例在grid_sorting.aspx)。[fixed] -可以通过设置Grid1.CurrentSortColumnIndex = 0;来强制某列显示排序箭头。 -可以通过 Grid1.Columns[Grid1.CurrentSortColumnIndex].SortExpression 的方式取得当前Grid的排序表达式。 +HyperLinkField/WindowField的链接地址支持服务器端格式(即是~/alert.aspx)。[fixed] -TabStrip的Tab中如果放置ContentPanel,则内容渲染位置不正确。[fixed] -可以在ContentPanel中放置用户控件(示例在page_usercontrol.aspx)。[fixed] +2008-06-30 v0.2 beta11 -增加TwinTriggerBox控件(示例在twintriggerbox.aspx)。[fixed] -Grid的数据库分页需要增加属性IsDatabasePaging=true,以便普通分页和数据库分页,否则在添加删除记录时总记录数不会变化 [feedback:zgjiang2]。[fixed] -关闭Window时PostBack事件OnClose可以指定参数,来区分是哪些操作引发的PostBack事件 [feedback:zgjiang2](示例在window_postback.aspx)。[fixed] -如果表单验证不通过,则需要弹出对话框提示(第一个没通过验证的字段)(目前还不能切换到相应的tab)。[fixed] +页面中任意可输入表单字段发生变化,可提示先保存。(示例在content_page1.aspx/simpleform.aspx)[fixed] -目前还不支持Window右上角关闭按钮的提示保存功能。 -Master/Content的内容页中Grid的Sort事件不起作用的BUG [feedback:zgjiang2]。[fixed] -Grid中的LinkButtonField设置ConfirmText会出错 [feedback:huihuang]。[fixed] -增加静态类Confirm。[fixed] +2008-06-27 v0.2 beta10 +Grid完善。[fixed] -CheckBoxField在回发时不能保持状态的BUG (已经更新了grid_checkboxfield.aspx示例)。 -Grid中模拟树显示,GridColumn增加DataSimulateTreeLevelField属性(一个Grid只能有一个Column指定此属性),指定此列模拟树显示时的层次字段(0,1,2,...)(示例在grid_simulate_tree.aspx)。 -切换分页时清空选中的值 [feedback:jqpeng]。 -增加PreRowDataBound事件,可以在数据绑定之前设置某列的属性 [feedback:xmzhu] (示例在grid_prerowdatabound.aspx)。 -DropDownList模拟树的方式显示,增加DataSimulateTreeLevelField属性,使用方法和Grid的类似(示例在dropdownlist_simulate_tree.aspx)。 +2008-06-25 v0.2 beta9 +Window窗体中的Iframe只让内容区域滚动,而Toolbar不滚动的规则。(示例在content_page2.aspx/simpleform.aspx)[fixed] -在simpleform.aspx中:Panel[BodyPadding=5](Toolbar,Panel[Height=450 Layout=Fit](SimpleForm[AutoScroll=true])),则外面窗口的高度=450 + 5*2 + 26 + 32,其中26是Toolbar的高度,32是窗口的标题栏和下边框的高度。 +关闭Iframe的LoadMask,所以需要Iframe页面添加PageLoading控件,这样效果统一。[fixed] +Grid完善。 -去除EnableClientPaging和EnableClientSort属性,客户端排序和客户端分页在ASP.NET应用中会有很多问题(主要是状态保持的问题)。 +EnableServerSort改名AllowSorting。(示例在grid_sorting.aspx) -使用非常简单:设置AllowSorting=true,注册OnSort事件,在事件处理函数中重新绑定数据。 +增加AllowPaging属性。(示例在grid_paging.aspx) -使用非常简单:设置AllowPaging=true,PageSize=3,注册OnPageIndexChange事件,在事件处理函数中Grid1.PageIndex = e.NewPageIndex;OK。 +数据库分页支持。(示例在grid_database_paging.aspx) -使用也非常简单:设置AllowPaging=true,PageSize=3,在绑定时设置RecordCount为总的记录数,在OnPageIndexChange事件处理函数中Grid1.PageIn
智能情绪分析技术_⼈⼯智能技术应⽤:情感分析概述 情感分析概述 与其他的⼈⼯智能技术相⽐,情感分析(Sentiment Analysis)显得有些特殊,因为其他的领域都是根据客观的数据来进⾏分析和预测,但情 感分析则带有强烈的个⼈主观因素。情感分析的⽬标是从⽂本中分析出⼈们对于实体及其属性所表达的情感倾向以及观点,这项技术最早的 研究始于2003年Nasukawa和Yi两位学者的关于商品评论的论⽂。 随着推特等社交媒体以及电商平台的发展⽽产⽣⼤量带有观点的内容,给情感分析提供了所需的数据基础。时⾄今⽇,情感识别已经在多个 领域被⼴泛的应⽤。例如在商品零售领域,⽤户的评价对于零售商和⽣产商都是⾮常重要的反馈信息,通过对海量⽤户的评价进⾏情感分 析,可以量化⽤户对产品及其竞品的褒贬程度,从⽽了解⽤户对于产品的诉求以及⾃⼰产品与竞品的对⽐优劣。在社会舆情领域,通过分析 ⼤众对于社会热点事件的点评可以有效的掌握舆论的⾛向。在企业舆情⽅⾯,利⽤情感分析可以快速了解社会对企业的评价,为企业的战略 规划提供决策依据,提升企业在市场中的竞争⼒。在⾦融交易领域,分析交易者对于股票及其他⾦融衍⽣品的态度,为⾏情交易提供辅助依 据。 ⽬前,绝⼤多数的⼈⼯智能开放平台都具备情感分析的能⼒,如图所⽰是玻森中⽂语义开放平台的情感分析功能演⽰,可以看出除了通⽤领 域的情感分析外,还有汽车、厨具、餐饮、新闻和微博⼏个特定领域的分析。 玻森中⽂语义开放平台的情感分析⽰例 那么到底什么是情感分析呢?从⾃然语⾔处理技术的⾓度来看,情感分析的任务是从评论的⽂本中提取出评论的实体,以及评论者对该实体 所表达的情感倾向,⾃然语⾔所有的核⼼技术问题,例如:词汇语义,指代消解,此役⼩⽓,信息抽取,语义分析等都会在情感分析中⽤ 到。因此,情感分析被认为是⼀个⾃然语⾔处理的⼦任务,我们可以将⼈们对于某个实体⽬标的情感统⼀⽤⼀个五元组的格式来表⽰: (e,a,s,h,t) e表⽰情感分析的⽬标实体,可以是⼀个具体的实例,也可以是⼀个类,但必须是唯⼀的对象。 a表⽰实体e中⼀个观点具体评价的属性。 s表⽰对实体e的a属性的观点中所包含的情感,通常来讲会分为正向褒义、负向贬义和中性三种分类。也可以通过回归算法转化为1星到5星 的评价等级。 h是情感观点的持有者,有可能是评价者本⼈,也有可能是其他⼈。 t是观点发布的时间。 以图为例,e是指某餐厅,a为该餐厅的性价⽐属性,s是对该餐厅的性价⽐表⽰了褒义的评价,h为发表评论者本⼈,t是19年7⽉27⽇。所 以这条评论的情感分析可以表⽰为五元组(某餐厅,性价⽐,正向褒义,评论者,19年7⽉27⽇)。 ⽤户对某餐厅的评价 情感分析根据处理⽂本颗粒度的不同,⼤致可以分为三个级别的任务,分别是篇章级、句⼦级和属性级。我们分别来看⼀下。 1. 篇章级情感分析 篇章级情感分析的⽬标是判断整篇⽂档表达的是褒义还是贬义的情感,例如⼀篇书评,或者对某⼀个热点时事新闻发表的评论,只要待分析 的⽂本超过了⼀句话的范畴,即可视为是篇章级的情感分析。 对于篇章级的情感分析⽽⾔有⼀个前提假设,那就是全篇章所表达的观点仅针对⼀个单独的实体e,且只包含⼀个观点持有者h的观点。这种 做法将整个⽂档视为⼀个整体,不对篇章中包含的具体实体和实体属性进⾏研究,使得篇章级的情感分析在实际应⽤中⽐较局限,⽆法对⼀ 段⽂本中的多个实体进⾏单独分析,对于⽂本中多个观点持有者的观点也⽆法辨别。 例如评价的⽂本是:"我觉得这款⼿机很棒。"评价者表达的是对⼿机整体的褒义评价,但如果是:"我觉得这款⼿机拍照功能很不错,但 信号不是很好"这样的句⼦,在同⼀个评论中出现了褒义词⼜出现了贬义词,篇章级的分析是⽆法分辨出来的,只能将其作为⼀个整体进⾏ 分析。 不过好在有很多的场景是不需要区分观点评价的实体和观点持有者,例如在商品评论的情感分析中,可以默认评论的对象是被评论的商品, 评论的观点持有者也是评论者本⼈。当然,这个也需要看被评论的商品具体是什么东西,如果是亲⼦旅游这样的旅游服务,那么评论中就很 有可能包含⼀个以上的观点持有者。 在实际⼯作中,篇章级的情感分析⽆法满⾜我们对于评价更细致,如果需要对评论进⾏更精确,更细致的分析,我们需要拆分篇章中的每⼀ 句话,这就是句⼦级的情感分析研究的问题。 2. 句⼦级情感分析 与篇章级的情感分析类似,句⼦级的情感分析任务是判断⼀个句⼦表达的是褒义还是贬义的情感,虽然颗粒度到了句⼦层级,但是句⼦级分 析与篇章级存在同样的前提假设是,那就是⼀个句⼦只表达了⼀个观点和⼀种情感,并且只有⼀个观点持有⼈。如果⼀个句⼦中包含了两种 以上的评价或多个观点持有⼈的观点,句⼦级的分析是⽆法分辨的。好在现实⽣活中,绝⼤多数的句⼦都只表达了⼀种情感。 既然句⼦级的情感分析在局限性
1 基本原理 首先,从秒脉冲出来的信号,经过一个控制电路后进入秒计数器进行秒计数,进行清 零,这时用户置入洗涤时间,并按开始按钮,洗衣机开始工作。当秒计数器变为零的时 候,去分钟计数器上面借数;与此同时,将十秒位转化出来的信号送入LED灯的控制电路 中,LED灯表示出电机运转状态;当用户设定的洗涤时间结束后,电路报警并清零;同时 电机指示灯熄灭。 2 设计方案 本定时器实际上包含两级定时的概念,一是总洗涤过程的定时,而是在总洗涤过程中又 包含电机的正转、反转和暂停三种定时,并且这三种定时是反复循环直至所设定的总定 时时间到位置。当总定时时间在0~100min以内设定一个书之后T为高电平1,然后用倒计 时的方法每分钟减1直至T变为0.在此期间,若Z1=Z2=1,实现正转;若Z1=Z2=0,实现暂 停;若Z1=1,Z2=0,实现反转。实现定时的方法很多,比如采用单稳电路实现定时,又如 将定时初值预置到计数器中,使计数器运行在减计数状态,当减到全零时,则定时时间 到。如图所示的电路原理框图就是采用这种方法实现的。由秒脉冲发生器产生的时钟信 号经60分频后,得到分脉冲信号。洗涤定时的时间的初值先通过拨盘或数码开关设置到 洗涤时间计数器中,每当分脉冲到来计数器减1,直至减到定时时间到为止。运行中间, 剩余时间经译码后在数码管上进行显示。 3 单元电路的设计和元件的选择 3.1秒脉冲发生器 由于555定时器内部的比较器灵敏度高,输出驱动电流大,功能灵活,而且采用差分 电路形式,它的振荡频率受电源电压和温度的影响很小。所以由555定时器构成的多谐振 荡器的振荡频率稳定,不易受干扰,因此采用此方案。 在本次设计中,秒脉冲已有,这个环节设计可以省略。 3.2一百进制分计数器和六十秒计数器的设计 3.2.1 74LS192 十进制加/减计数器 74LS192的引脚图: 74LS 192的功能表: 它的主要功能为: CPU为加计数时钟输入端,CPD为减计数时钟输入端。 LD为预置输入控制端,异步预置。 CR为复位输入端,高电平有效,异步清除。 CO为进位输出:1001状态后负脉冲输出, BO为借位输出:0000状态后负脉冲输出。 3.2.2分、秒计数器的电路图 3.2.3设计原理 一百进制分计数器和六十秒计数器的原理是一样的,不同的只是它们的输入脉冲和进 制不同而已,我们用四片74LS192来实现分计数和秒计数功能,我们要的只是减计数,所 以我们把它的UP端接到高电平上去,DOWN端接到秒脉冲上;十分秒位上的输入端B、C端接 到高电平上,即从输入端置入0110(十进制的6),秒十位的LD端和借位端BO联在一起, 再把秒位的BO端和十秒位的DOWN联在一起。当秒脉冲从秒位的DOWN端输入的时候秒计数 的192开始从9减到0;这时,它的借位端BO 会发出一个低电平到秒十位的输入端DOWN,秒十位的计数从6变到5,一直到变为0;当高 低位全为零的时候,秒十位的BO发出一个低电平信号,DOWN为零时,置数端LD等于零, 秒十位完成并行置数,下一个DOWN脉冲来到时,计数器进入下一个循环减计数工作中。 对于分计数来说,道理也是一样的;只是要求,当秒计数完成了,分可以自动减少,需 要把秒十位的借位端BO端接到分计数的DOWN端作为分计数的输入信号来实现秒从分计数 上的借位。当然,这些计数器工作,其中的清零端CR要处于低电平,置数端不置数时要 处于高电平。这是一个独立工作的最高可以显示101分钟的计时器。把四个192的QA/QB/ QC/QD都接到外部的显示电路上就可以看到时间的显示了。作为洗衣机控制器的一个模块 ,它还得有一定的接口来和其他的模块连接在一起协调工作,分计数的清零端LD是接在 一起的;秒的清零端LD又是接在一起的,所以当要从外部把它们强制清零时,可以用一 个三极管(NPN)或者两个或门就可以实现该功能。还有我们可以利用分计数的UP端来进 行外部置数,当把它们各接到一个低触发(平时保持高电平,外部给一个力就输入一个 低电平)的脉冲上就可以实现从0-9的数字输入。 3.3时间译码及控制门 在此部分电路中,四个指示灯,顺时针点亮为"正转";闪烁为"暂停";逆时针点亮为 "反转";停止后定时时间到时四个指示灯全灭。从00秒到19秒内顺时针点亮,从20到29 秒内是闪烁。在30到49秒内逆时针点亮,然后剩下的十秒钟是闪烁,如此完成第一个循 环,刚好一分钟,之后的时间依次循环。 当时间减到0时,四个灯全面,并启动蜂鸣器,提醒定时时间到。该过程由192、138和一 些门电路共同实现,192是可加可减的计数器,当提取的秒钟十位为1和0时,就启动加计 数,提取的秒钟十位为2和5时192停止计数,秒钟十位为3和4时,192启动减计数;同时 把192的输出低三位给13
工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究 研究生姓名: 唐帅 导师姓名: 罗军舟 教授 苏生 教授 申请学位类别 工 程 硕 士 学位授予单位 东 南 大 学 工程领域名称 软 件 工 程 论文答辩日期 研究方向 Android+HTML5 学位授予日期 答辩委员会主席 评阅人 硕士学位论文 基于Android+HTML5的移动Web项目 高效开发探究 专业名称: 软件工程 研究生姓名: 唐帅 导师姓名: 罗军舟 校外导师: 苏生 THE RESEARCH OF EFFICIENT DEVELOPMENT OF MOBILE WEB PROJECTS BASED ON ANDROID AND HTML5 A Thesis Submitted to SoutheastUniversity For the Academic Degree of Master of Engineering BY Tang Shuai Supervised by Luo Junzhou and Su Sheng College of Software Engineering SoutheastUniversity February 2017 东南大学学位论文 独创性声明 本人声明所呈交的学位论文是我个人在导师指导下进行的研究工作及取得的研究成果。尽我所知,除了文中特别加以标注和致谢的地方外,论文中不包含其他人已经发表或撰写过的研究成果,也不包含为获得东南大学或其它教育机构的学位或证书而使用过的材料。与我一同工作的同志对本研究所做的任何贡献均已在论文中作了明确的说明并表示了谢意。 研究生签名: 日期: 东南大学学位论文使用 授权声明 东南大学、中国科学技术信息研究所、国家图书馆有权保留本人所送交学位论文的复印件和电子文档,可以采用影印、缩印或其他复制手段保存论文。本人电子文档的内容和纸质论文的内容相一致。除在保密期内的保密论文和在技术保护期限内的论文外,允许论文被查阅和借阅,可以公布(包括以电子信息形式刊登)论文的全部内容或中、英文摘要等部分内容。论文的公布(包括以电子信息形式刊登)授权东南大学研究生院办理。 研究生签名: 导师签名: 日期: 摘要 目前工业市场上认证检测领域,业务流程陈旧繁琐,用户与检测机构无法便捷有效的沟通。除此之外,用户需要亲临检测机构实地送检,在检测的每一个环节用户也无法有效的进行追踪,这些都制约着认证检测领域的进一步发展。鉴于市场上用户的手机型号、种类、屏幕分辨率等参差不齐,传统方式根据主流系统分别开发相应的系统耗时又耗力,为了高效开发并节约开发项目成本,本文采用Android+HTML5相结合的方式进行移动端Web系统的设计研发工作。 然而,由于HTML5的W3C标准规范还未制定,安卓系统中类浏览器Webview自身存在一些局限性,因此仍存在着诸多问题亟需解决,包括:(1)多窗口类浏览器模式问题。安卓上用于加载的Webview视图窗口只是作为类浏览器而存在,在安卓上更是只能同时运行一个Webview。(2)跨域数据交互问题。不同的Webview之间无法共享数据。(3)页面自适应问题。页面难以兼容适应不同分辨率的设备和浏览器。 本文研究并设计了基于Android+HTML5的在线认证检测系统,主要工作包括以下四个方面: (1)针对多窗口类浏览器模式问题,指出并分析了该问题存在的原因,利用Activity的运行机制,通过Fragment栈对主要模块的Webview进行管理,实现对不同模块之间切换的控制。 (2)针对跨域数据交互问题,指出并分析了跨域缓存交互问题出现的原因,通过在HTML5存储技术的基础上,重写LocalStorage,用移动端本地的Sqlite进行数据维护,实现跨域数据交互。 (3)针对页面自适应问题,本文结合渐进增强以及拥抱流式布局的思想,同时研究利用了移动设备的视口特性,实现跨分辨率、跨设备的页面自适应。 (4)针对系统的功能实现问题,通过结合利用原生态框架与HTML5的跨平台性,实现了“认我测”在线认证检测系统。 综上所述,“认我测”在线认证检测系统,率先填补了认证检测领域移动端的空缺,提供了Web浏览器+移动端的双端访问模式,给用户提供了多种访问途径,真正实现了用户和检测机构的随时随地在线下单检测。 关键词:HTML5,检测与认证,Android,多窗口浏览器模式,跨域处理,页面自适应 Abstract At present business processes are old and explicit in industrial market of certification and detection filed, as well as users can not have effective and convenient communication with detection institutions. Apart from these, customers have to come to detection institutions personally to send samples, and they can not take effective trace of each process during detection. All of these limit the advanced development of certification and detection field. As the versions, types and resolution of users' mobile phones vary in current market, conditional ways depending on systems respectively cost extra time and resources. In order to develop efficiently and save cost of projects, this paper combines android with HTML5 to design and start the development of mobile web system. However, due to standard specification of W3C of HTML5 hasn't been drafted, and browser-alike webview in android has several limits itself, there are still many problems to be solved. Including: (1) Multi-window browser pattern. Webview window in android used to load pages just works like browser, as well as there is only one webview running at the same time. (2)Cross-domain data interaction. Different webviews can not share data. (3)Self-adaption of pages. It is difficult for pages to adapt to devices and browsers of different resolution. This paper researched and designed an online certification and detecting system based on Android and HTML5. Four main parts are included as following: (1) Considering multi-window browser problem, this paper pointed out and analysed reasons of it. The running mechanism of Activity was used cleverly and webiews of main modules were managed through Fragment stacks, in order to control the switch among different modules. (2)Considering cross-domain data interaction problem, reasons of it were pointed out and analysed. LocalStorage was overrided based on HTML5 storage technics, and local sqlite was used to maintain data in order to realize cross-domain data interaction. (3)Considering self-adaption of pages, the system combined the ideas of progressive enhancement and embracing flow layout, aiming at personalitites of mobile facilities viewports, and realized respective solution. (4)Considering the implementation of system functions, the system took the advanteges of native frameworks as well as HTML5 crossing platforms, and developed "Finding Me Detecting" online certification and detecting system. In summary, "Finding Me Detecting" online certification and detecting system filled up blanks of mobile market in certification and detecting field, provoding double side access pattern, that is to say web browser together with mobile side, offering users various ways to access the system, and really realized the goal of whenever and wherever ordering to detect for users and detecting companies. Keywords: HTML5; Quality Authentication; Android; Multi-window browser; Cross-domain data; Page self-adaption 专业名词清单 专业名词 名词解释 HTML5 万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改 Android 一种基于Linux的自由及开放源代码的操作系统,主要使用于移动设备,如智能手机和平板电脑,由Google公司和开放手机联盟领导开发 IOS 由苹果公司开发的移动操作系统 Webkit 一个开源的浏览器引擎,在手机上的应用十分广泛 Webview WebView(网络视图)能加载显示网页,可以将其视为一个浏览器。它使用了WebKit渲染引擎加载显示网页 Activity Activity是一个应用程序组件,提供一个屏幕,用户可以用来交互为了完成某项任务,是一个负责与用户交互的组件 SSH 为 Struts+Spring+Hibernate的一个集成框架,是目前较流行的一种Web应用程序开源框架。其中使用Struts作为系统的整体基础架构,负责MVC的分离,在Struts框架的模型部分,控制业务跳转,利用Hibernate框架对持久层提供支持,Spring做管理,管理Struts和Hibernate。 WebStorage HTML新增的本地存储解决方案之一 LocalStorage 本地永久性存储数据,除非显式将其删除或清空 SessionStorage 存储的数据只在会话期间有效,关闭浏览器则自动删除 Sqlite 一款轻型的数据库,是遵守ACID的关系型数据库管理系统,它包含在一个相对小的C库中 W3C 万维网联盟,创建于1994年,是Web技术领域最具权威和影响力的国际中立性技术标准机构。主要的工作是发展 Web 规范,这些规范描述了 Web 的通信协议(比如 HTML 和 XHTML)和其他的构建模块。 NativeApp 使用传统原生态Android SDK来实现的应用 WebApp 基于浏览器来实现的一种应用 HybridApp 一种可以下载的Native App,其用户界面的全部或者部分元素在嵌入式浏览器组件(WebView之类的)里面运行 优雅降级 一开始就构建站点的完整功能,然后针对浏览器测试和修复。认为应该针对那些最高级、最完善的浏览器来开发网站。而将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段 渐进增强 一开始只构建站点的最少特性,然后不断针对各浏览器追加功能。先让网站能够正常工作于尽可能旧的浏览器上,然后不断为它在新型浏览器上实现更多的增强和改进。 Viewport 移动设备上的Viewport就是设备的屏幕上能用来显示网页的一块区域,即浏览器上用来显示网页的那部分区域。Viewport不局限于浏览器可视区域的大小,可能比浏览器的可视区域要大,也可能比浏览器的可视区域要小。 媒体查询 CSS媒体查询允许开发者基于浏览网站的设备的特性来应用不同的样式申明,最常用的特性是视口宽度。 GCF 谷歌内嵌浏览器框架, 使用此插件,用户可以通过Internet Explorer的用户界面,以Chrome内核的渲染方式浏览网页。Chrome Frame 会把最新版的Chrome Webkit 内核和JavaScript 引擎注入到IE中, IE浏览器将获得Chrome的性能和功能 目录 摘要 I ABSTRACT II 专业名词清单 III 第一章 绪论 1 1.1 研究背景与意义 1 1.2国内外相关研究现状 2 1.2.1 在线认证检测平台开发现状 2 1.2.2 HTML5 3 1.2.3 Android 3 1.2.4 Android移动Web项目开发的三种解决方案:Native, Web和Hybrid优缺陷分析 4 1.2.5国内外应用现状 6 1.2.6 研究现状总结 7 1.3研究目标与内容 7 1.3.1多窗口浏览器模式的实现机制 7 1.3.2跨域交互即缓存处理方法 7 1.3.3页面自适应机制,即设备自适应与浏览器自适应机制 8 1.3.4 “认我测”质检服务平台的设计和实现 8 1.4 本文的结构安排 8 第二章 多窗口类浏览器设计 11 2.1 多窗口类浏览器需求分析 11 2.1.1 Activity简介 11 2.1.2 Fragment简介 11 2.1.3 多窗口类浏览器需求 12 2.2 多窗口浏览器模式的实现机制 12 2.2.1安卓移动端多窗口浏览器框架 12 2.1.2多窗口浏览器模式实现机制 13 2.3 模块实现 13 2.3.1类浏览器模式 13 2.3.2多窗口类浏览器模式 14 2.4 本章小结 15 第三章 跨域交互缓存处理设计 17 3.1 跨域交互缓存处理需求 17 3.1.1 缓存技术WebStorage 17 3.1.2 跨域交互缓存处理需求 17 3.1.3 页面回退管理需求 17 3.2 缓存处理机制 18 3.2.1 跨域缓存处理 18 3.2.2页面回退管理 18 3.3 模块实现 19 3.3.1跨域缓存机制的主要实现 19 3.3.2.页面回退管理的实现 22 3.4本章小结 22 第四章 页面自适应机制设计 23 4.1页面兼容策略 23 4.2 页面自适应策略 24 4.2.1设备自适应 24 4.2.2.浏览器自适应 25 4.3 模块实现 25 4.3.1根据适口属性设计响应式布局: 26 4.3.2同分辨率范围内的流式布局设计 26 4.3.3移动端viewport属性设定 27 4.3.4组件样式的渐进增强设计 27 4.4 本章小结 27 第五章 认我测在线检测服务系统设计 29 5.1认我测在线检测服务系统需求分析 29 5.2 系统时序流程 29 5.3 系统功能模块图 30 5.4 本章小结 32 第六章 认我测在线检测服务系统实现与测试 33 6.1认我测在线检测服务框架设计 33 6.2 系统运行环境搭建及配置 34 6.2.1 AndroidManifest.xml主程序环境配置 34 6.2.2 移动端工程资源布局 35 6.3 认我测在线认证检测系统的主要功能实现 36 6.3.1用户查询 36 6.3.2订单操作 37 6.3.3个人信息维护 37 6.4.系统功能测试 38 6.4.1 首页功能模块 38 6.4.2 订单功能模块 38 6.4.3 个人信息模块 39 6.4.4页面自适应 40 6.5 本章小结 41 第七章 总结与展望 43 7.1 工作总结 43 7.2 研究展望 44 致谢 47 参考文献 49 第一章 绪论 1.1 研究背景与意义 目前市场业务中在产品以及其他项目的认证和检测方面存在诸多不便,用户需要实地考察并频繁与检测单位沟通,填写繁琐的纸质检测报告、当面送递样品,对于检测环节中存在的问题难以及时交互并处理。市场上相应的检测平台诸如检测通、凡特网等皆为pc端检测网站,并且操作繁琐不够人性化,用户在实地使用中存在很多问题。昆山工业技术研究院着眼于为委托用户和质检机构搭建良好的沟通桥梁,免去目前市场业务中企业用户需要实地地并频繁地与检测机构沟通,从而提出自己的委托乃至下委托单、等待检测报告等,设计并研发了市场上首款提供质检服务的移动端app,即“认我测”质检服务平台系统,用户只需在手机上安装轻盈小巧的系统app,即可方便快捷的进行委托服务,质检机构亦可便捷地处理请求订单,双方都可以实时追踪委托订单的状态变化。 考虑到目前市场上用户的手机型号、种类、屏幕分辨率等参差不齐,传统方式根据主流系统(如android、ios)分别开发相应的系统耗时又耗力,为了高效开发并节约开发项目成本、提高项目开发效率,并迎合近年来新兴的HTML5移动页面开发技术,公司采用Android+HTML5相结合的方式进行移动端系统的研发工作。系统的主体一次开发即可在不同设备,包括不同系统、不同型号、不同分辨率设备上运行,免去了大量冗余的开发工作,提高项目的开发效率,降低项目的开发维护成本,为用户提供便捷服务。项目的封装框架只需根据系统的不同稍微改动定制即可,传统的多套系统项目现在只需一次开发,即可适应于不同机型。此外系统还可以通过微信公众号推广链接进行访问,大大的增强了系统的可扩展性和用户操作的便捷性。 然而,由于HTML5的W3C标准规范还未制定,安卓系统中类浏览器Webview自身存在一些局限性,使得结合安卓与HTML5开发移动web项目仍处在探索研发阶段,还不够成熟和完善,相应的技术支持也比较有限,因此仍存在着诸多问题亟需解决,包括: (1)多窗口浏览器模式问题。安卓用于加载的Webview视图窗口只是作为类浏览器而存在,并不等同于pc浏览器,在安卓上更是只能同时运行一个Webview,每次加载新的页面都只能覆盖掉原先的页面,无法达到网页浏览器的多窗口模式。通过常规的pc浏览器窗口的相应open、close进行新增窗口、关闭窗口等操作,在Webview类浏览器窗口中都无法正常运作,甚至会导致Webview失去响应。为此,需要研究相应的解决方案,用于模拟用户适应的网页多窗口浏览器模式。(2)跨域交互问题,即缓存机制与浏览记录管理问题。不同于网页浏览器,用户的数据可以在不同的窗口之间共享,Webview由于其模块之间无法共享数据的机制为保存用户信息以及共享其他程序数据带来了巨大难题。为此需要区分数据是同模块内部共享还是跨域共享访问,并提供相应的解决方案。Webview通过模拟多窗口浏览器模式运作后,在不断的新开页面以及不同模块之间互相切换,会导致页面回退时历史浏览地址发生覆盖,使得不同模块无法回到相应的上级页面,为此需要有效的对页面的浏览历史进行管理,并提供切实可行的方案。(3)页面自适应问题,即设备自适应与浏览器自适应问题。针对移动设备繁杂的屏幕分辨率,如何让页面进行分辨率自适应,从而发挥相对于原生态安卓开发的优势,是一个需要探索和解决的问题。考虑到高效开发设计以及便于推广应用,HTML5的界面不仅仅需要适应基于Webkit内核的Webview,还要能够方便的应用于PC端的网页,如何让HTML5的网页能够适用不同的浏览器内核,也是一个亟待解决的问题。 为此,如何使得“认我测”质检服务平台中安卓与HTML5的结合开发满足多浏览器模式,并解决跨域之间的数据交互问题,同时提高页面的设备自适应和浏览器自适应能力,成为跨平台移动web项目高效开发所亟待解决的问题。 1.2国内外相关研究现状 1.2.1 在线认证检测平台开发现状 互联网界目前在检测领域存在部分在线检测认证的平台,诸如华强认证、检测通等,可以为用户提供一些简单的检测申请,以及为检测机构提供平台发布相关信息。 图1.1 华强认证检测平台首页 如上图所示,在华强认证平台上用户可以选择认证或者检测服务,针对相应类型进行筛选。根据待检测的种类不同,选择相应的检测机构资质、证书、检测周期等查询结果,根据查询结果选择检测机构进行检测委托。检测机构与平台合作,提供负责的检测服务项目、价格等信息,在平台上开设个人站点,提供数据给平台,用于用户检索。 与时下常见的电商网站类似,此类检测平台都提供检测方设计自己的网站主页以出售检测服务,同时为用户提供检索结果、显示可购买的检测服务,用户可以选择质检服务并加入购物车、下单、查看检测方详情、与卖家(检测方)沟通检测细节等操作,但是这些平台都存在着共同的问题——流程不够清晰明了、检测服务不够个性化、用户操作繁琐等,这些问题给用户和检测机构的使用以及交流带来了很多不便。平台提供的检测项目有限,很多时候用户无法确定自己需要检测的项目所属,也不能有效地与检测方进行沟通。与此同时,认证检测领域对于移动端的涉及基础为零,目前主流移动端市场没有相应的认证检测服务产品,随着移动产品愈发便捷,在移动端研发设计相应的认证检测产品,使得用户可以随时随地进行下单咨询变得愈发重要。 1.2.2 HTML5 为了方便用户的使用,“认我测”认证检测平台的PC端基于B/S架构,其设计和研发离不开浏览器内核支持,同时移动端的Web开发也同样需要HTML5语言的支持。利用HTML5的崭新特性,能够更好地为用户提供服务。 HTML5是用于取代1999年所制定的HTML4.01和XHTML1.0标准的HTML(标准通用标记语言下的一个应用)标准版本;现在仍处于发展阶段,但大部分浏览器已经支持某些HTML5技术。HTML5有两大特点:首先,强化了Web网页的表现性能。其次,追加了本地数据库等Web应用的功能。 HTML5广义上为包括HTML、CSS和JavaScript在内的一套技术组合。减少浏览器对于需要插件的丰富性网络应用服务,如Adobe Flash、Microsoft Silverlight与Oracle JavaFX的需求,并且提供更多能有效增强网络应用的标准集。目前HTML5已向开发人员提供了很多新的标签,如section,nav,article,header和footer等。这些标签语义化程度高,被广泛使用。 HTML5逐渐为移动Web开发所采纳,主要原因在于其适用移动项目开发的八大特性,即离线缓存、音频视频自由嵌入、地理定位、Canvas绘图、丰富的交互方式、低开发维护成本、CSS支持以及调用手机硬件。其中离线缓存可以看做是加强版的cookie,不受数据大小限制,有更好的弹性以及架构,可以将数据写入到本机的ROM中,还可以在关闭浏览器后再次打开时恢复数据,以减少网络流量。音频视频方面HTML5无需拆分开混排的多媒体内容,可以将文字、图片、音频、视频等放在一起进行处理。HTML5提供地理定位的支持,无需专属导航软件,通过缓存即可加载地图数据,方便灵活。在系统开发和维护方面,打开即可使用最新版本,免去重新下载升级包的麻烦,使用过程中就直接更新了离线缓存。除此之外,HTML5增强了对CSS样式的支持,极大的增强了界面的美化和友好性,提高了用户体验。 1.2.3 Android Android是一种基于Linux的自由及开放源代码的操作系统,主要使用于移动设备,如智能手机和平板电脑,由Google公司和开放手机联盟领导及开发。Android操作系统最初由Andy Rubin开发,主要支持手机。2005年8月由Google收购注资。2007年11月,Google与84家硬件制造商、软件开发商及电信营运商组建开放手机联盟共同研发改良Android系统。随后Google以Apache开源许可证的授权方式,发布了Android的源代码。2011年第一季度,Android在全球的市场份额首次超过塞班系统,跃居全球第一。 2013年的第四季度,Android平台手机的全球市场份额已经达到78.1%。 Android是一个真正意义上的开放性移动设备综合平台。它包括操作系统、用户界面和应用程序-移动电话工作所需的全部软件,而且不存在任何以往阻碍移动产业创新的专有权障碍。通过与运营商、设备制造商、开发商和其他有关各方结成深层次的合作伙伴关系,来建立标准化、开放式的移动电话软件平台,在移动产业内形成一个开放式的生态系统,这样应用之间的通用性和互联性将在最大程度上得到保持。 在开发之初,Android平台就被设计成一个由一系列应用所组成的平台。所有的应用都运行在一个核心的引擎上面,这个核心引擎其实就是一个虚拟机,它提供了一系列用于在应用和硬件资源间进行通讯的API。Android打破了应用之间的界限,开发人员可以把Web上的数据与本地的联系人、日历、位置信息结合起来,为用户创造全新的用户体验。此外应用程序不仅可以通过标准API 访问核心移动设备功能、互联网,应用程序还可以声明它们的功能供其他应用程序使用。 考虑到移动端市场主流操作系统的使用情况、移动领域的发展趋势以及Android操作系统的开源性,系统采用Android操作系统为研究对象,在其基础上进行设计和研发,使得认证检测产品能够为主流用户所使用,为用户带来便捷。 1.2.4 Android移动Web项目开发的三种解决方案:Native, Web和Hybrid优缺陷分析 Native app是用传统原生态Android SDK来实现的应用;Web app是基于浏览器来实现的一种应用。 Hybrid app是一种可以下载的Native App,其用户界面的全部或者部分元素在嵌入式浏览器组件(WebView之类的)里面运行。对用户来说,Hybrid App与Native App很难区别。二者都可以从应用程序商店或市场下载,存放在移动设备上,运行方式完全如同其他任何应用程序。但是对开发者来说,却存在巨大的差异,因为其无需为每一种移动操作系统从头开始重新编写应用程序,而是只要用HTML、CSS和JavaScript编写其中一部分应用程序代码,即可在多个设备上重复使用。 以下是三种技术各自的优缺点。 Native app Web app Hybrid app 系统特性 可以完美发挥系统特性(调用系统服务、内存管理等); 操控设备硬件(如相机、蓝牙、振动器等) 无法充分发挥系统特性(调用系统服务、内存管理等); 无法操控设备硬件(如相机、蓝牙、振动器等) 可以发挥大部分系统特性(调用系统服务、内存管理等); 可以通过JavaScript API操控设备硬件(如相机、蓝牙、振动器等) 用户体验 可提供最佳的用户体验,最优质的用户界面,最华丽的交互; 支持消息推送 用户体验较差; 图片和动画支持性不高; 不支持消息推送 可提供较好的用户体验; 支持消息推送 本地资源 可访问本地资源 不支持访问本地资源 可访问本地资源 应用更新 获得新版本时需重新下载应用更新,不够方便 跨平台开发、用户不需要下载安装App,开发速度快 可以下载新应用更新,也可在线更新 适用场景 适合制作游戏等性能要求比较高的应用 对于对界面的灵活性有较高要求的app 适用于对画面表现特别高以外的主流需求 开发成本 各平台不兼容,多平台的开发、移植比较复杂,开发成本高,开发周期长,开发成本高; 维护多个版本的成本比较高; 针对多种设备(不同分辨率、不同硬件配置等)的调试和适配较麻烦,维护成本高; 纯HTML5快速开发,较低的开发成本; 支持设备广泛,基于浏览器,跨平台性,维护成本低; Native+HTML5 针对不同系统制定系统外壳,页面部分可重用,大大降低开发成本; 可直接在线更新,更新成本低; 跨平台性,无需针对不同平台开发多个版本应用。 网络要求 支持离线使用 非常依赖网络,网络不稳定等其他环境时,用户请求页面的效率大打折扣 大部分功能依赖网络 考虑到系统需要提供较好的用户体验、用户与检测机构能够利用消息推送进行实时沟通、用户的查询和下单操作默认已具备网络环境等因素,因此为了更好地利用移动端本地硬件支持以及实现跨平台、跨设备的开发,系统采取了Hybrid混合开发模式。通过在原生态框架中嵌入Webview类浏览器,主体页面采用HTML5开发,由原生态定制系统框架,这样在更换移动端操作系统时,只需相应更换系统外壳,主体部分可以重复利用,极大地减少了研发成本,提高了系统的可复用性。系统主体部分更新时,无需在应用市场中重新下载,应用HTML5的特性在线更新缓存即可方便地获取最新版本,为用户带来了便捷。 1.2.5国内外应用现状 图1.2 智能手机操作系统分布数据 市场调研公司Kantar Worldpanel ComTech发布的智能手机操作系统数据显示,截至2016年2月末的三个月内,Android中国城市的销售份额从去年同期的73%增至76.4%。而在美国和欧洲五大市场(包括英国、德国、法国、意大利和西班牙),Android的市场占比继续保持增长态势。因此系统选取市场移动端主流操作系统Android作为基础,进行移动端认证检测产品的研发和设计。 随着移动浪潮的兴起,各种APP层出不穷,极速的业务扩展提升了团队对开发效率的要求,这时使用IOS&Andriod开发一个APP的成本相对过高,而HTML5的低成本、高效率、跨平台等特性马上被利用起来形成了一种新的开发模式:HybridAPP。 作为一种混合开发的模式,Hybrid APP底层依赖于Native提供的容器(UIWebview),上层使用Html&Css&JS做业务开发,底层透明化、上层多多样化,这种场景非常有利于前端介入,非常适合业务快速迭代。Hybdrid作为目前主流的移动端开发设计模式,能够极大的利用Native和HTML5的优势,将性能与用户体验相结合,缩短跨系统的产品研发周期,给用户和研发都带来极大的便利。混合型APP软件兼具“原生型APP软件良好用户交互体验的优势”和“网页型APP软件跨平台开发的优势”。市场上一些主流移动应用都是基于混合型APP软件的方式开发,比如工商银行、百度搜索、街旁、东方航空、微信、去哪儿等。 目前已有众多企业采用混合型APP软件技术开发APP应用,一方面是开发简单,另外一方面可以形成一种开发的标准。企业封装大量的原生型的原生插件如支付功能插件供Java调用,并且可以在今后的项目中尽可能的复用,从而大幅降低开发时间和成本。混合型APP软件的标准化给企业移动应用开发、维护、更新都带来了极高的便捷性。 混合型APP软件通常是基于第三方跨平台移动应用引擎框架进行开发,在国内开发者中比较知名的有PhoneGap、Titanium和AppCan。这些引擎框架一般使用HTML5和Java作为编程语言,调用引擎封装的底层功能如照相机、传感器、通讯录、二维码等。HTML5和Java只是作为一种解析语言,真正调用的都是原生型APP软件一样封装的底层功能,这是和网页型APP软件的最大区别和不同。因为使用了浏览器技术,所以混合型APP软件通常具有跨平台的特性,并且开发成本和网页型APP软件接近,开发效率也远高于原生型APP软件。根据国际科技媒体ReadWriteWeb 2015数据统计显示,截至2015,有80%的App全部或部分基于HTML5研发。大部分的App内容以网页的形式呈现,包括微信、Facebook、Twitter等。为此,Hybrid混合模式成为“认我测”在线检测服务平台移动端框架的开发和设计依赖。 尽管微信通过公众号的形式,使得Android+HTML5模式得以应用并推广,这项技术目前仍不够完善,利用web实现移动app存在一些瓶颈。(1)根据百度移动互联网发展趋势报告,iPhone下载一个1.407k的网页,建立连接耗时1.35s左右,传输耗时0.15s左右。这样,导致app在建立连接的时候,屏幕处于白屏状态。app在一秒多的时间内,完全处于白屏状态,加上3G、GPRS网络的不稳定,有时候等待app响应需要几秒甚至1几秒的时间,对于mobie app来说,这是个致命的缺陷。(2)难以实现本地存储。基于Android存在多版本系统,Android低版本中的Webkit对HTML5和CSS3不能够很好地支持。常用的HTML5向后兼容方案是通过Javascript+CSS+Html来模拟HTML5的一些特性,但过多的js存在于移动app中会得不偿失。 Android+HTML5的混合开发模式对于移动端Web项目开发已经成为市场的主流和趋势,与此同时这项技术还存在着一些问题,需要不断的进行改进和完善。 1.2.6 研究现状总结 总而言之,Android操作系统在移动市场仍居主流,HTML5也为用户带来崭新的特性,Hybrid混合开发模式也逐渐成为移动Web开发的主流设计模式,大量的市场应用都成功的应用和推广了Android+HTML5。正是在这种背景下,“认我测”在线认证检测系统率先填补了移动端认证检测领域的产品空缺,采取了Hybrid混合开发模式。同时,利用Android+HTML5相结合开发移动端Web项目尚处于应用阶段,仍然存在很多问题,还不够成熟和完善。如何将这二者更有效的结合使用,并解决过程中存在的问题,提高项目开发的效率以及节约开发成本,是一个需要研究探索的问题,这也是本课题的意旨。 1.3研究目标与内容 1.3.1多窗口浏览器模式的实现机制 深入挖掘Webview作为类浏览器视图窗口与传统PC端浏览器的区别,针对安卓端同一视图区域单一运行Webview的特性,通过在原生态安卓中启用Fragment视图加载不同视图页面,在外部Activity中对Fragment进行管理控制。同时调整窗口加载及操作模式,适应移动端相关操作从而实现程序中加载多个Webview视图窗口并可以随意切换,实现类浏览器多窗口加载资源并交互的模式。 1.3.2跨域交互即缓存处理方法 针对Webview不支持多窗口间跨域访问的问题,重写缓存处理方式以替代网页端会话级缓存机制,模拟web端本地存储localStorage对本地缓存的处理方法,诸如setItem()、getItem()、removeItem()以及clear(),通过将持久化数据存储在移动端本地数据库来模拟网页端数据持久化存储,实现多Webview间跨域交互访问以及缓存数据保存和处理。 通过维护Webview的历史栈,根据需求进行过滤跳转或者重新加载页面。若当前为重定向后的链接,那么回退的时候就需要忽略上一级的链接,不使用Webview自带的回退方法goBack(),相对地移除重定向和重定向后的url,获取到初始页面链接后自行进行loadUrl()操作. 1.3.3页面自适应机制,即设备自适应与浏览器自适应机制 利用Viewport来控制页面的缩放比例、页面的初始大小,针对不同分辨率的移动设备实现网页页面自适应。通过渐进增强以及优雅降级机制来控制不同版本、不同浏览器之间的兼容问题,以及利用JavaScript库辅助修正相应的样式问题,从而实现浏览器适配的机制。 1.3.4 “认我测”质检服务平台的设计和实现 移动客户端通过安卓与HTML5结合开发设计委托方和质检方app,通过原生态安卓框架外壳嵌入Webview渲染加载页面,添加Java接口与消息会话模块,通过移动端Sqlite操作数据重写localStorage来实现缓存机制,利用Fragment视图层控制Webview的切换与运行来展现主要的功能模块—委托方App:首页模块、订单模块、消息模块和个人模块;质检方App—订单模块、消息模块和个人模块。 服务器端采用J2EE的SSH框架搭建项目,通过微信公共账号链接Html页面,为用户提供多种系统访问途径,增强了系统的可扩展性,为用户带来便利。 1.4 本文的结构安排 本文共分为七个章节。 第一章是绪论部分,介绍课题的研究背景,指出课题的研究意义。然后通过对HTML5研究、Android移动Web开发技术研究以及Hybrid开发问题研究来介绍该课题在国内外的研究现状。最后说明本文的研究目标与内容,以及论文的结构安排。 第二章介绍多窗口类浏览器模式策略的设计与实现。针对现有移动端单一窗口存在的不足,提出类浏览器多窗口解决方案,并对多窗口浏览器模式进行设计 第三章其次分析Webview的跨域数据交互问题,针对移动端类浏览器内核不支持跨域数据访问的不足,提出本地持久性存储替代web端缓存的解决方案,并对跨域访问模式进行设计。同时分析了页面重定向导致的页面无法正常访问问题,提出采用页面浏览历史栈的管理方案,针对回退时目标页面解析进行相应操作。 第四章是多分辨率多设备页面自适应策略设计。首先分析现有Web页面在移动端不同分辨率和设备显示存在的问题,针对页面难以在不同设备上保持兼容适应的不足,提出页面自适应解决方案,并通过渐进增强以及媒体查询等方式进行设计。 第五章是认我测系统的设计,包括系统的功能需求分析、业务流程展示以及功能模块设计。 第六章是系统的功能测试,介绍了相关的实现环境与工具,并对系统的主要功能模块以及主要解决方案进行了功能验证测试。 第七章是总结展望部分,总结本文的主要工作内容与创新点,并对本文写作与实验过程中的不足及后续研究进行展望。 第二章 多窗口类浏览器设计 2.1 多窗口类浏览器需求分析 2.1.1 Activity简介 在Android中一个Activity是一个应用程序组件,它提供一个屏幕,用户可以为了完成某项任务用来交互,例如拍照、拨号、看地图、发送邮件等。每一个Activity被系统给予一个窗口,在该窗口上面可以绘制用户接口。一个应用程序通常由多个Activities组成,他们通常是松耦合关系。通常首次启动应用程序的时候呈现给用户的Activity被指定为"Main Activity”。为了完成不同的动作,每一个Activity可以启动另一个其他的Activity。一个新的Activity启动,前一个Activity就被终止了,但是系统将Activity保存在一个栈上。当一个新Activity启动,它被推送到栈顶,取得用户焦点。栈的管理符合“后进先出”原则,所以,当用户完成当前Activity然后点击back按钮,它被弹出栈并且被摧毁,然后恢复之前的Activity。 若一个Activity因新的Activity启动而停止,系统通过Activity的生命周期回调函数,通知其这种状态转变。一个Activity根据它自己的状态变化可能会收到许多回调函数的通知信息,诸如系统创建、停止、恢复或者摧毁Activity,每个回调都使得开发者得以完成相应状态的指定工作。例如,当停止Activity的时候,应该释放所有大的对象,如网络数据库连接。当Activity恢复时,开发人员可以重新获得必要的资源和恢复被中断的动作。这些状态转换都是Activity的生命周期的组成部分。 2.1.2 Fragment简介 Android 3.0中开始引入Fragments 的概念,可以称为:碎片、片段。其目的是为了解决不同屏幕分辨率下动态和灵活的UI设计,大屏幕如平板、小屏幕如手机。平板电脑的设计使得其有更多的空间来摆放更多的UI组件,而多出来的空间存放UI使得这些组件会产生更多的交互,从而诞生了Fragments。 Fragments 的设计不需要开发者来亲自管理视图层的复杂变化,通过将Activity 的布局分散到Fragment 中,可以在运行时修改Activity 的外观,并且由Activity 管理保存其变化。当一个片段指定了自身的布局时,它能和其他片段配置成不同的组合,在活动中为不同的屏幕尺寸修改布局配置。小屏幕可能每次显示一个片段,而大屏幕则可以显示两个或更多。Fragment是Activity的界面中的一部分或一种行为。可以把多个Fragments组合到一个Activity中来创建一个多面界面并且可以在多个Activity中重用一个Fragment。除此之外,可以把Fragment认为是模块化的一段Activity,它具有自己的生命周期,接收它自己的事件,并可以在Activity运行时被添加或删除。 Fragment不能独立存在,它必须被嵌入到Activity中,而且Fragment的生命周期受到所在的Activity的影响。当Activity暂停时,它拥有的所有的Fragments都被暂停;当Activity销毁时,它拥有的所有Fragments都被销毁。然而,当activity运行时(在onResume()之后,onPause()之前),可以单独地操作每个Fragment,比如添加或删除它们。在执行上述针对Fragment的事务时,可以将事务添加到一个栈中,这个栈被Activity管理,栈中的每一条都是一个Fragment的一次事务。有了这个栈,就可以反向执行Fragment的事务,这样就可以在Fragment级支持“返回”键(向后导航)。 2.1.3 多窗口类浏览器需求 在Android中展现在用户面前的Activity同时只能存在一个,而由于类浏览器内核Webkit的特性,一个Activity中同时只能加载一个Webview用以渲染网页,如果用户想模仿Web浏览器新增一个浏览器标签窗口打开新页面,只能将原来的网页覆盖掉,无法在窗口间来回切换,用户也无法保持原有的浏览器使用习惯。为此,需要利用Activity栈的切换特点,将系统的主要模块分别设计在不同的Fragment上,通过各自的Webview进行加载渲染,在用户需要切换窗口时,通过管理切换Fragment达到目的的实现。 2.2 多窗口浏览器模式的实现机制 2.2.1安卓移动端多窗口浏览器框架 图2.1 多窗口浏览器模式系统框架图 如图4所示,系统安卓移动端由首页、订单、消息以及个人信息四个模块构成,每个模块对应一个视图层Fragment,在安卓Activity运行时一次加载一个视图Fragment,通过底部的原生态菜单栏BottomBar进行视图之间的切换。每个视图Fragment对应同一个位置的Webview类浏览器窗口,通过Webview加载所需要的页面,通过外部的Fragment对Webview的加载以及切换进行控制,从而实现类浏览器多窗口模式。 2.1.2多窗口浏览器模式实现机制 多窗口浏览器模式的实现原理为:安卓外部Activity控制视图层Fragment的加载和切换,Fragment内部加载和控制Webview对页面的渲染,同时调整Web端页面的窗口打开和关闭模式,通过页面重定向进行打开和关闭返回。 多窗口浏览器模式解决两个问题,一是安卓中的类浏览器窗口模式,二是浏览器多标签模式。在移动端的页面加载过程中,类浏览器内核Webview的运行机制为覆盖加载页面,一次运行期间只同时存在一个Webview,与PC端浏览器的运行模式不同,无法通过open打开一个新的浏览器标签页,也无法通过close关闭单个的标签页。为此需要通过loadUrl进行页面重定向,在关闭页面时通过loadUrl反重定向或者通过Webview本身的goBack方法进行回退。移动端的Webview在全局意义上等价于PC端的浏览器,但是通过close关闭的不是一个窗口,而是关闭了整个浏览器。安卓中Activity运行时只能加载一个Webview,因此无法同时展现不同的页面,为此需要通过外部对Webview序列的控制,模拟多窗口显示页面的模式。 在安卓Activity的视图View初始化过程中,实例化需要首次显示的视图层fragment (如首页),将其放入实例化的视图层管理容器HashMap,并通过changeFragmentFrom Menu方法控制用户对视图层Fragment的切换,将原有的视图层置为等待恢复状态,并激活新的视图层用以在Activity中展现,通过changeFragmentBack控制用户通过回退操作唤醒的首页视图层,以此来控制不同视图层,即类浏览器窗口之间的切换。在相应的Fragment视图层中,初始化视图InitView时渲染加载Webview,同时控制底部的菜单栏,通过Webview加载相应的本地网页或服务器端网页,设置Webview相应的属性进而控制页面由Webview加载,而非默认的系统浏览器加载。为Webview绑定页面与原生态安卓相交互的接口,从而可以在加载的页面内调用安卓的原生态功能。 2.3 模块实现 2.3.1类浏览器模式 该部分主要为安卓中通过Webview渲染加载网页的过程。主要包含以下过程: Fragment布局文件中声明控件Webview,绑定其资源ID,为Webview设置宽度和高度。 (1)在Fragment视图初始化initView部分,利用findViewById()通过资源ID获取到Webview控件,对其进行初始化,同时设置相关的webSettings属性,让Webview可以运行JavaScript脚本以及能与本机数据库进行交互。 (2)重写WebViewClient的shouldOverrideUrlLoading()函数,让应用程序的Webview直接加载网页内容,而不调用外部的浏览器。 (3)重写Webview网页对话框,构建一个Builder用以显示网页中的对话框,在点击确定按钮之后,继续执行网页中的操作,同时关闭Builder对话框。 (4)为JavaScript创建安卓接口。通过addJavaScriptInterface为Webview绑定底层Java接口,同时提供相应的接口方法名以及在页面中可以调用的句柄名称,通过该句柄和方法名,即可在Html5页面的JavaScript中访问该底层的Java方法,实现对页面上部和底部的系统外壳的展示管理。 (5)通过loadUrl进行对目标页面的渲染加载,可以加载访问服务器端的页面,也可访问放置在项目内部的页面文件,该模式需要将相应页面放置于系统的assets目录下。相对而言服务器端页面更加常用,也便于维护。 2.3.2多窗口类浏览器模式 图2.2 多窗口类浏览器模式原理图 (1)创建各个主功能模块的视图类Fragment,分别为主界面模块HomeFragment、订单模块OrderFragment、聊天咨询模块MessageFragment以及个人中心模块PersonalFragment,继承自基类BaseFragment。 (2)每个Fragment视图类中声明并初始化相应的Webview组件,对其进行属性设置,为其绑定JavaScript接口并覆盖渲染加载页面的方法,绑定相应的需要在页面调用的底层Java方法接口。重写默认的页面回退响应事件,对页面访问历史以及目标访问页面进行过滤判断,执行相应的处理方法。 (3)在MainActivity的初始化initView中声明并初始化Fragment管理容器HashMap,初始化主页视图HomeFragment并将其加入容器,设置其为默认加载视图。获取FragmentManager用以维护管理Fragment队列,调用beginTransaction方法开启事务。 (4)重写回退按钮响应事件。当页面回到各自模块的初始页面然后按下回退键时,判断当前模块所在的Fragment,由主页模块后退时,执行确认退出系统操作,若从其他模块进行后退,则回到主页模块。通过底部菜单栏setRadioChecked方法设定当前模块的选中标识。 (5)重写模块间切换的方法changeFragmentFromMenu,开启事务,对模块标识ftag进行判断操作,根据用户点击的模块图表将相应的模块视图Fragment通过onResume()进行恢复,同时通过show()将该模块进行展示,从Fragment管理容器中将主页模块以外的Fragment移除。将带有oflag暂停标识的Fragment视图进行暂停处理,通过hide隐藏取消该视图的展示。 (6)在各自的Fragment模块视图类中重写onResume方法,用以在模块恢复时进行用户是否登录判断。对Webview渲染加载的页面进行分析,判断是否包含index初始页面标识。根据flag标识进行是否需要登录操作,flag为1表示从其他Fragment跳转到该模块的Fragment视图并需要用户登录。 以上就是多窗口类浏览器模式的实现主要环节,通过Webview加载渲染服务器资源页面,控制碎片视图Fragment展现各自模块的Webview,在MainActivity对碎片容器以及碎片视图之间的切换进行管理控制,从而完成多窗口类浏览器模式的实现。 2.4 本章小结 本章分析并介绍了安卓中Activity的基本性质,对碎片视图Fragment进行了相关阐述和引出,综合分析了多窗口类浏览器模式的设计需求。随后对多窗口类浏览器模式的框架进行了设计,通过Activity运行管理Fragment的加载和切换,各个模块的Fragment视图独自加载运行相应的Webview,补充和完善不同模块之间切换和回退的业务逻辑。在模块实现部分详细描述了两个关键部分的实现环节,即类浏览器模式和多窗口类浏览器模式,介绍了过程中主要用到的方法以及实现思想。 第三章 跨域交互缓存处理设计 3.1 跨域交互缓存处理需求 3.1.1 缓存技术WebStorage 图3.1 WebStorage示意图 WebStorage 使得网站能够把信息存储到本地的计算机上,并在以后需要的时候进行获取。WebStorage和Cookie类似,区别在于WebStorage是为了更大容量存储而进行设计。Cookie的大小是受限的,并且每次当请求一个新的页面的时候,Cookie都会被发送过去。而WebStorage则存储在计算机上,网站在页面加载完毕后可以通过Javascript来获取这些数据。 WebStorage提供两种类型的API:localStorage和sessionStorage,区别在于localStorage是本地永久性存储的数据,除非显式将其删除或清空,否则将一直保存在本地。sessionStorage存储的数据只在会话期间有效,关闭浏览器则自动删除。两个对象都有共同的操作API。 3.1.2 跨域交互缓存处理需求 WebStorage存储技术针对的是同一个类浏览器Webview,系统在各模块之间由不同的Webview加载渲染,通过不同的Fragment进行管理,因此模块之间无法共享数据。然而通过多窗口浏览器模式构建的系统模块之间经常需要进行数据交互,如用户登录信息以及产品相关信息,Webview由于其特性仅支持自身内部的缓存数据交互。同Webview内不断的覆盖加载新页面以及发生页面回退时可以对缓存数据提供便捷高效的数据保存,使得在页面加载的过程中可以便利的处理需要交互的数据;相对的不同的Webview之间无法共享数据,无论是会话级缓存还是持久化缓存。为此需要重写web端的持久化存储localStorage,将交互的数据保存到移动设备本地数据库。 3.1.3 页面回退管理需求 对于初始页面为A,点击某个链接跳转到B(http://xxx.com.cn/),B页面重定向到C页面(http://xxx.com.cn/website/index.Html),当调用webview.goBack()时,页面回退到B,然后接着会重定向回C页面。这样会导致两个问题:无法回退到Webview的初始页面A以及无法正常退出Activity或者Fragment(只有还未加载完C时进行回退才能退出页面)。为此需要引入历史记录栈,对页面访问历史进行管理,在回退事件中判断该加载页面是否需要重定向并执行相应的操作。 3.2 缓存处理机制 3.2.1 跨域缓存处理 在移动端数据库Sqlite操作类LocalStorage中定义相应的数据库连接属性、创建和更新的操作以及数据库操作单例Instance,在视图访问基类BaseFragment中定义覆盖web端持久化存储localStorage的核心交互类LocalStorageJavascriptInterface。获得数据库操作单例,并覆盖localStorage对缓存的常用处理方法取值getItem(),修改值setItem(),删除值removeItem()以及清空缓存clear()。将页面上获得的数据键值对存入数据库,对其进行更新删除以及返回给页面使用。在Webview初始化时进行页面与后台交互绑定addJavaScriptInterface,并在页面初始化init过程中将页面的默认localStorage操作更换成覆盖重写的方法,即可在页面进行跨域访问时交互相应的数据。 跨域交互的缓存处理机制如图5所示: 图3.2 缓存处理机制原理图 3.2.2页面回退管理 安卓的回退按钮一般用于返回上一级菜单,不过在浏览器页面加载过程中却不能理想地返回上一级页面,默认的回退按钮是针对Activity的回退,对于Webview来说,回退按钮会致使浏览器调用finish()而结束自身的运行,因此需要覆盖Activity的onKeyDown()事件,在方法内部重新对浏览页面进行管理。 在页面的新建关闭以及重定向时,Webview的页面回退goBack()会受到干扰,不能正常回到前一个页面,甚至会发生前后两个页面间来回切换后退的死循环,并影响模块间的后退返回。为此需要对历史访问页面进行管理,采用如下实现方案。 在Fragment视图声明时定义一个用于管理保存历史浏览记录的历史栈ArrayList,将系统初始加载界面加入列表。在此后的页面加载过程中,每次加载页面都将其加入历史栈,在系统回退响应事件中,判断页面是否为重定向页面,如果为重定向页面,则移除历史栈中最后两个链接,加载操作后历史栈的最后一项;否则移除历史栈中最后一项,加载操作后历史栈的最后一项。 页面回退方案的流程图如图3.3所示: 图3.3页面回退管理机制图 3.3 模块实现 3.3.1跨域缓存机制的主要实现 图3.4 重写LocalStorage类示意图 (1)重写LocalStorage类。让LocalStorage继承自SQLiteOpenHelper类,声明LocalStorage对象实例以及其他数据库连接配置信息,如数据表名称、表中存储的数据Id与值Value、数据库名称、创建数据库语句等。通过Singleton单例模式维护LocalStorage实例,重写创建数据库和更新的相关操作。 (2)添加LocalStorage的底层JavaScriptInterface,供服务器资源页面进行访问。通过LocalStorageDBHelper对象获取到单例localStorage,声明上下文对象和SQLiteDatabase对象。重写HTML5存储技术LocalStorage的关键缓存数据操作方法getItem()、setItem()、removeItem()以及clear()。 图3.5 重写WebStorage核心方法示意图 1.重写getItem(),根据传入参数key获取相应的value值 ①判断传入的key是否为空。 ②若key不为空,通过localStorageDBHelper的getReadableDatabase()方法实例化数据库对象database。执行sqlite的数据库查询操作,返回数据库结果操作游标。 ③根据游标的moveToFirst判断查询结果是否为空,返回相应的value结果。关闭数据库连接。 2.重写setItem(),根据传入的参数key和相应值value更新数据库 ①判断传入的key和value是否为空,通过getItem()获取更新前的值。 ②实例化数据库对象database。声明ContentValues对象并将key和value相应赋值。判断更新前和key对应的值是否存在,若存在执行数据库的更新操作;若不存在,执行数据库的插入操作。关闭数据库。 3.重写remove() ①判断传入的key是否为空 ②实例化数据库操作对象,执行相应的数据库删除操作,关闭数据库 4.重写clear() 实例化数据库操作对象,执行数据库删除操作,清空整张数据库表。 在Fragment视图中初始化Webview时,通过addJavaScriptInterface为其绑定重写的底层LocalStorage操作接口,并将操作句柄设置为localStorage。设置webSettings属性,通过setDomStorageEnabled与setDatabaseEnabled启用本地存储功能。 在服务器资源页面JavaScript方法中,尝试用句柄LocalStorage替换window默认的localStorage。若发生异常,说明LocalStorage没有被添加至webview。然后即可像通常HTML5的localStorage对缓存数据进行操作。 3.3.2.页面回退管理的实现 (1)在MainActivity中覆盖模块间的回退响应事件。当模块页面回退至各自的初始页面时,点击回退按钮执行相应的模块切换策略,若该模块为主界面模块,则弹出退出系统确认框供用户选择是否退出;若为其他模块则将菜单栏切换到首页模块。 (2)在各自的Fragment中覆盖模块内部的回退响应事件。在页面初始化时定义并维护一个存放历史访问页面的历史栈loadHistoryUrls (ArrayList),把初始页面url加入到历史栈中,在覆盖加载方法shouldOverrideUrlLoading中将待渲染加载的页面加入到历史栈中。 (3)在Fragment内部的回退事件处理方法中,判断是否可以执行返回操作。然后判断历史栈存存放页面的前一页是否包含初始重定向页面,若包含该页面则移除加载栈中的最后两个链接,否则移除加载栈中的最后一个链接。最后加载重定向之前的页面。 3.4本章小结 本章首先分析了HTML5标准下缓存处理策略WebStorage,其包含本地存储LocalStorage与会话存储SessionStorage,并提供了相应的介绍和说明。然后分析了跨域数据交互问题问题存在的原因以及页面回退管理存在的问题。由于Webview的数据封闭性,不同的模块Webview之间无法共享访问数据,使得不同的模块无法正常交互,为此采用重写LocalStorage的方式,通过本地Sqlite数据库操作模拟HTML5中缓存的操作,重写LocalStorage关键的操作方法setItem()、getItem()、removeItem()以及clear(),并为Webview绑定相应的底层Java方法接口,在服务器页面资源中用重写的LocalStorage替换默认的localStorage,从而完成跨域数据的调用访问操作。由于页面的重定向作用,页面回退时会反复加载到重定向后的页面,导致页面无法正常回退,因此通过维护历史栈的方式,在页面回退时对回退目标页面进行分析判断,并执行相应的回退管理方法,从而使得模块内部的页面以及模块之间可以正常地进行返回操作。 第四章 页面自适应机制设计 针对移动设备分辨率和屏幕大小、设备型号迥异的现状,本章将在分析现有页面跨浏览器兼容方案的基础上,同时结合移动端对不同分辨率设备的支持特性,分析与设计跨机型、跨分辨率、跨浏览器的页面自适应机制。 4.1页面兼容策略 为了使页面能够适应不同版本的浏览器内核,诸如IE、Chorme、Firefox等,CSS3引入了两种常用的设计策略,即优雅降级和渐进增强。 优雅降级指的是在页面设计开始即构建页面的完整功能,然后针对不同的浏览器进行测试和修复。该观点认为应该针对那些最高级、最完善的浏览器来开发网站,同时把那些被认为过时或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段。在这种设计思想下,旧版的浏览器通常被认为仅能提供简单却功能没有大碍的页面浏览体验。虽然可以做一些小的调整来适应某个特定的浏览器,但由于这些调整并非开发过程中关注的焦点,因此浏览器间呈现的差异通常将被直接忽略。 渐进增强指的是在页面设计开始只构建页面的最少特性功能,然后不断针对各高级浏览器追加额外功能。渐进增强思想认为应该先让网站能够正常工作于尽可能旧的浏览器上,然后不断为它在新型浏览器上实现更多的增强和改进。随着时间的推移,当更多的用户逐渐开始升级浏览器,同时浏览器本身的支持度也不断提升时,就会有越来越多的用户体验到这些增强和改进,无需为了一个已经成型的网站在旧式浏览器下正常工作而做逆向开发。渐进增强观点认为网页的开发应关注于内容本身。这使得渐进增强成为目前一种更为合理的设计范例。 图4.1 优雅降级和渐进增强图例 对于优雅降级,功能衰减的设计从复杂的功能现状开始,不断减少用户体验的供给;而渐进增强则的设计是从一个非常基础的,能够发挥作用的版本开始,并不断地进行扩充,以适应未来环境的需要。功能衰减意味着往回看;而渐进增强则意味着朝前看,同时保证其根基安全牢固。 为了能够给用户提供更好的界面交互体验,同时适应不同版本的浏览器内核,系统采用了部分渐进增强的思想,利用媒体查询为不同的浏览器版本和内核提供相应的展现效果,同时保证基本的页面展现功能。 4.2 页面自适应策略 系统采用部分渐进增强的页面适配思想,以及拥抱流式布局策略,通过视口元素的媒体查询来控制不同分辨率阈值下页面的布局规划,调整页面元素的布局为百分比方式,包括组件宽度、字体以及高度、图片的动态大小来控制相同分辨率阈值范围下不同视口中组件的平滑缩放。同时对HTML5页面的移动端适配属性进行设置控制,针对需要达到的效果设置其Viewport的属性,包括宽和高、页面最初大小、初始缩放比例、屏幕像素密度等。使得系统在Web浏览器端以及移动端都有良好的展示效果。 4.2.1设备自适应 Viewport是指用以展现手机页面的区域。尽管Viewport的可见区域和屏幕大小是匹配的,但是它有着自己的尺寸(dimensions),这一尺寸决定了页面上可见的像素点。一个web页面在扩张到整个屏幕之前占用的像素数据是由Viewport的尺寸来定义的,而不是设备屏幕的尺寸。如一个设备的屏幕宽480像素,但是Viewport宽800像素,那么这个web页面需要在800像素宽的屏幕上才能完全展现。 在HTML5中可以使用 <meta> 标签来为页面定义Viewport 的属性。可以在 <meta> 标签的content 属性中,定义多个Viewport属性。例如,Viewport的高和宽,页面的最初大小,以及目标屏幕分辨率。Content 属性中的每个Viewport性质必须以逗号相隔。通过初始缩放initial-scale和用户调整缩放来控制页面的伸张以适当地填充移动端设备的显示区域。通过target density定义屏幕像素密度来控制安卓浏览器和Webview根据不同屏幕的像素密度对页面进行的缩放。 图4.2 视口属性设置示意图 4.2.2.浏览器自适应 通过拥抱流式布局的来使得页面在不同尺寸屏幕上良好的运行。从手机到电脑,设备的屏幕尺寸层出不穷,很难用传统意义上的统一布局来适应这些变动。拥抱流式布局倡导响应式界面设计,通过媒体查询(@media screen and...)来获得设备特性信息,从而灵活的控制不同尺寸屏幕的浏览器动态的调整页面元素的布局,以适应视口特性的变化。 同时根据“目标元素宽度/上下文元素宽度=百分比宽度”的模式将传统的固定像素式布局改为百分比布局,元素的固定像素宽度转换成百分比宽度。假定整个页面布局的宽度是960px,按照1024px屏幕分辨率做参照,百分比应是960/1024 = 93.75%。其他的组件宽度也可以按照960px为参照计算。若除下来的结果是很长的小数,如340/960 = 0.3541666666666667 ,无须对结果进行四舍五入,这样可以保持最高的精确度,这些小数应尽可能完整保留。 根据“目标元素尺寸/上下文元素尺寸=百分比尺寸”将文字的固定像素大小转换为等量的相对尺寸,现代浏览器默认的字体大小是16px,字体的相对大小用em为单位来表示。若某个div的字体大小为48px,则转化后为48/16=3em。结果为小数时的处理方式同上。 给图片设置阈值以使图片随着视口平滑缩放,为不同屏幕尺寸提供不同的图片,然后针对不同视口宽度修正设计,保证在响应式设计中内容始终优先。图片不是布局元素,它里面不包含子元素。另外,图片还有失真的问题,缩放不当都会造成失真。为此,需要给图片添加样式max-width:100% 以实现弹性图片,因为图片所处的容器可以自动缩放,只需让图片限制在父级的宽度之内,就可以随父级一起缩放。弹性图片仅用max-width无法实现,除此之外还需使用百分比宽度。处理方式同计算布局元素的宽度。在此过程中需要注意图片的失真问题,当用户使用的一个超宽屏幕时,图片被放大到原大小的两倍甚至更多,图片的质量会大幅下降。所以还需为图片设置绝对阈值,即宽度上限,因此一个弹性图片的样式组合应该为:width:30%; max-width:400px。 对于一个使用超宽屏幕的用户,按照正常的页面设计比例,这张图片被放大到了500px,但是现在只能显示最大宽度400px,依然是个问题。为此可以采用另一个组合,把max-width加到图片的父级元素上,从源头上就限制放大的最大值,这样图片与它的相邻元素的比例就不会失调了。这样的设计也是个权衡的结果,因为页面结构千变万化,具体的解决办法,还得分析具体页面。 为了防止放大的过宽,可以通过媒体查询来设置不同分辨率下的阈值。在处理各种浏览器兼容问题时,可以借助Modernizr,一个用于检测浏览器功能的开源JavaScript库,通过Modernizr追加的额外类名来辅助修正样式问题,以及通过检测浏览器是否支持媒体查询来按需加载资源,让老版本IE支持HTML5等。 4.3 模块实现 页面自适应主要的实现方式包含: 4.3.1根据适口属性设计响应式布局: ①加入兼容配置代码 <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">,通过chrome插件GCF(谷歌内嵌浏览器框架)控制IE以Webkit引擎及V8引擎进行样式排版,若用户未安装该插件则以IE最高文档模式进行展
目录 1引言 1 2 PROTEUS软件仿真 2 2.1 PROTEUS软件简介 2 2.1.1 PROTUES ISIS的启动 2 2.1.2 PROTUES ISIS的工作界面 3 2.2 Keil简介 3 2.3 利用PROTUES ISIS仿真与调试 4 3 主要芯片简介 5 3.1 AT89C51芯片 5 3.2 ADC0808 7 3.3 74LS161 8 3.4 七段数码管简介 9 4 系统总体设计 10 4.1 工作原理 10 4.2 系统结构框图 10 4.3 系统硬件设计 10 4.3.1 单片机的选择 10 4.3.2 时钟电路的设计 11 4.3.3复位电路 11 4.3.4 A/D转化电路及测量电路的设计 12 4.3.5 显示模块设计 12 4.4系统程序设计 13 4.4.1 初始化程序 13 4.4.2主程序 13 4.4.3 A/D转换子程序的设计 14 4.4.4 循环显示的程序 15 4.4.5 显示程序 16 4.4.6 中断子程序、延时子程序和查表 17 5.1 总体设计仿真电路 18 5.2 仿真结果 19 6 总结 21 参考文献 22 附录 23 1引言 数字电压表的基本工作原理是利用A/D转换电路将待测的模拟信号转换成数字信号, 通过相应换算后将测试结果以数字形式显示出来的一种电压表。较之于一般的模拟电压 表,数字电压表具有精度高、测量准确、读数直观、使用方便等优点。 在测量仪器中,电压表是必须的,而且电压表的好坏直接影响到测量精度。具有一个 精度高、转换速度快、性能稳定的电压表才能符合测量的要求。为此,我们设计了数字 电压表,此作品主要由A/D0808转换器和单片机AT89C51构成,A/D转换器在单片机的控制 下完成对模拟信号的采集和转换功能,最后由数码管显示采集的电压值。 电压表的数字化测量,关键在于如何把随时连续变化的模拟量转化成数字量,完成这 种转换的电路叫模数转换器(A/D)。数字电压表的核心部件就是A/D转换器,由于各种 不同的A/D转换原理构成了各种不同类型的DVM。一般说来,A/D转换的方式可分为两类: 双积分型和逐次逼近型。 双积分型A/D转换器是先用积分器将输入的模拟电压转换成时间或频率,再将其数字 化。根据转化的中间量不同,它又分为U-T(电压-时间)式和U-F(电压- 频率)式两种。 逐次逼近式A/D转换器分为比较式和斜坡电压式,根据不同的工作原理,比较式又分 为逐次比较式及零平衡式等。斜坡电压式又分为线性斜坡式和阶梯斜坡式两种。 在高精度数字电压表中,常采用由积分式和比较式相结合起来的复合式A/D转换器。 本设计以AT89C51单片机为核心,以双积分型A/D转换器ADC0808、七段数码管为主体,构 造了一款简易的数字电压表,能够实现自动和手动测量8路0.00~5.00V的直流电压,最 小分辨率为0.02V。 2 PROTEUS软件仿真 2.1 PROTEUS软件简介 PROTEUS ISIS是英国Labcenter公司开发的电路分析与实物仿真软件。它运行于Windows操作系统 上,可以仿真、分析(SPICE)各种模拟器件和集成电路,该软件的特点是:1.实现了单片 机仿真和SPICE电路仿真相结合。具有模拟电路仿真、数字电路仿真、单片机及其外围电 路组成的系统的仿真、RS232动态仿真、I2C调试器、SPI调试器、键盘和LCD系统仿真的 功能;有各种虚拟仪器,如示波器、逻辑分析仪、信号发生器等。2.支持主流单片机系 统的仿真。目前支持的单片机类型有:68000系列、8051系列、AVR系列、PIC12系列、P IC16系列、PIC18系列、Z80系列、HC11系列以及各种外围芯片。3.提供软件调试功能。 在硬件仿真系统中具有全速、单步、设置断点等调试功能,同时可以观察各个变量、寄 存器等的当前状态,因此在该软件仿真系统中,也必须具有这些功能;同时支持第三方 的软件编译和调试环境,如Keil C51 uVision2等软件。4.具有强大的原理图绘制功能。总之,该软件是一款集单片机和SPIC E分析于一身的仿真软件,功能极其强大。 2.1.1 PROTUES ISIS的启动 双击桌面上的ISIS 6 Professional图标或者单击屏幕左下方的"开始" "程序" "Proteus 6 Professional" "ISIS 6 Professional",出现如图2-1所示屏幕,表明进入PROTEUS ISIS集成环境。 图2-1 PROTEUS ISIS启动时的屏幕 2.1.2 PROTUES ISIS的工作界面 PROTEUS ISIS的工作界面是一种标准的Windows界面,如图2- 2所示。包括:标题栏、主菜单、标准工具栏、绘图工具栏、状

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值