网站登录用的会话框的实现方法及系统与流程

文档序号:11458475阅读:203来源:国知局

本发明涉及网络会话框设置领域,具体涉及一种网站登录用的会话框的实现方法及系统。



背景技术:

现有网站中登录用的会话框,用于引导用户去登录相应的网站。目前,网站登录用会话框一般采用dialog创建,创建会话需要输入大量的代码,创建过程比较复杂,而且输入的代码难以复用,进而使得功能会话框的效果比较单一,生命周期较短。



技术实现要素:

针对现有技术中存在的缺陷,本发明解决的技术问题为:如何创建出功能多样化、能够复用的网站登录用会话框。

为达到以上目的,本发明提供的网站登录用的会话框的实现方法,包括以下步骤:

s1:创建会话框文件,在对会话布局文件中,按照由上至下的顺序依次添加:头部信息层、第三方登录选择层、主用登录层和登录协议信息层;

头部信息层中设置有头部信息文字控件、线条控件和会话框关闭控件,文字控件位于线条控件的图层之上,会话框关闭控件位于线条控件的左侧或右侧;会话框关闭控件中设置有一幅关闭信息图片,关闭信息图片用于:被点击时触发会话框关闭功能;

第三方登录选择层包括至少2层第三方登录选择子层,第三方登录选择子层中设置有一幅第三方登录方式选择图片,第三方登录方式选择图片用于:被点击时触发第三方登录软件的跳转功能;

主用登录层中设置有一幅主用登录图片,该图片用于:被点击时触发主用登录软件的跳转功能;

登录协议信息层中设置有登录协议信息控件;

s2:将会话框文件与对应的网站进行关联。

本发明提供的网站登录用的会话框的实现系统,包括会话框模块和会话框展示模块;

会话框模块用于:创建会话框文件,在对会话布局文件中,按照由上至下的顺序依次添加头部信息层、第三方登录选择层、主用登录层和登录协议信息层;

头部信息层中设置有头部信息文字控件、线条控件和会话框关闭控件,文字控件位于线条控件的图层之上,会话框关闭控件位于线条控件的左侧或右侧;会话框关闭控件中设置有一幅关闭信息图片,关闭信息图片用于:被点击时触发会话框关闭功能;

第三方登录选择层包括至少2层第三方登录选择子层,第三方登录选择子层中设置有一幅第三方登录方式选择图片,第三方登录方式选择图片用于:被点击时触发第三方登录软件的跳转功能;

主用登录层中设置有一幅主用登录图片,该图片用于:被点击时触发主用登录软件的跳转功能;

登录协议信息层中设置有登录协议信息控件;

会话框展示模块用于:将会话框文件与对应的网站进行关联。

与现有技术相比,本发明的优点在于:

(1)参见本发明的s1可知,本发明会话框中的所有元素控件层,均能够根据不同会话框的功能进行自定义设置,而且本发明的第三方登录选择层包括至少2层不同的第三方登录选择子层,进而为用户提供了多种不同的第三方登录方式,在使得会话框的功能多样化的同时,简化了会话框的创建过程,还能够将会话框中的元素控件层进行复用,显著提升了用户体验,非常适于推广。

与此同时,当会话框的功能发生改变时,只需要重新实例化本发明的会话框即可添加改变后的文字和图片,因此,本发明的生命周期较长。

(2)参见本发明s1可知,本发明的所有元素控件层由上至下排列,用户在查阅上述布局的会话框文件时,查阅顺序为:头部信息层:对应观看头部信息;第三方登录选择层:选择是否通过常用的第三方软件登录网站(一般都是第三方软件登录,因为比较常用);主用登录层:选择是否通过非常用的主用软件登录;登录协议信息层:选择是否查阅登录协议。上述查阅顺序用户的阅读逻辑完全相匹配,进一步提高了用户体验。

(3)本发明的第三方登录选择子层的数量为3层,能够为用户提高3种不同的第三方登录方式,用户的选择更多样化;与此同时,3层第三方登录选择子层中图片字体颜色和图片字体信息均不同,进而强烈体现出3层第三方登录选择子层的区别,进一步提升了用户体验。

