一种在Web页面上动态显示圆角矩形的方法和Web服务器技术

技术编号:2916207 阅读:400 留言:0更新日期:2012-04-11 18:40
本发明专利技术实施例提供一种在Web页面上动态显示圆角矩形的方法和Web服务器,该方法包括:服务器接收用户终端发送的访问Web页面的请求,对于页面中的圆角矩形区域,预置的圆角矩形组件根据页面中为该圆角矩形组件指定的属性值,绘制出圆角矩形,并将该圆角矩形传递给服务器,服务器将包含圆角矩形的信息发送给用户终端;用户终端在浏览器上显示出圆角矩形。根据本发明专利技术实施例,在用户访问页面时,圆角矩形组件动态绘制图片,并由服务器传送到终端显示,当需要调整圆角矩形的显示时,只需要改变页面为圆角矩形组件指定的属性值,就可以使圆角矩形组件根据新的属性值绘制新的圆角矩形,维护方便。

【技术实现步骤摘要】

本专利技术涉及Web页面的显示技术,尤其涉及在Web页面上显示圆角矩形的方法及Web服务器。
技术介绍
在Web应用系统中,如图1所示,经常会在页面的某些展示区域使用圆角矩形作为信息的显示面板,以达到更加美观和整洁的显示效果。仅仅依靠Html提供的标准元素能够让浏览器上显示严格矩形,不能够显示带有复杂形状边界的圆角矩形。为了解决这个问题,现有技术中在Web页面上圆角矩形中的圆角部分用预先存储的图片作为背景,具体地,首先由美工人员预先绘制若干个包含圆角的图片,以图片文件的形式存储在服务器的存储媒介中,再由Web系统的页面设计人员修改样式表文件,分别指定页面中圆角矩形的四个角区域的背景图片为上述存储的包含圆角的图片,圆角矩形的其他区域放置Html提供的标准元素,当用户终端向服务器发送访问页面的请求后,服务器依次将Web页面的Html代码发送给用户终端的浏览器,浏览器将这些Html代码显示成图形或者文字,其中当浏览器解析到圆角矩形的圆角区域时,会获得作为背景的图片文件的链接地址,然后浏览器向服务器发送获得该文件信息的请求,该请求中包含文件的链接地址,服务器接收到该请求后根据链接地址,在存储媒介中找到浏览器想要获得的文件并以二进制流的形式发送给用户终端,用户终端的浏览器将接收到的二进制流显示成图片,这样圆角矩形的四个圆角部分就在浏览器上显示出来,圆角矩形的其他部分可以通过浏览器解析Html代码中预先设置的标准元素来显示。在系统要求发生变化时,例如基于整个页面风格变化的需要,页面中的圆角矩形的颜色、圆角的尺寸和圆角弧度等参数也需要做相应调整,此时采用上述现有技术的圆角矩形若要实现这样的调整,则需要美工人员根据新的-->要求重新绘制包含四个圆角的矩形图片,并需要网页设计人员重新调整样式表文件,使圆角矩形的四个角区域指定新的图片文件作为背景,这样当用户终端访问该页面时,服务器可以根据新的包含圆角的背景图片文件的链接地址,将新的背景图片以二进制流的形式发送给用户终端,浏览器将新的背景图片显示在页面中的圆角矩形的圆角区域。由此可见,当需要改变圆角矩形时,不仅需要美工人员重新绘制图片,还需要网页设计人员修改样式表,维护较麻烦。
技术实现思路
本专利技术解决的技术问题是提供一种在Web页面上动态显示圆角矩形的方法,以解决目前技术中由于采用静态背景图片实现圆角矩形显示所带来的维护麻烦的问题。为解决上述问题,本专利技术提供一种在Web页面上动态显示圆角矩形的方法,该方法包括:服务器接收用户终端发送的访问Web页面的请求,对于页面中的圆角矩形区域,预置的圆角矩形组件根据页面中为该圆角矩形组件指定的属性值,绘制出圆角矩形,并将该圆角矩形传递给服务器,服务器将包含圆角矩形的信息发送给用户终端;用户终端根据接收的包含圆角矩形的信息在浏览器上显示。这样,在用户终端通过浏览器访问需要显示圆角矩形的页面时,服务器将包含圆角矩形组件动态绘制的圆角矩形发送给用户终端,在页面需要维护的时候,圆角矩形的显示结果也需要做相应调整,上述技术方案不需要如现有技术中美工人员重新绘制背景图片,而只需要改变页面中指定的圆角矩形的属性值,这样当用户再访问该页面时,圆角矩形组件根据指定的新属性值绘制新的圆角矩形,并由服务器发送到用户终端上的浏览器中显示,所以本专利技术提供的显示圆角矩形的方法更用以维护。在上述方法中,指定的圆角矩形组件的属性值包括表示圆角矩形形状特-->征的属性值和表示圆角矩形颜色特征的属性值;圆角矩形组件根据预先指定的表示圆角矩形形状特征的属性值和表示圆角矩形颜色特征的属性值,动态绘制圆角矩形。这样只需要改变指定的表示圆角矩形的形状和颜色的特征值,就可以实现圆角矩形的变化。上述方法中,表示圆角矩形形状特征的属性值包括:表示圆角矩形的四个角中需要使用圆角的角的Target属性值;表示需要使用的圆角的弧度的Radius属性值;表示圆角矩形的宽度和高度的Height属性值和Width属性值;圆角矩形组件根据预先指定的圆角矩形组件的属性值动态绘制出圆角矩形的步骤包括:圆角矩形组件根据预先指定的圆角矩形组件的Target属性值,识别需要使用圆角的角,并在需要使用圆角的角区域绘制与Radius属性值、BgColor属性值、Height属性值和Width属性值相对应的圆角矩形。表示圆角矩形颜色特征的属性值包括:表示圆角矩形的背景颜色的BgColor属性值;表示圆角矩形的边框颜色的BorderColor属性值;圆角矩形组件根据预先指定的所述圆角矩形组件的属性值动态绘制出圆角矩形的步骤包括:圆角矩形组件绘制与BgColor属性值、BorderColor属性值相对应的圆角矩形。在上述方法中,还包括服务器端在页面的圆角矩形的中间区域控制显示的文字内容的步骤。这样圆角矩形就作为文字信息的展示面板。在上述方法中,预先指定的圆角矩形组件的属性值还包括:表示是否自动出现水平滚动条的IsHScroll属性值,或/和表示是否自动出现垂直滚动条的IsVScroll属性值;如果所述IsHScroll属性值为是,则在圆角矩形的中间显示的文字内容超-->过所述圆角矩形的宽度时,所述服务器端控制在页面的圆角矩形中显示水平滚动条;如果所述IsVScroll属性值为是,则在圆角矩形的中间显示的文字内容超过所述圆角矩形的高度时,所述服务器端控制在页面的圆角矩形中显示垂直滚动条。这样可以达到当文字信息过多时仍然保持较好的显示效果。在上述方法中,圆角矩形组件的定义由JAVA语言编写制作。本专利技术另一方面还提供了一种Web服务器,其包括:接收单元,用于接收用户终端发送的访问页面的请求信息;圆角矩形处理单元,用于将Web页面中指定给圆角矩形组件的属性值传递给圆角矩形组件并接收圆角矩形组件绘制的圆角矩形;发送单元,将包含圆角矩形的信息发送给用户终端。这样,在用户发送访问包含圆角矩形的页面时,上述服务器能够将圆角矩形动态画出的圆角矩形发送给用户终端,用来显示,在页面需要调整时,对于圆角矩形只需要给变指定的属性即可,页面的维护方便。在上述Web服务器中,还包括用于存储预先制作的圆角矩形组件的圆角矩形组件实现单元。附图说明图1是页面中显示的一种圆角矩形的示意图;图2是本专利技术实施例提供的一种在Web页面上动态显示圆角矩形的方法流程图;图3是本专利技术实施例中对圆角矩形区域进行划分的示意图;图4是本专利技术实施例提供的一种Web服务器的结构示意图;图5是本专利技术实施例提供的另一种Web服务器的结构示意图。具体实施方式-->本专利技术的核心是利用圆角矩形组件实现动态绘制圆角矩形,以解决目前技术中采用静态背景图片实现圆角矩形显示所带来的维护麻烦的问题。下面结合附图对本专利技术作进一步的说明。本专利技术实施例提供一种在Web页面上动态显示圆角矩形的方法,如图2所示,该方法包括如下步骤:S1:用户终端发送访问包含圆角矩形的Web页面的请求至服务器;S2:服务器接收到该用户终端发送的请求后,对于页面中的圆角矩形区域,预先制作的圆角矩形组件根据页面中为该圆角矩形组件指定的属性值,绘制出圆角矩形,并将该圆角矩形传递给服务器,服务器将包含圆角矩形的信息发送给用户终端;其中,上述圆角矩形组件可以由Web页面设计人员预先设计制作,并在包含圆角矩形组件的Web页本文档来自技高网
...

