【实现】表单控件里的子控件的变化。

简介:      前情回顾: 【实现】表单控件的UI布局,实现方式         上一篇说的是表单布局上的变化,也就是通过TR、TD的设置,实现了多行多列的效果。那么格子画好了,我们 可以往里面放控件了。

 

     前情回顾: 【实现】表单控件的UI布局,实现方式 

 

     上一篇说的是表单布局上的变化,也就是通过TR、TD的设置,实现了多行多列的效果。那么格子画好了,我们

可以往里面放控件了。上次都是用的文本框,这个显然是不行的,还要扩大这个范围。

    

     这个控件的范围就比较大了,不光是TextBox、DropDownList,还有HTM编辑器这类的,都是可能会往里面放的,当然象GridView这样的就先不考虑了。另外还要可以扩展,可以随时增加新的子控件。

 

     那么控件得类型这么多,要如何控制呢?第一用基类,第二用接口。

 

     基类是.net FrameWork提供的,我们改不了,但是生成子控件的实例只能靠基类了,Controls.Add只能用Control,不能用接口吧。

 

     接口的作用就是取值、赋值,和属性的设置。

     取值赋值好理解,每个控件的取值都不太一样,TextBox用Text属性,DropDownList是SelectedValue,这些是不一样的,所以需要统一一下,要不然表单控件内部的代码会越来越多,无法控制。

     

     设置属性,比如TextBox需要设置TextMode、Columns、MaxLength,以便于控制是单行文本、多行文本还是密码,还有就是文本框的宽度、最大字符数等等;DropDownList要设置选项,一个空的下拉列表框是没有用处的。另外还有前台的js验证,这些都通过设置属性的方式来实现。

 

     接口的定义:

 

 

public   interface  IControlMgr
img_405b18b4b6584ae338e0f6ecaf736533.gifimg_1c53668bcee393edac0d7b3b3daff1ae.gif    
{
        
// 属性
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif
        /**//// <summary>
        
/// 统一的取值和赋值的属性
        
/// </summary>
        
/// <returns>控件的某个值</returns>

img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        string ControlValuegetset;}

        
// Properties
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif
        /**//// <summary>
        
/// 返回控件的类型 "201":文本框
        
/// </summary>

img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        string ControlKind get; }
        
        
//函数
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif
        /**//// <summary>
        
/// 根据kind获取控件的某个属性的值
        
/// </summary>
        
/// <param name="kind">取值方式</param>
        
/// <returns></returns>

        string GetControlValue(string kind);
        
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 根据kind设置控件的默认值
        
/// </summary>
        
/// <param name="kind">赋值方式</param>
        
/// <param name="value"></param>

        void SetControlValue(string kind, string value);

img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 通过控件的描述信息,进行自我描述。比如设置maxlength 等。
        
/// </summary>

        void ShowMe(JYK.Controls.Info.BaseColumnsInfo info,JYK.Data.DataAccessHelp dal);

    }

 

     继承.net FrameWork的控件,然后实现这个接口,我们的子控件就诞生了。

     在表单控件里面控制子控件就很容易了,几行代码就可以搞定,子控件的变化都交给了ShowMe()来实现。

 

// 定义接口,通过接口操作子控件
            IControlMgr iControl  =   null ;
            Control tmpControl 
=   null ;

            BaseColumnsInfo bInfo;

// 循环配置信息
             foreach  (KeyValuePair < int , BaseColumnsInfo >  info  in  dic_BaseCols)
img_405b18b4b6584ae338e0f6ecaf736533.gifimg_1c53668bcee393edac0d7b3b3daff1ae.gif            
{
                bInfo 
= (BaseColumnsInfo)info.Value;

img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif                
加载需要的子控件,有待完善#region 加载需要的子控件,有待完善
                
switch (bInfo.ControlKind)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                
{
                    
case "201":     //单行文本框
                    case "202":     //多行行文本框
                    case "203":     //密码文本框
                        tmpControl = new MyTextBox(); 
                        
break;

                    
case "205":     //下拉列表框
                        tmpControl = new MyDropDownList(); 
                        
break;

                   
                    
case "208":      // 多选()
                         tmpControl = new MyCheckBox(); 
                        
break;
                     
case "210":      // 多选组()
                         tmpControl = new MyCheckBoxList(); 
                        
break;

                    
case "211":  // HTML_FreeTextBox()
                        
//tmpControl = new MyDropDownList(); 
                        break;
 
                }

                
#endregion


                iControl 
= (IControlMgr)tmpControl;        //定义接口,通过接口操作子控件
                tmpControl.ID = "c_" + bInfo.ColumnID ;    //设置ID
                
this.Controls.Add(tmpControl);
//Add 后才会调用Onit函数
                iControl.ShowMe(bInfo, dal);                //让子控件自己描绘自己

}

 