(4)本发明的第三方登录选择层和主用登录层之间,还设置有文字隔离层,文字隔离层能够对第三方登录选择层和主用登录层进行区分,进而突出主用登录层,进一步提升了用户体验;与此同时,每幅第三方登录方式选择图片的图片字体颜色和图片字体信,均与主用登录图片不同,进一步突出了主用登录层与第三方登录选择层的区别,进一步提升了用户体验。

附图说明

图1为本发明实施例中网站登录用的会话框的结构示意图。

具体实施方式

以下结合附图及实施例对本发明作进一步详细说明。

本发明实施中的网站登录用的会话框的实现方法,包括以下步骤:

s1:创建会话框文件,该文件为xml(extensiblemarkuplanguage,可扩展标记语言)文件。参见图1所示,为了合理的布局,本实施例通过linearlayout(线性布局)在对会话布局文件中,按照由上至下的顺序依次添加以下元素控件层:头部信息层、第三方登录选择层、文字隔离层、主用登录层和登录协议信息层。为了保证布局的美观,本实施例通过linearlayout中的android:orientation="vertical,将上述所有元素控件层纵向排列。

参见图1所示,头部信息层中设置有头部信息文字控件、线条控件和会话框关闭控件。为了保证文字控件的清晰,文字控件位于线条控件的图层之上,线条控件用于区分文字控件和会话框关闭控件;会话框关闭控件位于线条控件的左侧或右侧,会话框关闭控件中设置有一幅关闭信息图片,关闭信息图片用于:被点击时触发会话框关闭功能。

头部信息层的实现方式为:

1、添加线条控件:通过<view>标签中的background属性android:background="@drawable/line",绘制一条横线。

2、在线条空控件的图层上添加头部信息文字控件:通过文本标签<textview>进行文字展示:

文字的具体内容通过android:text="具体内容"进行显示;

文字的颜色通过android:textcolor="@color/text_color_grey"进行设定。

3、在文字控件的右侧添加会话框关闭控件:会话框关闭控件中的关闭信息图片,关闭信息图片通过设置imageview中的src属性来进行设定的android:src="@drawable/icon_login_close_bg",设定android:layout_alignparentright="true",将会话框关闭控件位于文字控件的右侧。将关闭信息图片的id与会话框关闭功能绑定:android:id="@+id/close_btn",至此,本实施例在会话框关闭功能的代码中就能够通过findviewbyid的方法,找到对应的关闭信息图片并关联。

参见图1所示,第三方登录选择层用于实现登录方式的多样化,第三方登录选择层包括3层第三方登录选择子层,每层子层中各设置有一幅不同的第三方登录方式选择图片,定义所有子层中第三方登录方式选择图片分别为a、b和c,a、b和c分别用于:被点击时触发第三方登录软件1、2和3的跳转功能;为了更好的a、b和c进行区分,a、b和c图片字体颜色和图片字体信息均不同,a为绿色,b为蓝色,c为红色。为了保证布局的统一和美观,本实施例将3层第三方登录选择子层纵向排列。

a、b和c的实现触发第三方登录软件的跳转功能的方式为:

将a的id与第一登录软件的跳转功能绑定:android:src="@drawable/icon_第一登录软件_login;

将b的id与第二登录软件的跳转功能绑定:android:src="@drawable/icon_第二登录软件_login;

将c的id与第一登录软件的跳转功能绑定:android:src="@drawable/icon_第三登录软件_login。

参见图1所示,文字隔离层中设置有隔离信息文字控件,文字隔离层用于:对主用登录层和所有第三方登录选择子层进行区分,进而突出主用登录层。

参见图1所示,主用登录层中设置有一幅主用登录图片,该图片用于:被点击时触发主用登录软件的跳转功能,为了区分主用登录层和第三方登录选择层,主用登录图片的图片字体颜色和图片字体信息,均与每幅第三方登录方式选择图片不同。

参见图1所示,登录协议信息层中设置有登录协议信息控件。

本实施例中所有元素控件层由上至下排列的好处为:用户在查阅上述布局的会话框文件时,查阅顺序为:

1、头部信息层:对应观看头部信息;

2、第三方登录选择层:选择是否通过常用的第三方软件登录网站(一般都是第三方软件登录,因为比较常用);

3、主用登录层:选择是否通过非常用的主用软件登录;

4、选择是否查阅登录协议。

