EasyUi的封装
何老师的框架中对EasyUi进行了封装,下边介绍下
namespace Util.Ui.Base(控件基类命名空间)
IOption(选项顶级接口)定义一些通用的属性
OptionBase(选项基类)
public abstract class OptionBase<T> : IOption<T> where T : IOption<T> 实现了IOption接口,带一个T泛型,这个泛型约束与IOption接口
带一个成员EasyUiAttributeBuilder _builder; GetAttributeBuilder()(获取属性生成器),下边先介绍下这个属性生成器
——EasyUiAttributeBuilder 类派生于 AttributeBuilder (属性生成器类)
——AttributeBuilder(属性生成器类) private readonly Dictionary<string, IAttributeNode> _nodes; 他有一个IAttributeNode的接口
————IAttributeNode(属性节点接口) 属性节点就是style="width:100px;height:200px"中的 width:100px;height:200px 两个类实现了这个接口,就是可以获得两种格式的属性节点
——————AttributeListNode(属性列表节点类,实现了IAttributeNode接口)
指定值分隔符 ValueSeparator = ";"; 私有成员_values = new List<string>(); 构造函数AttributeListNode( string value = "" )
实现向_values中Add(添加)、Remove(移除)、Clear(清空)
GetResult()获得输出结果 _values.Join( "", ValueSeparator ); 实现结果a;b;c;d ;GetValue()输出和GetResult()一样
——————NameValuesAttributeNode(名-值列表"属性节点,实现了IAttributeNode接口)
私有成员_values = new List<string>(); Name(属性名称) 、AttributeSeparator(属性和属性值直接的字符,指定是等于号=)、ValueSeparator(属性值直接的分隔符号,指定是分号;)、ValueQuotes(属性值两边的符号,指定是双引号\")
实现向_values中Add(添加)、Remove(移除)、Clear(清空),添加的都是属性值
GetValue() 获得属性值,比如width:100px;height:200px,GetResult() 获得整体输出,比如style="width:100px;height:200px"。重写了ToSring函数,获得整体的输出
属性生成器中private readonly Dictionary<string, IAttributeNode> _nodes; 用_nodes保存一些键值对
AttributeBuilder( string attributeSeparator = "=", string nodeSeparator = " " ) 构造函数中,第一个是属性与属性值直接的符号,默认是等于号= 。第二个参数是属性节点分割符号,默认是空格
JsonAttributeBuilder _dataOptionBuilder;(Json属性生成器类,这个类中有一个AttributeBuilder成员,我们先介绍完AttributeBuilder类在介绍这个类)
public bool Contains( string name ) (是否包含指定的项)、public int Count => _nodes.Count;(返回项目数目)
public string Get( string name )(返回获取属性值 return _nodes[name].GetValue();) 这里的GetValue()调用的是IAttributeNode定义的,有两个类分别对这个函数进行了实现,这样在运行时,针对不同类的对象,调用各自的GetValue()进行输出属性值,这里只输出属性值,NameValuesAttributeNode类中不输出Name属性
public void Add( string value ) public void Add( string name, string value, string separator = ";", string quotes = "\"" ) 分别对两个不同类型实现了两个Add函数
public void Update( string name, string value, string separator = ";", string quotes = "\"" )(更新属性值,不存在则添加)
public void Remove( string name )(移除属性)
public string GetResult()(获取输出结果),重写了ToString函数输出结果
以下是一些扩展 public void AddClass( string @class )(添加类)、public void UpdateClass( string @class )(更新类)、public void RemoveClass( string @class )(移除类)
public void AddStyle( string name, string value )(添加样式)
public void AddDataAttribute( string name, string value ) (添加data-属性)、public void AddDataOption( string name, string value, bool isAddQuote = false )(添加data-options属性)
————JsonAttributeBuilder _dataOptionBuilder;(Json属性生成器类,这个类中有一个AttributeBuilder成员)这是的属性与属性值之间符号是冒号: 属性分割符号是逗号,
以上属性生成器类全部介绍完毕EasyUiAttributeBuilder 类派生于AttributeBuilder(属性生成器类),OptionBase(选项基类)带着一个这样的成员,属性这里操作基本都可以搞定了
下边继续介绍OptionBase(选项基类)
AddDataOption函数针对不同的参数类型有好六个,借助EasyUiAttributeBuilder的_builder实现了添加属性的功能
public virtual T Width( int? width, bool isPercent = false ) (设置宽度,就是增加宽度属性,然后返回this对象 return AddDataOption( "width", value );)
public virtual T Height( int height )(设置高度)
public T AddAttribute( string name, string value )(添加属性)
public T UpdateAttribute( string name, string value )(修改属性)
public T AddAttribute( string name, bool value )(添加属性)
public T AddStyle( string name, string value )(添加样式 )
public T AddClass( string @class )(添加class属性)
protected T UpdateClass( string @class )(更新class属性)
protected T This() { //返回组件
return (T)( (object)this );
}
protected string GetOptions() (获取选项,就是获得控件属性的输出 return _builder.GetResult();)
public T Margin( int top, int right, int bottom, int left )(设置外边距)
public T Padding( int top, int right, int bottom, int left )(设置内边距)
OptionBase类派生了两个类,一个是ComponentBase(组件基类);一个是ContainerBase(容器基类)
——ComponentBase(组件基类)没有构造函数
public T Id( string id ) (就是设置Id属性 return UpdateAttribute( "id",id );) public string GetId() (获得Id)
public T AddAfter( string html )(在控件后添加html)
public virtual string ToHtmlString()(把空间代码输出到网页,这里有一个虚拟方法GetResult(),以后派生的类都重写这个虚拟方法后,把控件主体代码加上,然后加上属性输出)
——ContainerBase(容器基类)构造函数中传入参数ITextWriter ,这个接口有两个方法,void Write( string text );(写入文本)、string GetResult();(获取结果)
有两个类实现了这个接口,一个是StringBuilderWriter(文本写入器类)write函数加入文本,GetResult()函数输出文本
TextWriter(写入文本到文件)这个好像没有实现输出的功能,
Begin()(容器起始标签)把div和属性加入到ITextWriter string.Format( "<div {0}>", GetOptions() );
public void End() 把"</div>"; 加入到ITextWriter
Begin()中有一个Wrapper包装 ContainerWrapper(容器包装器,用来支持using,在using使用完毕直接执行 Dispose()销毁函数,这个类实现了IDisposable接口)
public void Dispose() {
_container.End(); //执行销毁函数,刚好把</dvi>加上,最后在一起输出
}
ComponentBase(组件基类) 与 ContainerBase(容器基类) 各自都有不少的派生类,实现具体的控件代码,相对来说ContainerBase(容器基类)派生的类代码较少,我们先看ContainerBase(容器基类)的派生类
ContainerBase(容器基类)共派生了5个类,分别是Form(表单类)、Layout(布局类)、LayoutRegion(布局区域类)、TabPanel(选项卡面板类)、Tabs(选项卡类),他们构造函数都传入一个ITextWriter textWriter 这个writer的内容是HtmlHelper.ViewContext.Writer;
————Form(表单类)public Form( ITextWriter textWriter ) 构造函数传入文本写入器
public IForm Id( string id ) (设置Id属性)、public IForm Action( string url )(设置服务端Url,就是设置form的action)、public IForm Confirm( string message )(保存前弹出的框)、public IForm Post()(设置提交方式)、protected override string GetBeginResult()(重写起始表示,默认是<div )、protected override string GetEndResult()(重写结束标示)
————Layout(布局类)构造函数中增加了AddClass( "easyui-layout" );ddDataOption( "fit", true );
ComponentBase(组件基类)派生了八个下级类,分别是TextBox(文本框类)、ButtonBase(按钮基类)、DataGrid(表格类)、DataGridColumn(表格列类)、Menu(菜单类)、MenuItem(菜单项类)、Pagination(分页类)、Tree(树类)
——TextBox(文本框类)
文本框中涉及两个成员 private readonly Validator _validator;(验证器) 验证器就是获得一些EasyUi的验证属性,通过GetResult()输出
private readonly ArrayBuilder _onchangeBuilder;(onchange数组生成器)成员有Method(js函数名)、_list(参数名) string GetResult() (返回参数或者函数全部 输出格式: Method([a,b])) 、重载了ToString()进行输出
public T Name( string name )(设置Name属性)、public T Prompt( string text )(设置文本框内的提示消息)、public virtual T Value( string value )(设置值)、public T Password()(设置伟密码框)、public T MultiLine( int width, int height )(设置为多行文本框)、public T Disable( bool disabled = true )(禁用文本框)、public T ReadOnly( bool readOnly = true ) (设置为只读)、public T Editable( bool editable = true ) (设置为可编辑)、public T Icon( string iconClass, int width = 18, AlignLeftRigth align = AlignLeftRigth.Right )(设置文本框图标)、public T Button( string iconClass, string clickCallback, string text = "", AlignLeftRigth align = AlignLeftRigth.Right )(设置文本框按钮)
public T OnChange( string callback )(设置文本框文本改变事件处理) 这里的callback是参数
public T Delay( int time )(设置延迟验证的时间)、public T TipPosition( AlignLeftRigth align )(设置提示框位置)、public T NoValidate()(设置关闭验证)、public T Required( bool isRequired = true )(设置文本框为必填项)、public T Email()(设置Eamil验证)、public T EqualTo( string targetId, string message = "" )(设置相等验证)、public T Date()(显示日期框)、public virtual T Number( int precision )(设置为数字文本框)、public virtual T Int()(设置为整数文本框)
protected void AddValidations()(把验证输出的字符串添加到属性)
protected void AddEvents() (设置方法名,添加事件)目前只有看到onChange事件
protected override string GetResult()(重载GetResult函数,进行input属性的输出),这里的 GetOptions()输出 OptionBase类中定义的属性生成器_builder return _builder.GetResult();
EntityTextBox(实体文本框,派生于TextBox类)可以从Lambda表达式中获取Name和Value