表单控件的流程

 

添加数据:
1、得到页面请求,到配置信息里面读取需要的信息,绘制UI,生成并加载需要的子控件。


2、客户看到表单后填写信息,提交表单。提交之前可以进行js验证。


3、又得到信息了,这次是回传的,我们需要获取到用户输入的信息,这个通过接口来得到。


4、得到数据之后,根据字段类型进行安全检查。比如字段类型是int的,那么就必须是整数,是DateTime的,就必须是合法的时间,并且在有效范围内(1900-1-1 到9999-12-31)。在.net里面1899-1-1是合法的日期,但是在SQL Server里面却超出了有效范围。


5、然后我们可以根据配置信息拼接参数化的SQL语句,添加存储过程的参数。


6、借用“数据访问函数库”,把SQL语句提交给数据库执行。


7、检测是否出现异常。


修改数据:
     和上面的步骤差不多,增加一个给控件赋值的步骤就可以了,赋值也是通过接口来实现的,所以基本没有几行代码。

 

拦截:

     我们可以在第三步的前面和后面,加上“拦截”功能,进行“逻辑计算”,这样一般的需求就都可以应付了。

现在表单控件已经可以增加子控件和实现添加数据的功能了,当然还需要完善,尤其是“属性设置”这一块,需要很好的规划。

 

 

下图是表单控件和查询控件与各个子控件的关系图,通过接口IControlMgr来实现对子控件的取值、赋值和属性设置。

 

 

 

 

下图是表单控件可以实现的效果

 

 

相关文章
|
2月前
|
存储 前端开发 JavaScript
处理子表单数据
处理子表单数据
24 2
|
2月前
【sgDragSize】自定义组件:自定义拖拽修改DIV尺寸组件,适用于窗体大小调整
【sgDragSize】自定义组件:自定义拖拽修改DIV尺寸组件,适用于窗体大小调整
|
12月前
|
编解码 C# 图形学
winform-SunnyUI控件解决大小位置变化
winform-SunnyUI控件解决大小位置变化
373 0
|
前端开发 JavaScript API
交互设计:隐藏或显示大段文本的UI组件有哪些?
应用场景: 在手机上要给列表中的每一项添加一个大段的介绍,应该用什么UI组件 A: 这里可以用,模态对话框,弹出提示,工具提示这类组件。模态对话框的好处,就是用关闭的按钮,用户操作方便;而弹出提示和工具提示只能通过点击来切换   模态对话框: http://v2.bootcss.com/javascript.html#modals http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html Bootstrap 模态框(Modal)插件 模态框(Modal)是覆盖在父窗体上的子窗体。
1476 0
动态控制SAP C4C UI元素的显示和隐藏
动态控制SAP C4C UI元素的显示和隐藏
动态控制SAP C4C UI元素的显示和隐藏
|
存储 SQL 测试技术
【实现】表单控件的UI布局,实现方式
 一、先说一下表单控件要实现的功能吧。        1、绘制UI,包括表格(Table)的绘制,也就是TR 、TD,TR是多少行,TD是有多少列;包括子控件的控件,TextBox、DropDownList、CheckBoxList等控件的加载、描述(宽度、最大字符数、填充item)等。
1471 0
|
存储 SQL
表单控件的副产品——查询控件
查询控件 温故而知新能自己“跑”的表单控件,思路,雏形,源码。vs2005版本 表单控件续(1)——应用接口来简化和分散代码     当初在写表单控件的时候,突然想到,这个表单控件稍微修改一下不就是一个查询控件了吗?     那么查询控件需要做的什么事情呢?          1、自己描绘控件,比如能够自己添加文本框、下拉列表框这一类的控件。
636 0
|
C#
WPF Label控件在数据绑定Content属性变化触发TargetUpdated事件简单实现类似TextChanged 事件效果
原文:WPF Label控件在数据绑定Content属性变化触发TargetUpdated事件简单实现类似TextChanged 事件效果   本以为Label也有TextChanged 事件,但在使用的时候却没找到,网友说Label的Content属性改变肯定是使用赋值操作,赋值的时候就可以对其进行相应的操作所以不需TextChanged 事件。
1979 0
|
C#
WPF关于控件 父级控件,子级控件,控件模板中的控件,等之间的相互访问
原文:WPF关于控件 父级控件,子级控件,控件模板中的控件,等之间的相互访问 1,在菜单中访问 弹出菜单的控件 var mi = sender as MenuItem;//菜单条目 MenuItem var cm = mi.
948 0
|
C#
WPF查找子控件和父控件方法
原文:WPF查找子控件和父控件方法 public List GetChildObjects(DependencyObject obj, string name) where T : FrameworkElement { Dependen...
1371 0