上述查阅顺序用户的阅读逻辑完全相匹配,显著提高了用户体验。

s2:通过自定义的函数showlogindialog,将会话框文件与对应的网站进行关联(即在网站登录界面上展示)。

s2的实现方式和原理为:showlogindialog函数主要是调用自定义类logindialog中的show方法来展示,logindialog是继承于dialogfragment类进行实现,即logindialog需要实现dialogfragment的相关回调函数、并在show函数中调用父类的函数即可实现对话框的展示。

logindialog中两个最关键的函数oncreatedialog和oncreateview函数的实现逻辑为:logindialog中首先会回调oncreatedialog函数,本实施例在oncreatedialog函数中设置了对话框的样式,通过dialog.getwindow().requestfeature(window.feature_no_title);和dialog.getwindow().setflags(windowmanager.layoutparams.flag_fullscreen,windowmanager.layoutparams.flag_layout_in_screen);来设置对话框的样式为没有标题栏同事布局为全屏。

通过上述方法设置完样式后需要告诉系统xml布局文件所对应的视图控件view,具体是通过logindialog中的回调函数oncreateview来返回系统所需要的视图view;此时要在oncreateview函数中将需要展示的xml返回。所以通过布局文件加载器。在oncreateview函数中查找和加载上述定义的xml文件,具体是通过调用layoutinflater.inflate(r.layout.activity_dialog_login)方法来进行加载的,其中activity_dialog_login是我们需要加载的xml的布局文件的名称。inflate方法会返回一个视图view控件,将获取到的view控件返回给系统即可。

通过上述oncreatedialog和oncreateview函数的调用系统已经可以找到需要展示的xml所对应的视图view了,然后在show函数中直接调用super.show();即可将会话框展示至网站登录界面。

在此基础上,本实施例还对showlogindialog函数自定义了一个隐藏登录对话框的函数hidelogindialog,hidelogindialog函数主要的实现也是在logindialog这个类中,在hidelogindialog主要是调用了dismiss()函数来讲对话框进行隐藏(调用dismiss能够隐藏的前提条件是上述的oncreatedialog和oncreateview函数均被正确实现了)。

本发明实施例中的网站登录用的会话框的实现系统,包括会话框模块和会话框展示模块。

会话框模块用于:创建会话框文件,在对会话布局文件中,按照由上至下、且纵向排列的顺序依次添加头部信息层、第三方登录选择层、文字隔离层、主用登录层和登录协议信息层。

头部信息层中设置有头部信息文字控件、线条控件和会话框关闭控件,文字控件位于线条控件的图层之上,会话框关闭控件位于线条控件的左侧或右侧;会话框关闭控件中设置有一幅关闭信息图片,关闭信息图片用于:被点击时触发会话框关闭功能。

第三方登录选择层包括至少2层第三方登录选择子层,第三方登录选择子层中设置有一幅第三方登录方式选择图片,第三方登录方式选择图片用于:被点击时触发第三方登录软件的跳转功能。

第三方登录选择子层的数量为3层,定义3层登录选择子层中的第三方登录方式选择图片,分别为a、b和c;a用于:被点击时触发第三方登录软件1的跳转功能,b用于:被点击时触发第三方登录软件2的跳转功能,c用于:被点击时触发第三登录软件3的跳转功能;a、b和c的图片字体颜色和图片字体信息均不同。每幅第三方登录方式选择图片的图片字体颜色和图片字体信,均与主用登录图片不同。

文字隔离层中设置有隔离信息文字控件。

主用登录层中设置有一幅主用登录图片,该图片用于:被点击时触发主用登录软件的跳转功能。

登录协议信息层中设置有登录协议信息控件。

会话框展示模块用于:将会话框文件与对应的网站进行关联。

至此,通过本发明的实施例可知,本发明在使得会话框的功能多样化的同时,会话框的创建过程比较简单,还能够复用;而且当会话框的功能发生改变时,只需要重新实例化本发明的会话框即可添加改变后的文字和图片。因此本发明的会话框的生命周期较长,显著的提升了用户体验,非常适于推广。

进一步,本发明不局限于上述实施方式,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也视为本发明的保护范围之内。本说明书中未作详细描述的内容属于本领域专业技术人员公知的现有技术。

当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1