【技术保护点】
一种在Web页面上动态显示圆角矩形的方法,包括: 服务器接收用户终端发送的访问Web页面的请求,对于页面中的圆角矩形区域,预置的圆角矩形组件根据页面中为该圆角矩形组件指定的属性值,绘制出圆角矩形,并将该圆角矩形传递给服务器,服务器将包 含圆角矩形的信息发送给用户终端; 用户终端根据接收的包含圆角矩形的信息在浏览器上显示。

【技术特征摘要】
1、一种在Web页面上动态显示圆角矩形的方法,包括:服务器接收用户终端发送的访问Web页面的请求,对于页面中的圆角矩形区域,预置的圆角矩形组件根据页面中为该圆角矩形组件指定的属性值,绘制出圆角矩形,并将该圆角矩形传递给服务器,服务器将包含圆角矩形的信息发送给用户终端;用户终端根据接收的包含圆角矩形的信息在浏览器上显示。2、根据权利要求1所述的方法,其特征在于,所述指定的圆角矩形组件的属性值包括表示圆角矩形形状特征的属性值和表示圆角矩形颜色特征的属性值;所述圆角矩形组件根据预先指定的表示圆角矩形形状特征的属性值和表示圆角矩形颜色特征的属性值,动态绘制圆角矩形。3、根据权利要求2所述的方法,其特征在于,所述表示圆角矩形形状特征的属性值包括:表示圆角矩形的四个角中需要使用圆角的角的Target属性值;表示需要使用的圆角的弧度的Radius属性值;表示圆角矩形的宽度和高度的Height属性值和Width属性值;所述圆角矩形组件根据预先指定的所述圆角矩形组件的属性值动态绘制出圆角矩形的步骤包括:所述圆角矩形组件根据预先指定的圆角矩形组件的Target属性值,识别需要使用圆角的角,并在需要使用圆角的角区域绘制与Radius属性值、BgColor属性值、Height属性值和Width属性值相对应的圆角矩形。4、根据权利要求2所述的方法,其特征在于,所述表示圆角矩形颜色特征的属性值包括:表示圆角矩形的背景颜色的BgColor属性值;表示圆角矩形的边框颜色的BorderColor...

【专利技术属性】
技术研发人员:张旭
申请(专利权)人:深圳市金蝶中间件有限公司
类型:发明
国别省市:94[中国|深圳]

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1