博客园_船长

审批流设计方案的探究

2011-11-30T15:45:00Z

审批流属于工作流的范畴，一提起工作流，一般都会觉得那东西太复杂了，确实要做到一个方便的比较通用的工作流不是件简单的事情，但也不是那么难的事情，只是要花多的时间去琢磨和研究。这里我想给大家分享一个项目中涉及的一个审批流的简单的设计方案，完全按工作流的原理去设计可能就比较复杂了，也欢迎大家探讨。

此项目中各节点审批环节必须满足的要求：

1）要求现实多人多级审批

2）只有第一级全部审批意见通过时（一票否决制），下一级审批人员才能进行审批操作。

3）若第一级审批有审批不通过和审批通过情况并存，审批通过并送审下级审批，下级审批人员可以看到内容但不能操作。

4）若当前审批级别中一个审批人进行了回退回退操作，启动人可以编辑再次送审，无需等待其它他审批人员审批完成。

5）第二审批级别(或以上)回退时，重新启动第一级审批操作，启动人重新送审。

6）当所有级别的审批人员全部审批同意时，该项目节点完成。

基本上以上要求和一般的审批流程相似，下面是物理数据模型的设计：

审批规则对应到节点，一个项目由多个环节（节点组成），如立项，合同订立，发公告等，一个节点可设置一个或多个审批级别，每个审批级别可以设置一个或多个审批角色。项目流程表的数据是当启动一个节点时会向该表插入一条数据，节点状态分为未启动，已启动，送审中，审批完成，审批不通过，当前审批级别和当前审批轮次在节点启动时默认都为1，表示开始从第一级第一轮审批开始，这里的审批轮次是必要的，由上面需求的第4点可确定，之所以有轮次，是由于有审批不通过的情况存在。比如项目启动人送给第一级的两个人（A和B）审批，假设A审批不通过，B审批通过，该级审批是不通过的，启动人可以重新编辑发起该级别的下一轮送审，这里有一个问题需要考虑到，有可能第一轮送审给A,B,C三人，A,B不同意，C没有即使参与第一轮审批，启动人第二轮只送审了A,B，这时审批轮次其实已经到了第二轮了，C之后的审批只是针对第一轮，无论同意与否也不会影响最终结果。但是如果启动人第二轮还是送审了A,B,C三个人，C只会看到一次审批操作而不是两次，那么C此时审批操作会涉及到第一轮和第二轮审批情况，如果C同意，第一轮的意见也会置为同意，这并不矛盾，之前错过审批轮次的意见以最后轮次的意见为主，也就是以最后决定作为判决结果，其实这也就意味着每一级审批通过的条件是已最后一轮的审批全部通过为依据的(如果该级有多轮审批的话)。审批记录表的操作状态分为待审批，审批通过，审批不通过，该表也有审批级别和审批轮次两个字段记录，这两个字段记录与项目流程表里的级别和轮次是不同的，只有当审批记录表的审批级别与项目流程表的当前审批级别相同并且操作状态为待审批时，才可以进行审批操作。审批记录表的审批轮次我们可以理解为操作轮次，因为有可能当前审批轮次到第5轮了，某个审批人员的操作轮次停留在第三轮。下面是流程图，还是有图有真相，直观些。

图中最大操作轮次是当前审批人参与的最后一轮的审批的轮次，就是之前所说的一个人可能参与多轮审批，之前几轮没有登录系统操作，最后登录审批时一次性审批。这里的最大操作轮次的值始终是小于等于当前审批轮次的值的，每进行一次回退操作，当前审批轮次的值加1，条件是当前最大操作轮次与当前审批轮次的值相等时，因为有两种情况不需要加1，一是同一轮次多人回退时，进入下一轮只需进行一次加1操作，二是当前审批操作的是以前的审批轮次时也不需要加1操作（例如现在已经进入某一级审批的第三轮审批，而审批人进行的是第二轮审批的回退操作），审批操作按钮的显示是根据审批人在审批记录表中是否有当前审批级别的待审记录。

下面是验证效果运行图：

　 1）设置立项节点为两级审批

2）用户luce登录系统送审

2) 数据库表数据情况：项目流程表和审批记录表

3）peace登录系统审批通过

4）justlike审批不通过

5）节点情况和数据库记录情况：

6）luce登录系统重新送审

7）peace审批不通过

8）luce在kitty审批前重新送审给peace和kitty

如上图，进入一级审批的第三轮审批

　9）kitty登录系统进行审批操作

之前没有审批的第二轮操作，在进行第三轮审批时进行了同样的操作，最后一轮的决定影响以前没有审批过的轮次的决定。

　10）peace登录系统审批通过

第一级审批完成，启动第二级第一轮审批

第二轮由jim和kite审批，jim审批的记录有两条，是一级审批第一轮peace送审的和第三轮kitty送审的

11）jim登录系统审批通过

因为立项节点只设置了两级审批，jim属于最高级别审批人员，所以不需再向上送审。

12）kite审批不通过

重新回到第一级审批，启动一审第四轮审批

13）节点启动人luce重新送审

14）peace登录系统审批通过

peace审批通过时，第一级审批通过，启动第二级审批的第二轮审批

15）jim审批通过

上图中两级审批通过后节点状态为完成状态

模拟的是两级审批，基本上审批过程如上图，这个流程设计还是有一个缺陷地方，如果当前审批级别为二级(或以上级别)，并且有多个人审批，若第一个人审批不通过的话，那么会直接退回到第一级审批，那么处在第二级(或以上级别)有待审记录的操作用户也没法进行审批操作了，因为当前的审批级别已经不是第二级了，重新送审流程走到二级时用户才能操作，上面的截图流程没有走这种情况，当然这并不影响最终的项目节点流程走向。如果要考虑存在的缺陷，那么可能还是要遵从工作流的设计原理了，到此算是写完了，仅供参考，有叙述不正确之处望指正。

本文链接

WEB项目(B/S系统)打包安装（总结篇）

2011-07-31T11:32:00Z

打包安装程序的制作选择性还很多的，有installshield，wise installer,inno setup这几个做打包安装项目都是很强大的，要搞出界面大气个性化的安装，还是得用这几个才行，我这篇说的是.NET自带的安装项目打包WEB系统的，.NET打包安装项目虽然傻傻的，也比较丑，但是搭建安装项目快速也能满足总体的要求，如果没有足够的时间研究重量级的安装工具，短时间内用.NET自带的安装项目也是一个良好的选择。网上有很多关于用.NET打包WEB项目的文章，大体是那样的，但不是很全面，有个别细节并没有涉及，先说下这个安装打包项目的主要功能：

一、安装前系统检测

主要检测SQL SERVER是否安装，站点名称和端口号是否重复等，framework自动检测没有的话先安装，本身自带就有此功能，IIS是必须要求的，不然没法创建站点。

二、项目文件安装到指定文件夹并根据安装时的数据库配置修改webconfig连接

三、附加数据库

打包时可以把mdf文件放到WEB项目文件夹下，生成安装文件时就会自动打包进去，安装时执行附加即可。

四、注册COM组件（如果项目中涉及到COM的话）

五、创建WEB站点

六、创建虚拟目录

这里的虚拟目前是根据打包的项目需要进行的，因为有的WEB项目结构比较复杂，比如一个系统除了本身项目的发布文件，还有另外的独立特殊功能的项目作为虚拟目录的形式一起运行，类似于插拔式的插件一样，需要的话直接拷贝到站点下，设置虚拟目录，系统菜单做好链接指向其页面就可以了。

七、创建桌面快捷方式

比如可以把系统的登录页面或其它起始页作为安装时指定的快捷方式

八、项目卸载

项目的卸载主要包括删除项目文件，卸载附加的数据库，删除站点及桌面快捷方式等

安装WEB项目的前提条件是需要在用户电脑上先安装SQL SERVER数据库(或其它数据库)和IIS信息管理器。

1）安装项目主要涉及的是安装类里面的操作，包括安装和卸载的方法重写等，安装时需要记录用户通过安装界面输入的信息，这里我们可以用XML文件作为记录配置文件，主要是在卸载的时候需要用到用户输入的相关信息，数据库连接串的记录操作如下：

/// <summary>
        /// 获取数据库登录连接字符串
        /// </summary>
        /// <param name="databasename">数据库名称</param>
        /// <returns></returns>
        private string GetConnectionString(string databasename)
        {
            string ConnStr = "server=" + Context.Parameters["server"].ToString() + ";database=" + (string.IsNullOrEmpty(databasename) ? "master" : databasename) + ";uid=" + Context.Parameters["user"].ToString() + ";pwd=" + Context.Parameters["pwd"].ToString();
            if (string.IsNullOrEmpty(databasename)) //将连接串写入XML文件，供卸载操作时读取
            {
                dbpath = Path.Combine(this.Context.Parameters["installdir"].ToString(), "dbconfig.xml");
                OperateXML.UpdateXMLNode(dbpath, "ConnString", ConnStr);
            }
            else
            {
                dbpath = Path.Combine(this.Context.Parameters["installdir"].ToString(), "dbconfig.xml");
                OperateXML.UpdateXMLNode(dbpath, "DbName", databasename);
            }
            return ConnStr;
        }

2）安装检测

/// <summary>
        /// 判断是否安装了SQL SERVER
        /// </summary>
        /// <returns></returns>
        private bool ExistSqlServerService()
        {
            bool Exist = false;
            ServiceController[] service = ServiceController.GetServices();
            for (int i = 0; i < service.Length; i++)
            {
                if (service[i].ServiceName.Length > 5 && service[i].ServiceName.Substring(0, 5) == "MSSQL") //if (service[i].ServiceName == "MSSQLSERVER")
                {
                    Exist = true;
                    break;
                }
            }
            return Exist;
        }

这里是根据服务名称判断的，如果是SQLSERVER EXPRESS版的话，服务名是MSSQL$EXPRESS，其它的数据库实例也是MSSQL$+实例名

/// <summary>
        /// 检测IIS及版本号
        /// </summary>
        /// <returns></returns>
        public string GetIISVerstion()
        {

            RegistryKey key = Registry.LocalMachine.OpenSubKey(@"SOFTWARE\Microsoft\INetStp");
            if (key == null)
                return string.Empty;
            else
                return Convert.ToString(key.GetValue("MajorVersion")) + "." + Convert.ToString(key.GetValue("MinorVersion"));

        }

string entPath = String.Format("IIS://{0}/w3svc", "localhost");

        /// <summary>
        /// 端口号是否重复
        /// </summary>
        /// <returns></returns>
        private bool IsExistSitePort()
        {
            bool exist = false;
            DirectoryEntry ent = GetDirectoryEntry(entPath);
            foreach (DirectoryEntry child in ent.Children)
            {
                if (child.SchemaClassName == "IIsWebServer")
                {
                    if (child.Properties["ServerBindings"].Value != null && child.Properties["ServerBindings"].Value.ToString().Split(':').Length > 1)
                    {
                        if (child.Properties["ServerBindings"].Value.ToString().Split(':')[1] == Context.Parameters["siteport"].ToString())
                        {
                            exist = true;
                            break;
                        }
                    }
                }
            }
            return exist;
        }

child.Properties["ServerBindings"].Value 是绑定属性，其实就是下面这个图里的属性

但是有的站点可能会分配两个端口，child.Properties["ServerBindings"].Value 就是 System.Object[] 字符

        /// <summary>
        /// 站点名称是否存在
        /// </summary>
        /// <returns></returns>
        private bool IsExistSiteName(string sitename)
        {
            bool exist = false;
            using (DirectoryEntry root = new DirectoryEntry(entPath))
            {
                foreach (DirectoryEntry Child in root.Children)
                {
                    if (Child.SchemaClassName == "IIsWebServer")
                    {
                        string WName = Child.Properties["ServerComment"].Value.ToString();
                        if (sitename == WName)
                        {
                            exist = true;
                            break;
                        }
                    }
                }
                root.Close();
            }
            return exist;
        }

3）安装并复制文件

复制文件的操作在OnBeforeInstall方法中就已经完成，在该方法中可以替换数据库连接字符串操作等。

protected override void OnBeforeInstall(IDictionary savedState)
        {
            if (ExistSqlServerService())
            {
                if (IsExistSitePort())
                {
                    MessageBox.Show("站点端口号重复", "信息提示", MessageBoxButtons.OK, MessageBoxIcon.Warning);
                    return;
                }
                if (IsExistSiteName(Context.Parameters["sitename"].ToString()))
                {
                    MessageBox.Show("站点名称重复", "信息提示", MessageBoxButtons.OK, MessageBoxIcon.Warning);
                    return;
                }
                base.OnBeforeInstall(savedState);

                unRAR("Message.rar"); //解压文件
                unRAR("MoreUpload.rar");
                /*
                 * 设置webconfig连接字符串
                 */
                string webconfigpath = Path.Combine(this.Context.Parameters["installdir"].ToString(), "Web.config");
                string webcofnigstring = File.ReadAllText(webconfigpath).Replace("#constring#", GetConnectionString(Context.Parameters["dbname"].ToString()));
                webcofnigstring = webcofnigstring.Replace("#siteport#", Context.Parameters["siteport"].ToString());
                webcofnigstring = webcofnigstring.Replace("#comConn#", "Provider=SQLOLEDB.1;Persist Security Info=False;User ID=" + Context.Parameters["user"].ToString() + ";Password=" + Context.Parameters["pwd"].ToString() + ";Initial Catalog=" + Context.Parameters["dbname"].ToString() + ";Data Source=" + Context.Parameters["server"].ToString());
                File.WriteAllText(webconfigpath, webcofnigstring);

                ////安装IIS
                //if (string.Empty == GetIISVerstion())
                //{
                //    IISInstall(this.Context.Parameters["installdir"].ToString() + "IIS6.0_XPSP3", this.Context.Parameters["installdir"].ToString() + "iis.txt");
                //}

            }
            else
            {
                MessageBox.Show("检测到您的电脑没有安装SQL SERVER，无法继续安装此产品", "信息提示", MessageBoxButtons.OK, MessageBoxIcon.Warning);
                this.Rollback(savedState);
            }

        }

上面代码中解压了两个文件，主要是在安装完创建站点时还需要创建虚拟目录。之所以要先压缩放到WEB项目里，是因为生成安装程序时会检测项目的生成是否成功(是否可以不让它检测成功呢? 还不清楚)，一般只要我们把发布好的项目COPY到新建项目下就可以，但是独立的项目文件夹有自己独立的bin目录和webconfig文件，是不能混合在一起生成成功的，但是又需要一次完全安装，那么可以先压缩做为WEB项目下的文件，待复制完后再解压。

4）安装

/// <summary>
        /// 安装
        /// </summary>
        /// <param name="stateSaver"></param>
        public override void Install(IDictionary stateSaver)
        {
            if (ExistSqlServerService())
            {
                if (IsExistSitePort())
                {
                    MessageBox.Show("站点端口号重复", "信息提示", MessageBoxButtons.OK, MessageBoxIcon.Warning);
                    return;
                }
                if (IsExistSiteName(Context.Parameters["sitename"].ToString()))
                {
                    MessageBox.Show("站点名称重复", "信息提示", MessageBoxButtons.OK, MessageBoxIcon.Warning);
                    return;
                }

                base.Install(stateSaver);

                WriteBat();
                RegisterCom();
                string connectionString = GetConnectionString(null);
                try
                {
                    using (SqlConnection connection = new SqlConnection(connectionString))
                    {
                        connection.Open();

                        string sql = "sp_attach_db '" + Context.Parameters["dbname"].ToString() + "','" + Context.Parameters["installdir"].ToString() + "App_Data/Db_Data.MDF','"
                            + Context.Parameters["installdir"].ToString() + "App_Data/Db_Data_Log.LDF'";

                        ExecuteSQL(connection, sql);
                        connection.Close();
                    }

                }
                catch (Exception ex)
                {
                    MessageBox.Show("数据库安装失败！\n数据库配置有误,请正确配置信息!\n" + ex.Message, "出错！");
                    this.Rollback(stateSaver);
                    return;
                }

                try
                {
                    CreateDeskTopShortcut();
                    NewWebSiteInfo siteInfo = new NewWebSiteInfo(string.Empty, Context.Parameters["siteport"].ToString(), "", Context.Parameters["sitename"].ToString(), Context.Parameters["installdir"].ToString());
                    CreateNewWebSite(siteInfo);
                    StartWebSite(siteInfo.BindString);

                }
                catch//(Exception ex)
                {
                    //MessageBox.Show("创建站点失败!\n" + ex.Message, "出错！");
                    //this.Rollback(stateSaver);
                     CreateVirWebSite("Message", Context.Parameters["installdir"].ToString() + "Message");
                     CreateVirWebSite("MoreUpload", Context.Parameters["installdir"].ToString() + "MoreUpload");
                }
            }
            else
            {
                MessageBox.Show("检测到您的电脑没有安装SQL SERVER，无法继续安装此产品", "信息提示", MessageBoxButtons.OK, MessageBoxIcon.Warning);
                this.Rollback(stateSaver);
            }

        }

上面创建网站时会抛出一个文件路径的异常，但是网站是创建成功的，也算一个遗留问题，创建好网站后调用CreateVirWebSite方法创建虚拟目录。

5）安装时用户参数接收

参数的名称在添加安装项目的视图-》用户界面里填写，如下图：

参数的传递在视图——》自定义操作里面设置，如下图：

在CustomActionData里输入所有需要传递到安装类的参数 /dbname=[DBNAME] /server=[SERVER] /user=[UID] /pwd=[PWD] /sitename=[SITENAME] /siteport=[SITEPORT] /startpage=[STARTPAGE] /shortcutname=[SHORTCUTNAME] /installdir="[TARGETDIR]\" 注意这个格式是固定的，尤其安装路径的参数格式installdir="[TARGETDIR]\"这么写

同时要说明的是在卸载的CustomActionData属性只需要给出installdir参数，即使给了其它的参数，卸载时也是读取不到的，只能读取到初始的默认值，如果安装过程中用户重新修改了就不行了，安装文件时选择的路径始终能正确读取到，正因为如此在安装时需要把录入的相关信息以XML配置文件的形式记录下来，这样才能保证正确无误的卸载。

6）卸载

/// <summary
        /// 卸载
        /// </summary>
        /// <param name="savedState"></param>
        public override void Uninstall(IDictionary savedState)
        {
            DeleteWebSite(); //删除安装文件前先删除站点，因删除站点时需读取安装文件的配置信息
            dbpath = Path.Combine(this.Context.Parameters["installdir"].ToString(), "dbconfig.xml");
            string connectionString = OperateXML.GetXmlNodeValue(dbpath, "ConnString");
            string dbName = OperateXML.GetXmlNodeValue(dbpath, "DbName");

            base.Uninstall(savedState);

            try
            {
                using (SqlConnection connection = new SqlConnection(connectionString))
                {
                    connection.Open();
                    string sql = "if exists(select 1 from master..sysdatabases where name= '" + dbName + "') drop database " + dbName;
                    ExecuteSQL(connection, sql);
                    connection.Close();
                }
                if (Directory.Exists(Context.Parameters["installdir"].ToString() + "Message"))
                {
                    Directory.Delete(Context.Parameters["installdir"].ToString() + "Message", true);//删除解压产生的文件

                }
                if (Directory.Exists(Context.Parameters["installdir"].ToString() + "MoreUpload"))
                {
                    Directory.Delete(Context.Parameters["installdir"].ToString() + "MoreUpload", true);
                }

            }
            catch (Exception ex)
            {
                MessageBox.Show("卸载失败！\n" + ex.Message, "信息提示", MessageBoxButtons.OK, MessageBoxIcon.Warning);
                this.Rollback(savedState);
                return;
            }

        }

因为解压产生的文件卸载时不会自动删除，需要单独编写代码删除，这些文件是安装过程中产生的次生文件，它只会自动删除原本WEB项目打包进去的原来文件，至于另外产生的文件
是不会自动删除的。对于解压后的文件进行操作，这里也有个一个必须要注意的地方，就是路径问题，解压产生的次生文件，安装时会读取不到解压后的文件夹路径，事实上文件已经复制解压也完成了，但就是读取不到，对应这种情况办法是建立一个和压缩包一样的空文件夹放到WEB项目里，如果解压后的文件里需要替换webconfig连接串，可以在文件夹里放入Web.xml文件，并设置好要替换的地方，前面说了多个webconfig生成会不成功，这里可以先取名xml，解压后替换连接串再修改文件名OK了。

7）安装项目工程结构

新建一个网站或项目，然后添加安装项目和安装程序类库，如下图

虽然是WEB项目打包安装，这里选择安装项目就可以了，并不需要选择Web 安装项目。安装项目属性里的系统必备选择相应的.NET类库，安装时如果没有装framework也会自动引导安装，如下图：

生成安装项目时会产生两个执行文件，一个.msi 一个setup.exe，msi是打包生成是安装程序，exe是一个引导安装程序，如果电脑上没有安装framework，那么点击exe运行引导安装，如果原本已经安装了相应的framework，那么随便点击那个安装效果是一样的。

8）运行效果图

上面原本默认的路径是C:\Program Files\peace\项目信息管理系统\ ，如果一级目录原本存在的话会有一个问题，解压时会找不到压缩文件，文件确实是存在的，但是磁盘根目录下却又可以，可能是调用WinRAR解压读写的权限问题。

下面两张是桌面的快捷方式和附加的数据库图

卸载时也完全卸载了所有相关的文件和内容。

9）代码下载

有些代码没贴出来，直接放到源码里下载去看好了，主要是DBInstaller.cs文件里的代码。

源码下载：点击下载

本文链接

文件上传之断点续传方案

2011-04-06T04:00:00Z

　和前一篇一样，还是文件上传，这篇主要是文件的断点续传，因为项目中的实际应用情况，需要系统支持断点续传，很多时候用户上传比较大的图档文件往往一个压缩包的文件就达到了一个多G，有时候网速慢，传到中途卡住了或断线了，又得重新传。这时候让系统支持断点续传还是非常有必要的，起初原本打算用flex+ftp实现断点续传，后来在园子里看到Jon.Hong写的一篇断点续传的文章，是用silverlight+wcf开发的，觉得更适合在项目中应用（http://www.cnblogs.com/T-MAC/archive/2008/10/20/1298179.html），非常感谢Jon.Hong兄弟。

　这里主要对Jon.Hong的那个项目做了个别地方的修改，刚开始下载无法运行，可能是SilverLight版本的原因，我安装的运行版本是

重新做了修改才正常运行，另外对其中个别地方逻辑进行了修正，所有调整的内容如下：

(注：红色部分为后来更新部分——更新时间2011年7月)

　一、原有系统System.Windows.Controls.FileDialogFileInfo 采用了System.IO.FileInfo代替，不然编译不通过，这点明显是版本原因。

　二、进度条无法显示问题。这点也有可能是版本问题，直接用ProgressBar代替原有继承自Jon_UI_Controls的控件后正常显示。

　三、选择文件后不刷新页面再次选择文件画布重叠问题。每次选择文件后清空上传选择文件遗留的画面即可。

UIElement ui_old = null;

四、点击上传后，中止按钮无效问题。这点我看了下其中的代码，好像有一个逻辑问题没处理好，原来系统中点中止时把文件流给清空了，这么一来上传是停止了同时也会引发对象为空的异常，最重要的再次点上传上也是无法继续的，因为此时的文件流为空，无法从断点处继续上传了。为此我定义了一个中止属性，当点击中止和上传时都会该属性赋值，在引发上传事件时对该属性进行判断即可，并不清空文件流，只有在文件上传完毕后才清空文件流。

/// <summary>
        /// 中止文件上传
        /// </summary>
        public void Abort()
        {
            FileUpLoad.IsAbort = true; //中止标志
            //this.Dispose();
        }
        #endregion

        #region Protected Methods
        /// <summary>
        /// 释放资源
        /// </summary>
        protected virtual void CloseFileStream()
        {
            if (fs != null)
            {
                fs.Close();
                fs.Dispose();
                fs = null;
            }
        }
        #endregion

        #region IDisposable Members
        /// <summary>
        /// 释放资源
        /// </summary>
        public void Dispose()
        {
            this.CloseFileStream();
            this.FileInfo = null;
        }

五、增加了上传大小动态显示和百分比进度显示。（其实这里还可以根据已知条件计算上传速率和上传所需要的时间，都是可以实现的）

六、增加了接收来自aspx页面传递的参数功能。因为基本上要应用到实际项目中，不可避免的要接收外部参数，silverlight接收aspx页面的参数操作也简单，如下在silverlight页面的page_load方法里加上下面这段即可(这里假设传递的是ID和Name两个参数)

IDictionary<String, String> paras = HtmlPage.Document.QueryString;
            if (paras.Count > 0)
            {
                if (paras.ContainsKey("ID"))
                    this.lblParam.Text = paras["ID"];
                if (paras.ContainsKey("Name"))
                this.lblParam.Text += paras["Name"];
            }

　主要作了以上六处调整，另外如果是在发布后结合到项目中去用，有两点要注意（如果发布后运行有问题的话）

更新补充部分调整如下：

七、增加了数据库持久化通讯支持，主要记录是登录用户上传自己的文件，不同用户上传同一文件时不冲突，上传完成前临时文件的命名为原始文件名+.up用户ID，示例demo是基于数据库配置的，如果要应用的项目中，数据库操作部分自行修改即可，主要涉及两个方法的修改BeginUpLoad和CheckFileIsUpLoaded。

八、增加了文件上传速率和剩余时间的效果，上传速率是每秒动态计算，比如上传文件流每次（不是每秒）读取2M，有可能每秒读取4次，那么当前的速率为8M/S，剩余时间的计算用总的未上传的文件大小除以当前速率计算的结果，每秒的速率变化剩余时间也会相应变化。另外界面稍微调整了下颜色，美感不怎么样，先这么凑活了：）如下图：

　一、系统权限问题，参考了网上的解决方法，系统盘的windows下的temp文件夹权限设置，操作如下：

二、部署的站点属性设置。主要是对MIME类型的设置，即添加支持对silverlight运行识别的扩张类型，如下：

运行的效果图如下：

下面这张截图是接收参数和输出参数显示

总体来说这个断点续传的功能还是相当不错的，上传时的运行效率也很高，可以设置每次(不是每秒)上传循环时读取文件流的大小，我测试设置的时每次2M，如果网速好的话就非常快了。

　详细的参考内容大家可以参考Jon.Hong的相关文件，里面的代码我这里并没有做过多详细的说明。下面是我修改后的项目源码：

　 源码下载：断点续传

新版本源码下载：断点续传新版

　OK,两篇都是文件上传的，算是写完了，好久没上来写写什么了，有空了写写东西感觉也还好的，至少不坏，就当是消磨时间吧，分享给大家也当是相互学习了，再次感谢Jon.Hong兄弟。

本文链接

再次分享一个多选文件上传方案

2011-04-06T00:59:00Z

多选文件上传，已经非常多了，选择性多了可能有时候要比较下哪个更合适，结合到项目中使用更方便才是最重要的。很多的多选上传基本上都是调用的swf文件，确实用flash 或flex开发一个多选上传的功能很方便，比如flex里内置的FileReferenceList对象本身就支持文件的多选，有这个的话就方便多了，下面要说的主要也是基于flex开发的一个多选上传功能。

主要实现的功能如下：

一、选择多个文件上传并显示单个文件的上传进度

二、显示所有文件总的上传进度

三、显示所有上传文件的总大小

四、上传前可以删除任意选定一个或多个文件(按住Ctrl或Shift键)

五、ASP.NET页面调用生成的swf文件异步上传到服务器

先看下演示的截图，如下：

大致功能和上面截图一样，下面主要说下ASP.NET里怎么调用，FLEX的里面代码我这里就不详细说明了，FLEX里面的代码不多，文章后面提供下载，用flex3.0或4.0可以打开运行。

其中有一个地方说明一下，就是在多选删除的地方，为了保证随意多选删除的正确性，需要把选定的索引项降序排序，每次从数组最大处删除，避免循环删除时索引超界

调用其实也比较简单，新建一个aspx页面加载生成的swf文件，这里生成的文件名是upload.swf，利用flex内置的swfobject.js里面的方法加载，如下：

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>无标题页</title>
            <style type="text/css" media="screen">
            html, body    { height:100%; }
            body { margin:0; padding:0; overflow:auto; text-align:center;
                   background-color: #ffffff; }
            #flashContent { display:none; }
        </style>

        <script type="text/javascript" src="swfobject.js"></script>
        <script type="text/javascript" >

            var swfVersionStr = "10.0.0";
            var xiSwfUrlStr = "playerProductInstall.swf";
            var flashvars = {};
            flashvars.url = "SaveFile.aspx?Param=ID|100,NAME|测试用户";
            var params = {};
            params.quality = "high";
            params.bgcolor = "#ffffff";
            params.allowscriptaccess = "sameDomain";
            params.allowfullscreen = "true";
            var attributes = {};
            attributes.id = "upload";
            attributes.name = "upload";
            attributes.align = "middle";
            swfobject.embedSWF(
                "upload.swf", "flashContent",
                "587", "370",
                swfVersionStr, xiSwfUrlStr,
                flashvars, params, attributes);

            function uploadCompelete(){
                //完成后的操作，如页面跳转或关闭当前页
                document.getElementById('btnUpload').disabled = false;
            }
            function submitForm(){
                thisMovie("upload").uploadfile();
            }
            function thisMovie(movieName) {
                if (navigator.appName.indexOf("Microsoft") != -1) {
                    return window[movieName];
                } else {
                    return document[movieName];
                }
            }
            function disabledButton()
             {
                document.getElementById('btnUpload').disabled = true;
             }

        </script>
</head>
<body>
   <div id="flashContent"  style="width:587px; height:380px">
            </div>
        <br />
        <input id="btnUpload" style="width: 71px" type="button" value="上传" onclick="submitForm()" />
</body>
</html>

如上，页面放置一个按钮，执行upload.swf里面的uploadfile方法，在flex里面其实是回调了uploadHandler方法：

//===================
            // 点击上传按钮
            //===================
            internal function uploadHandler():void{
                if(uploadFile_num!=0) return;
                if(process_list.dataProvider==null || info.length<=0){
                    Alert.show("您还未选择文件!","提示信息");
                    return;
                }
                else
                {
                    ExternalInterface.call("disabledButton"); //点上传后禁用按钮
                }
                for(var i:Number=0;i<fileRef.fileList.length;i++){
                    upload_size_total+=fileRef.fileList[i].size;
                }
                uploadfile(uploadFile_num);
                add_btn.enabled = false; //点上传后禁用浏览按钮
                delete_btn.enabled = false;//点上传后禁用删除按钮
            }

SaveFile.aspx页面主要是接收并存储文件，如下：

protected void Page_Load(object sender, EventArgs e)
    {
        //string param = Request["Param"];
        string path = Server.MapPath("files/");
        if (!Directory.Exists(path))
        {
            Directory.CreateDirectory(path);
        }
        //HttpFileCollection files = Request.Files;
        //string fileName = string.Empty;
        //for (int i = 0; i < files.Count; i++)
        //{
        //    fileName = Path.GetFileName(files[i].FileName).ToLower();
        //    files[i].SaveAs(path + fileName);
        //}
        HttpPostedFile file = Request.Files["Filedata"]; //文件是一个一个异步提交过来，所以不需要循环文件集合
        if (file != null && file.ContentLength > 0)
        {
            file.SaveAs(path+Request.Form["filename"]);
        }
    }

毕竟不是以文件流的形式接收和存储，所以如果是上传大文件的话，可以看到显示页面已经上传完成100%，但是到这个处理存储页面会停顿一会，接收并存储完成后前台页面才会反应过来。

还有一点要提一下，就是如果传递的参数包含中文的话，需要config编码格式为utf-8格式，但有原先的系统可能是gb2312格式的，改成utf-8可能对系统有影响，可以单独建一个webconfig，上传的时候就读单独的config。查了下说flash.system.System.useCodePage=true;设置可以解决中文乱码问题，我试了下还是不好用，最后还是修改的编码格式。

源码下载：flex多选文件上传（用VS2005及以上或flashbuilder3.0,4.0打开）

本文链接

SQL SERVER里的赋值机制闲聊

2011-03-02T15:24:00Z

纯属闲谈，没什么好写，以前也碰过在SQL里连续赋值的问题，今天自己处理个东西也碰上，举个简单的例子来说吧，用户表里有两个时间字段(CurrentDate,LastDate分别代表当前登录时间和上次登录时间)，一个是上次登录时间，一个是当前登录时间，要求用户登录后记录当前更新时间，同时更新上次登录时间，当然第一次登录时上次登录时间是为空的，第二次登录应该是有值的。很简单第二次登录时先把第一次登录的CurrentDate的值赋值给LastDate，然后给CurrentDate赋值getdate()就可以了。问题是这条更新语句怎么写最恰当。可能最容易想到的是这样的

　declare @date datetime

　select @date=CurrentDate from users where ...

　update users set LastDate = @date,CurrentDate=getdate() where ...

写到第三句基本上应该能想到连续赋值了，一般的计算机语言都是从右到左赋值的，多表达式的连续赋值计算优先级也是从右至左的，在SQL SERVER里也一样的，明白了这点，最佳的方式应该是这样写

update users set CurrentDate=getdate() , LastDate = CurrentDate where ...

算是啰嗦下~~

本文链接

FLEX4.0开发流媒体视频播放器(总结篇)

2010-11-08T01:18:00Z

视频播放器这个做开发的兄弟们应该都熟悉，现在的视听网站这么火热，流媒体技术也相当成熟，网上的介绍也很多。不过基本上流媒体播放器都是flash，大多是写AactionScript脚本开发，利用FLEX开发也比较方便，和VS.NET的开发环境一样，看起来也熟悉，开发起来也有感觉些，我想至少应该比写AS脚本要有感觉些，当然FLEX开发的应用程序最终也会被解析成AS脚本，生成SWF文件，供WEB页面嵌入调用。最近稍微空闲那么一点，从同事那拷了个FLEX4.0，装上感觉下，之前也有意想做个流媒体播放器，正好这段时间有研究下。严格来说单纯的播放器不会难做，网上也有很多例子，只是流媒体播放器只支持流格式的媒体文件，所有这里还有个媒体格式转换的问题，就是要把不同类型的视频格式转换成流格式的文件，即转换成视频流格式。我写的这篇暂时只说说流媒体播放器的开发，不涉及转换的问题，这个有时间研究下再说说。

利用FLEX开发视频播放器可以利用自带的组件VideoDisplay，也可以不用，最终两种方式开发出来的效果是可以一样的。我下面说的主要是不利用组件的开发方式，利用组件开发的后面我也贴下代码片段和截图。主要以开发完后的开发文档内容来说下，写的内容不多，基本上要点应该还是写清楚了，先看下目录，按目录顺序讲解：

1 流媒体视频简介

1.1 什么是流媒体
所谓流媒体是指采用流式传输方式在Internet上播放的媒体格式(扩展名一般为.flv，目前 Adobe公司为迎接高清时代又推出了.f4v格式)。流媒体又称流式媒体，是指用一个视频传输服务器把把节目当成数据包发出，传送到网络上，同过流媒体播放器进行画面还原显示给用户观看。

1.2 什么是视频流
视频流（Video Streaming）是指视频数据的传输，例如，它能够被作为一个稳定的和连续的流通过网络处理。因为流动，客户机浏览器或插件能够在整个文件被传输完成前显示多媒体数据。视频流技术基于 2 密钥技术，视频译码技术和可升级的视频分发技术发展。

1.3 流媒体视频的优点
流媒体视频是边下载边播放边缓冲的，用户体验相比传统的下载播放好得多，传统的下载播放是用户等视频文件全部下载到缓存后再进行播放，用户等待时间比较长，因此与单纯的下载播放方式相比，这种对多媒体文件边下载边播放的流式传输方式不仅使启动延时大幅度地缩短，而且对系统缓存容量的需求也大大降低。

1.4 流媒体视频应用
由于流媒体格式的数据传输速度快，因此被广泛应用于互联网上的大型视频点播网站，比较典型的视频点播网站又56视频网，优酷视频网、土豆视频网等。同时这种技术也可以用于在线视频教学系统进行点播学习或公司内部会议视频在线提供观看等。
补充说明下那个高清格式的.f4v，因为测试的时候从土豆上拉了个高清格式的视频文件下来，发现后缀是.f4v的，利用开发的这个播放器播放不了，后缀名改成flv是可以播放的，觉得奇怪，都是流格式应该是可以播放的才对，原来忘了在网站的http头文件的MIME类型添加扩展名,添加下.f4v的扩展名就OK了，可以正常播放了，后来也看了下百度百科对这种高清格式是这么说的：
作为一种更小更清晰，更利于在网络传播的格式，F4V已经逐渐取代了传统FLV，也已经被大多数主流播放器兼容播放，而不需要通过转换等复杂的方式。
F4V是Adobe公司为了迎接高清时代而推出继FLV格式后的支持H.264的F4V流媒体格式。
它和FLV主要的区别在于，FLV格式采用的是H263编码，而F4V则支持H.264编码的高清晰视频，码率最高可达50Mbps。

2 功能概述

2.1 设计目的
作为系统平台功能的扩充，开发此模块，现实一个功能相对全面的流媒体播放器，主要用于播放流媒体格式的视频，提供给特殊要求的客户用于外网在线播放新闻视频。

2.2 功能说明
1）视频的暂停、播放
2）视频拖动播放和定点播放
3）音量的禁音和开启
4）拖动滑块控制音量
5）视频缓冲进度高亮显示
6）视频全屏处理，点击按钮或点击视频画面实现全屏

2.3 运行环境
此模块采用Flex4.0开发，要求客户端安装flash 10.0.0 （含以上版本）

3 功能设计

3.1        相关变量属性
private var isPause:Boolean = false;        //暂停状态
private var isSound:Boolean = true;         //声音状态（是否禁音）
        private var _volume :Number = 0.6;          //默认音量大小(最大值为1)
    private var isFullScreen:Boolean = false;   //是否是全屏
              private var totalTime:Number;              //播放总时间
        private var playPosition:Number;            //剪辑位置
        private var videoUrl:String;              //视频文件地址
        private var videoWidth:Number;            //视频宽度
    private var videoHeight:Number;           //视频高度
        private var isAutoPlay:Boolean = true;     //是否自动播放

3.2        初始化视频画布
    点开视频播放页面后首先初始化视频播放的画面，根据接收的用户参数初始化视频画面的大小。
对象定义：
            import mx.events.SliderEvent; //滑块事件命名空间引用

            private var nc:NetConnection; //媒体连接对象
            private var ns:NetStream;    //网络流对象
            private var metaDataObj:Object = {}; //媒体的元数据信息
            private var video:Video ;          //视频对象

初始化方法如下：
private function init():void
            {
                videoUrl = parameters.videoUrl;
                videoWidth = parameters.videoWidth;
                videoHeight = parameters.videoHeight
                video = new Video(videoWidth,videoHeight);
video.smoothing = true;//画面平滑处理，去掉全屏后的水纹以提高画面清晰度
                uic.addChild(video); //将视频对象添加到页面
            }

3.3        加载视频流并播放
当视频初始化完成后调用视频播放方法，将方法置于应用程序事件头里面。
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" initialize="init()" creationComplete="startVideo()" >

private function startVideo():void
            {

                nc = new NetConnection();
                nc.addEventListener(NetStatusEvent.NET_STATUS,netStatusHandler); //添加播放连接监听事件
                nc.connect(null);

            }
当连接对象成功连接后，播放视频，上面的nc.connect(null);表示如果未使用 Flash Media Server,可使用null作为参数以便从本地文件系统或 Web 服务器中播放视频和 MP3 文件。

private function netStatusHandler(e:NetStatusEvent):void
            {
                ns = new NetStream(nc);
                metaDataObj.onMetaData = this.onMetaData;
                ns.client = metaDataObj;
                video.attachNetStream(ns);
                //ns.bufferTime = 5;
                ns.play(videoUrl);
                soundProcess.value = _volume;
                soundTrans.volume = _volume
                ns.soundTransform = soundTrans;
                this.addEventListener(Event.ENTER_FRAME,EnterFrameHandler); //添加播放过程中的监听事件
                ns.addEventListener(NetStatusEvent.NET_STATUS,NetStreamStatusHandler);//添加播放完毕(或其它状态)后的监听事件

                if(!isAutoPlay) //客户端没有设置为自动播放时的处理
                {
                    ns.pause();
                    btnPlay.source = playClass;
                    isPause = true;
                }
                else
                {
                    btnPlay.source = pauseClass;
                    isPause = false;
                }
            }
//获取视频的元数据信息，这里的元数据信息包括视频编码，视频码率，音频编码，音频码率，音视频文件大小，流文件总大小，播放总时间等
            private function onMetaData(obj:Object):void
            {
                totalTime = obj.duration;
                fileSize = (obj.filesize/(10241024)).toFixed(2).toString()+"MB";//换算成兆字节并保留两位小数*
            }
说明：
this.addEventListener(Event.ENTER_FRAME,EnterFrameHandler);用于监听播放过程中的事件处理，由于在播放过程中，播放进度和缓冲进度要实时显示以及播放到哪一个时间点了也都需要动态实时呈现给用户，因此视频进入加载画面时就需要实时不断监控该事件。
  ns.addEventListener(NetStatusEvent.NET_STATUS,NetStreamStatusHandler);用于监听在视频流播放完毕后的事件处理。
onMetaData是一个回调方法，当客户端加载到视频流时，通过异步获取该媒体的元数据信息，如媒体总大小、总的播放时间、采样率等等。

3.4         播放进度及缓冲进度高亮显示

//播放进度和缓冲进度处理
            private function EnterFrameHandler(e:Event):void
            {

                if (totalTime>0)
                {
                    playTime = ns.time;// ns.time为流媒体实时播放的时间
                }

                if (ns.bytesLoaded>0)
                {
                    bufferRect.width = ns.bytesLoaded / ns.bytesTotal(playProcess.width-10);//计算缓冲方框的宽度(滑块本身也有一定的宽度,减去约10个像素宽度)*
                }

            }
说明：
   playTime作为播放进度条当前实时播放的时间点，视频的总时间作为播放显示进度条的最大值。
    <mx:HSlider id="playProcess"minimum="0" value="{playTime}" maximum="{totalTime}"
   ns.bytesLoaded为已缓冲好的流媒体字节大小（单位为byte），ns.bytesTotal为流媒体的总大小，通过比例计算（如上）可以得出缓冲进度在播放进度条上的位置，缓冲进度条其实是一个长方形框，以层的形式位于播放进度条下放，初始宽度为0,当缓冲达到100%时，即缓冲完毕时，缓冲条的长度和播放进度条等长（除去滑块宽度）。缓冲方框可以是一个BorderContainer，如下：
    <s:BorderContainer x="14" y="411" width="0" height="4" id="bufferRect" buttonMode="true" borderColor="#70b2ee" backgroundColor="#70b2ee">
    </s:BorderContainer>
    页面所有的控件和标签如下：


<mx:Image source="{playClass}" click="play();" id="btnPlay" buttonMode="true" x="16" y="423"/>
    <mx:UIComponent id="uic" height="400" width="640" click="play()" doubleClickEnabled="true" doubleClick="display()" buttonMode="true" y="0" x="0"/>
    <s:BorderContainer x="14" y="411" width="0" height="4" id="bufferRect" buttonMode="true" borderColor="#70b2ee" backgroundColor="#70b2ee">
    </s:BorderContainer>
    <mx:Label text="{formatTime(playTime)}/{formatTime(totalTime)}                    {fileSize}" width="150" x="60" y="427"/>
    <mx:HSlider id="playProcess"  minimum="0" value="{playTime}" maximum="{totalTime}" change="play_onchange(event)" thumbPress="thumbPress();"  thumbRelease="thumbRelease();"
                alpha="0.5"    dataTipFormatFunction="dataTipFormat" buttonMode="true" showTrackHighlight="true" x="9" y="398" width="630"/>

    <mx:Image source="{sound1}" click="closeSound();" id="soundImg" buttonMode="true" x="364" y="421"/>
    <mx:HSlider id="soundProcess" x="406" y="420"  minimum="0" maximum="1" change="sound_thumbChanges(event)"
                showTrackHighlight="true" dataTipFormatFunction="SoundTipFormat"   buttonMode="true"  width="135"/>
    <mx:Button label="全屏" click="display();" buttonMode="true" cornerRadius="20" labelPlacement="right" paddingLeft="6" x="561" y="423"/>
    <mx:SWFLoader id="load" x="16" y="486"/>

3.5        视频的播放与暂停
        视频的暂停与播放调用视频流的pause()方法和resume()方法，通过是否暂停的状态变量判断控制，代码片段如下：
//播放、暂停设置
            private function play():void
            {
                if(isPause)
                {
                    ns.resume();
            btnPlay.source = pauseClass; //设置按钮图标为点击暂停图标
                    isPause = false;

                }
                else
                {
                    ns.pause();
                    btnPlay.source = playClass; //设置按钮图标为点击播放图标
                    isPause = true;
                }
            }

3.6        拖动滑块播放视频
      拖动滑块播放视频文件，主要是判断和记录流的剪辑位置，找到最终的剪辑位置后可以调用视频流的seek(参数)方法，参数为当前的剪辑位置，如果不拖动直接点击任意剪辑位置定点播放，那么最终的剪辑位置应该是鼠标弹起的位置，这里定点点击实际上还是相当于触发了滑块移动的事件，只不过是滑块快速移动到你点击的位置而已，相关代码片段如下：
//拖动进度条时改变播放位置
            private function play_onchange(event:SliderEvent):void
            {
                if(ns.time == 0)
                {
                    playProcess.value = 0;
                    return;
                }
                playPosition = playProcess.value;             //保正播放进度統一
                ns.seek(playPosition);
            }

            //进度条鼠标按下
            private function thumbPress():void
            {
                ns.pause();
            }
            //进度条鼠标弹起,指拖动时滑块时鼠标弹起
            private function thumbRelease():void
            {
                //ns.seek(playPosition);
                 btnPlay.source = pauseClass;
                isPause = false;
                ns.resume();
            }

3.7        播放结束处理
      一般视频播放完毕后，播放的指针头归零，即播放进度条上的滑块指向起始位置，同时播放按钮状态为准备就绪状态，视频流处于暂停状态。可以通过视频流的当前状态信息进行判断，如下面e.info.code状态值可以获得各种不同的状态，这里只取播放完毕停止后的状态值，代码片段如下：
       //播放完毕处理
            private function NetStreamStatusHandler(e:NetStatusEvent):void
            {
                if(e.info.code == "NetStream.Play.Stop")
                {
                    ns.seek(0);
                    btnPlay.source = playClass;
                    isPause = true;
                    ns.pause();
                }
            }

3.8        音量大小控制
      视频声音控制通过SoundTransform 类操作，该类包含音量和平移的属性。如果禁音后运行调节滑块的话，需要再定义一个临时变量tmpSound，以便开启声音时为最终设置的音量。
           //静音、开音控制
            private function closeSound():void
            {
                if(isSound)
                {
                    soundImg.source = sound;
                    tmpSound= ns.soundTransform;
                    soundTrans.volume = 0;
                    ns.soundTransform = soundTrans; // 这里禁音直接ns.soundTransform.volume = 0 这样不行，需要用对象赋值
                    isSound = false;
                }else
                {
                    soundImg.source = sound1;
                    ns.soundTransform = tmpSound;
                    isSound = true;
                }
            }

          //通过滑块调整声音
            private function sound_thumbChanges(event:SliderEvent):void
            {
                tmpSound.volume = soundProcess.value;
                ns.soundTransform = tmpSound;
            }

3.9        全屏控制
      全屏可以用flash画布舞台的stage属性值设置，不过要考虑下普通屏幕和宽屏的处理, 常见的显示器分辨率按其长宽比可分为为：4：3（1024×768）、5：4（1280×1024）、16：9、16：10 (这里暂以宽屏测试的，需要后续处理)，点击全屏按钮或点击视频画面都可以全屏，调用display()方法即可，代码片段如下：
//切換全屏显示
            private function display():void
            {
                if(!isFullScreen)
                {
                    stage.fullScreenSourceRect = new Rectangle(video.x, video.y,video.width,video.height);
                    stage.displayState =StageDisplayState.FULL_SCREEN;
                    isFullScreen = true;
                }else
                {
                    stage.displayState = StageDisplayState.NORMAL;
                    isFullScreen = false;
                }

            }

3.10 流数据字符格式化
视频播放时当前时间和总时间是以秒为单位的，比如180s的文件，当前播放到一半显示90s，需要按时间格式来显示才友好，另外还有音量的值是介于0到1之间的某个值，也需要按百分比来显示。代码片段如下：
//格式化时间
            private function formatTime(time:Number):String
            {
                var min:Number = Math.floor(time/60);
                var sec:Number = Math.floor(time%60);
                var timeResult:String = (min < 10 ? "0"+min.toString() : min.toString()) + ":" + (sec == 10 ? "0"+sec.toString() : sec.toString());
                return timeResult;
            }
//声音slider格式化
            private function SoundTipFormat(data:Number):String
            {
                return (data100).toFixed(0).toString()+"%"; //拖动声音进度条时显示百分比音量*
            }

3.11 视频画面平滑优化处理
一般视频画布全屏后，会产生文字图像有些失真的感觉，会产生水纹，对于这点的处理，Flex封装了一个简单有效的方法，只需设置一个属性即可，即video对象中有一个属性设置。如下：
video.smoothing = true;
把该属性设置为true，表是启用画面优化处理，加上这个设置能大大提高画面质量。

3.12 播放接口调用
采用FLEX开放的播放器编译后最终生成的是一个.swf文件，需要通过页面去加载调用，可以是静态的html页面，也可以是动态的aspx页面，调用过程中引用Flex内置的一个JS文件——swfobject.js，
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
            var swfVersionStr = "10.0.0";
            var xiSwfUrlStr = "playerProductInstall.swf";
            var flashvars = {};
            flashvars.videoUrl = "S6000103.flv";
            flashvars.videoWidth = "640";
            flashvars.videoHeight = "400";
            flashvars.videoVolumn = "0.6";
            flashvars.isAutoPlay = "true";
            var params = {};
            params.quality = "high";
            params.bgcolor = "#ffffff";
            params.allowscriptaccess = "sameDomain";
            params.allowfullscreen = "true";
            var attributes = {};
            attributes.id = "FLVPlayer";
            attributes.name = "FLVPlayer";
            attributes.align = "middle";
            swfobject.embedSWF(
                "FLVPlayer.swf", "flashContent",
                "650", "450",
                swfVersionStr, xiSwfUrlStr,
                flashvars, params, attributes);
        </script>

<div id="flashContent">
        </div>
其中flashContent标签作为嵌入的swf播放器文件（FLVPlayer.swf）的容器，同时网站的http头进行如下设置（添加.flv和.f4v扩展名）：

下面贴几张播放的效果图：
让美工美化下，做一个像目前视频网类似效果的播放器还是相当简单的。
利用VideoDisplay组件开发的我贴下完整的代码片段，这里和上面对比少了缓冲进度的效果，另外没有画面优化的效果出来，如果要加这两个效果的话，要向上面那样定义连接，输入流对象，然后让这个组件加载实例化的video对象就可以了，代码如下：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx" fontSize="12" initialize="init();" backgroundAlpha="0.6" backgroundColor="#FFFFFF">

    <fx:Declarations>
        
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.events.MetadataEvent;
            import mx.events.SliderEvent;
            import mx.controls.sliderClasses.Slider;
            import mx.events.VideoEvent;
            import mx.utils.ObjectUtil;
            import mx.controls.ProgressBarDirection;

        [Embed(source="images/play.png")]
        [Bindable]
        private var playClass:Class;                //播放图标样式

        [Embed(source="images/pause.png")]
        [Bindable]
        private var pauseClass:Class;               //暂停图标样式

        [Embed(source="images/sound1.png")]
        [Bindable]
        private var sound1:Class;               //声音样式1

        [Embed(source="images/sound.png")]
        [Bindable]
        private var sound:Class;                //声音样式2（静音）

        [Bindable]
        private var videoSource:String;         //媒体路径

        private var isPause:Boolean = false;        //暂停状态
        private var isSound:Boolean = true;         //声音状态
        private var isFullScreen:Boolean = false;   //是否是全屏
        private var tmpSound:Number = 0;            //临时声音大小

        [Bindable]
        private var fileSize:String;                 //视频文件大小

        [Bindable]
        private var playPosition:Number;            //播放进度

        private function init():void{
            videoSource = parameters.videosource;
        }

        private function playingMove(event:VideoEvent):void{
            my_hs.value = myVid.playheadTime;  //视频播放时同步进度条状态值

        }

        //拖动进度条时改变播放位置
        private function hs_onchange(event:SliderEvent):void{
            if(myVid.playheadTime == -1){
                my_hs.value = 0;
                return;
            }
            playPosition = my_hs.value;             //保正播放进度統一
            myVid.playheadTime = playPosition;
        }

        //进度条鼠标按下
        private function thumbPress():void{
            myVid.pause();
        }
        //进度条鼠标弹起
        private function thumbRelease():void{
            myVid.playheadTime = playPosition;
            myVid.play();
        }


        //播放，暂停
        private function playButton():void{
            if(!isPause){
                myVid.play();
                playBtn.source = pauseClass;
                isPause = true;
            }else{
                myVid.pause();
                playBtn.source = playClass;
                isPause = false;
            }
        }

        //播放完成
        private function vidComplete():void{
            playBtn.source = playClass;
            isPause = false;
        }

        //停止播放
        private function stopButton():void{
            myVid.stop();
            playBtn.source = playClass;
            isPause = false;
        }

        //切換全屏顯示
        private function display():void{
            if(!isFullScreen){
                stage.fullScreenSourceRect = new Rectangle(myVid.x,myVid.y,myVid.width,myVid.height);
                stage.displayState =StageDisplayState.FULL_SCREEN;
                isFullScreen = true;
            }else{
                stage.displayState = StageDisplayState.NORMAL;
                isFullScreen = false;
            }
        }

        //调整声音
        private function sound_thumbChanges(event:SliderEvent):void{
            myVid.volume = hs_sound.value;
        }

        //静音
        private function closeSound():void{
            if(isSound){
                closeImg.source = sound;
                tmpSound = myVid.volume;
                myVid.volume = 0;
                isSound = false;
            }else{
                closeImg.source = sound1;
                myVid.volume = tmpSound;
                isSound = true;
            }
        }


        //格式化时间
        private function formatTime(time:Number):String{
            var min:Number = Math.floor(time/60);
            var sec:Number = Math.floor(time%60);
        var timeResult:String = (min < 10 ? "0"+min.toString() : min.toString()) + ":" + (sec == 10 ? "0"+sec.toString() : sec.toString());
        return timeResult;
        }
        //slider格式化
        private function dataTipFormat(data:Number):String{
            return formatTime(data);
        }


        private function myVid_metadataReceived(evt:MetadataEvent):void {

            var meta:Object = evt.info; // 视频的元数据信息
            fileSize = (meta.filesize/(10241024)).toFixed(2).toString()+"MB";//换算成兆字节并保留两位小数

            / 读取所有元数据属性和值
            var i:int = 0;
            var arr:Array = [];
            var item:String;
             var value:;
            for (item in meta) {
                if (ObjectUtil.isSimple(meta[item])) {
                    if (meta[item] is Array) {
                        value = "[Array]";
                    } else {
                        value = meta[item]
                    }

                    Alert.show(item+":"+value);
                }

            }/


        }




     ]]>



    </fx:Script>

    <s:BorderContainer borderColor="#66ccff" y="0" cornerRadius="0" borderWeight="0" borderVisible="true" dropShadowVisible="false" x="0" width="660">

        <mx:VideoDisplay id="myVid" y="10" height="400" width="640"  source="{videoSource}"  autoPlay="false"  buttonMode="true"  click="playButton();"  ready="myVid.visible = true;" metadataReceived="myVid_metadataReceived(event);"
          playheadUpdate="playingMove(event)"  complete="vidComplete();"  doubleClickEnabled="true"  doubleClick="display();" contentBackgroundAlpha="1.0" contentBackgroundColor="#000000" x="10"

        />

        <mx:HBox width="640" verticalAlign="middle" x="10" y="415" height="90">
            <mx:Image source="{playClass}" click="playButton();" id="playBtn" buttonMode="true"/>
            <mx:Label text="{formatTime(myVid.playheadTime)}/{formatTime(myVid.totalTime)}                    {fileSize}" width="150"/>
            <mx:HRule height="0" width="200" buttonMode="true"/>
            <mx:Image source="{sound1}" click="closeSound();" id="closeImg" buttonMode="true"/>
            <mx:HSlider width="100" id="hs_sound" minimum="0" maximum="1"
                        change="sound_thumbChanges(event)"
                        value="{myVid.volume}" buttonMode="true" />
            <mx:Button label="全屏" click="display();" buttonMode="true" cornerRadius="20" labelPlacement="right" paddingLeft="6"/>
        </mx:HBox>
        <mx:HSlider width="640" id="my_hs" minimum="0" maximum="{myVid.totalTime}" height="10" showTrackHighlight="true" buttonMode="true" liveDragging="true"
                    change="hs_onchange(event)" thumbPress="thumbPress();"  thumbRelease="thumbRelease();" x="10" y="422"  dataTipFormatFunction="dataTipFormat" />


    </s:BorderContainer>
</s:Application>

效果图如下：
可以对比下平滑处理过的效果，明显文字更清晰些，尤其在全屏后效果更明显，平滑处理后基本不会有画面失真的现象。
说明：采用的是FLEX4.0开发的，其实里面的标签有还是3.0的，直接参考了网上的一些例子，也都是兼容的，就没改了。
主要参考了http://www.cnblogs.com/yjmyzz/archive/2010/04/16/1713290.html（杨过兄的这篇），基本上大同小异吧。
原本我也想放个可以运行的demo上来，发现编译发布后还带有好几个swf的类库文件，没有的话播放不了，都是flex4.0的发布文件必须要的，想发布后打包成一个单独的swf文件，也没有找到合适的方法，也就没有进一步处理了，如果大家有兴趣想玩下或研究下，可以装个FLEX4.0版本的，新建一个应用程序，安照上面的步骤做个可以播放流媒体视频的播放器是没问题的。
(2010-11-11 界面排了下版，排版后的效果如下)

（以上内容仅供学习参考，本人保留最终解释权）

本文链接

告别ASP.NET种树的烦恼

2010-07-15T01:21:00Z

这一别离上一别有比较长一段时间了，人都有惰性，不过突然有时候兴致来了，还是会写写。几次都标题为告别烦恼，当然是告别不了的，项目的实际应用都有特例，特殊应用还是免不了要再折腾一番，能满足大部分常规项目的应用也就够了。

这篇写的主要是应用系统中目录树的配置模块，提起目录结构，就会想到树组件或控件，比如.NET自带的TreeView控件，拖到WEB页面上，给她个数据源也能出来结构，对于节点不多的情况下也还是可以的。不过相比MSDN那样动态加载的的导航树，这种控件形式的目录展示还是没法做到的。下面要说的正是基于动态加载树型目录的配置，这篇文章最初构成的原型是朋友阿勇写一篇AJAX动态加载节点的树（http://doll-net.cnblogs.com/），后来根据各项目的实际应用进行了一系列扩展，独立抽出成一个可配置的树型目录模块。

首先说下该配置模块的主要功能点：

1）树根配置：树根编号为每棵树的唯一标识；树根标题可以固定文字形式也可以写带参数SQL语句，树根URL可以是固定链接地址，也可以写JS判断语句以便指向不同的链接。

2）树层配置：树层指定该层节点的名称字段，主键字段，层链接的URL(固定链接或JS链接判断)，层数据源等，各层的数据源提供SQL语句书写接口，可以来自关系表或自定义表值函数。

3）每棵树（树根除外）可以有一个或多个树层，树层的第一层不允许设置递归，从第二层开始的任何一层可以设置递成归层，但是每棵树只允许有一个递归层。

4）每棵树可以设置是否显示选择框，对于一般只作为展示的目录不需要选择框，类似于授权的目录结构，节点前面还是需要选择框的。

5）每棵树下各层节点前的图标可以自定义进行设置，节点的图标根据节点字段类型读取，如部门和人员节点一般用不同的图标，默认是常见的文件夹形式的图标。

下面大致说下配置原理和应用，在此声明一下，在做这个配置模块前，我是一直觉得把SQL语句保存到数据库是很变态的做法，但是要做到灵活配置，要让其它项目组的人能自己

定义数据源，不把SQL语句保存到数据还真没其它好招。像sharepoint配置列表什么的，虽然是友好界面操作，不用开发人员写SQL语句，中间肯定也是有生成一个SQL语句的过程吧。这配置也是对开发人员来说，直接给出书写SQL语句的接口，想怎么写就怎么写，想怎么传参就怎么传参，想怎么折腾就怎么折腾。

这里我写的说明顺序不一定符合大家阅读和思考的顺序，但是我尽量说明白，as follows :

（1）树型结构的输出

（2）各层节点处理

（3）递归数据层处理

（4）选择框处理

（5）树型配置及应用示例

（6）功能探索——嫁接树

（7）文件下载及调用说明

（8）后记

一、树型结构的输出：

既然要动态加载目录结构，就需要通过异步方式动态输出各层数据了，后台输出的数据格式是一个JSON对象的数组，然后在前端页面进行解析，组织成TABLE和DIV格式在页面上显示，

打开目录树（树种好后）展示页面时，首先读取树根数据，同时加载第一层的数据（JSON格式），点开第一层的某个节点时，加载第二层的数据，依次类推。如一个报表目录的第一层

通过后台返回的数据如下:

[{id:0,name:"月报",fid:"M",layer:"1",url:"",type:"parent",nodetype:""},

{id:1,name:"季报",fid:"Q",layer:"1",url:"",type:"parent",nodetype:""},

{id:2,name:"半年报",fid:"H",layer:"1",url:"",type:"parent",nodetype:""},

{id:3,name:"年报",fid:"Y",layer:"1",url:"",type:"parent",nodetype:""}]

上面的数据中，id仅表示序号，实际并没有意思，fid表示节点的主键字段（同时也是其下一层节点数据的外键字段），layer表示层次，这里表示读取的第一层的数据，url表示点击节点

对应的链接地址，type表示是否叶子节点，对应与parent和child两个值，nodetype表节点类型字段，该值对应图标名称，比如对于报表类型的目录，作为叶子节点的报送单位或上层

区县可能有已报或未报的状态，那么我们可以对不同的状态加载不同的图标，不设置节点类型字段的话默认是文件夹图标，用下面两张效果图来说明：

从上面两层可以容易看出哪些基层单位报了，哪些区县也报了，当然这里只是两个状态的图标，对于有涉及流程状态的目录，可以有多个状态，只需配置对应的状态字段就可以了。

二、各层节点处理：

节点的处理相对还是有点复杂，说之前先贴一段页面呈现时加载的一个代码片段：

//页面加载事件
        window.onload = function()
        {
            tree = new treeTask("tree");
            tree.selectNodeID = tree.TagName[1].name+"0";
            tree.appendHtml(getObjById("tree"),tree.getNodeHtml(-1,0,name,"",undefined,"","child")); //首先加载树根
            tree.getHtmlData("&methodName=GetData&id=-1&layer=1");//然后加载第一层
            if(rootUrl.substring(rootUrl.lastIndexOf('/')+1).length == 0 || rootUrl.substring(rootUrl.lastIndexOf('/')+1)=="RightBlank.aspx")
            {
                document.all.frm.src = "RightBlank.aspx";
            }
            else
            {
                rootUrl=rootUrl.replace(/<</g,"'");
                rootUrl=rootUrl.replace(/>>/g,"'");
                eval(rootUrl);
           }
        }

对于上面的树根链接也好及后面的要说的树层节点链接也好，URL都是JS语句形式，用eval这个函数动态执行，链接的URL书写形式类似这样的document.all.frm.src=<</Report/ShowRptForm.aspx?ReportDate=[ReportDate]>>，这里的<<>>在执行前被替换成''，在后台输出JSON数据时其实是这样的

{id:1,name:'季报',fid:'Q',layer:'1',url:'',type:'parent',nodetype:''} 里面是单引号的，IE8好像自动会把外围单引号转换输出成双引号，那当然更好没问题，但是有的浏览器就原样输出的

是单引号，如果链接地址这么写document.all.frm.src='/Report/ShowRptForm.aspx?ReportDate=[ReportDate]' 那url:里面内容的单引号会和本身外面的单引号匹配，就有

问题了，所以对单引号做了个替换。没有指定URL时，点击节点会跳转到一个空白页面RightBlank.aspx，当然也可以其它统一一个页面，也可以在URL里写return;不让跳转。

树根标题由后台输出一段脚本显示的，如下：

① 节点图标变换处理：

每层各节点的图标有两个，一个是展开形式的，一个非展开形式的，就像展开折叠的文件夹图标那样，是一对的，图标需为gif格式的，比如上报状态的图标有report.gif和reportopen.gif一对,unreport.gif,unreportopen.gif又一对，节点类型字段的值只需要对应report和unreport这两个值，在开展时会自动去找对应的open图标。展开和折叠时

处理的JS片段如下：

//展开或折叠时显示图标处理，通过节点的name属性判断
if(getObjById('folder'+objNode.id).name.indexOf("open") == -1)
                {
                   getObjById('folder'+objNode.id).src ="../images/"+getObjById('folder'+objNode.id).name+"open.gif";//显示展开图标
                   getObjById('folder'+objNode.id).name = getObjById('folder'+objNode.id).name+"open";//重置name属性的值
                }
                else
                {
                   if(_this.isflush) { _this.isflush = false; return ;} //刷父新节点时保持节点图片为展开状态
                   getObjById('folder'+objNode.id).src ="../images/"+getObjById('folder'+objNode.id).name.Replace("open","")+".gif";//显示折叠图标
                   getObjById('folder'+objNode.id).name = getObjById('folder'+objNode.id).name.Replace("open","");//重置name属性的值
                }

后台JSON数据输出后通过处理会成为table显示，代码片段如下：

treeTask.prototype.getNodeHtml = function(parentID,nodeID,nodeName,layer,url,state,type,nodetype)
        {
            if (url == undefined)
            {url = rootUrl;}
            return "<table border=0 cellpadding='1' cellspacing='1' id='"+this.TagName[0].name+nodeID+"'><tr><td style='vertical-align:top'>"
                + this.getImg(parentID,type,layer,nodeID,nodetype)
                +"</td><td class='" + state + "' nowrap id='"+this.TagName[1].name+nodeID+"' onclick=\""+this.treeName+".ClickSelect(this,'"+url+"')\" onmouseover='"+this.treeName+".mouseOver(this)' onmouseout='"+this.treeName+".mouseOut(this)' style='cursor:hand'>"
                + nodeName + "</td></tr></table><div id='"+this.TagName[3].name+nodeID+"' style='display:"+(nodeID==0?"block":"none")+";margin-left:1em;'></div>";
        }

其中节点名称前的图标单独调用了一个处理方法，对于非叶子节点，输出两个图片，可以点击的+-号图标和节点类型图标，对应叶子节点也是两个图标child.gif和节点类型图标，child.gif白色

空图标，起站位符图标的作用，保证父子节点有合理的缩进，看着舒服点。上面的div是作为下一层数据填充的容器，即点击某个节点开展子节点时，子节点数据填充到当前点击节点的div下。

getImg方法返回的是一个table，形如：

②添加节点处理：

对于单纯的目录展示来说，只是显示目录结构，没必要添加节点，但是对于像组织结构那样的目录，需要添加部门或人员时，还是需要添加和删除节点的功能，添加节点涉及到局部刷新和

节点图标的变化，假设A为父节点，A_1为叶子节点，选中A_1节点在其下面添加一个A_2，添加后会刷新A节点，即执行A节点的展开事件(刷新节点时强制重新读取子节点数据，否则只

在第一次开展时读取)，这时A_1为父节点，图标也被变换掉，同时执行A_1节点的展开事件，显示出A_2子节点。这一连贯的处理完成了一个局部刷新，用户体验效果要好些。

③修改节点处理：

修改节点处理有点类似添加节点的处理，修改节点时如果要局部刷新有两种方式，一是把文本框节点值作为参数直接传给修改节点的方法，赋值到节点标签的innerHTML，不重新读取数据

库，二是修改当前节点后刷新当前节点的父节点，这样也就不需要传递节点名称了，这里采用第二种方法，尽量避免传参数了。因为对于统一配置平台下开发的项目也不一定好特定传某个值到外面，不过如果不用考虑特殊情况的话还是建议用第一种方法。这里添加和修改节点调用的是同一个方法，代码片段如下：

//添加及修改节点时都调用此方法
function treeAddNode()
{
    if (selectNodeID == null) return;
    var o = selectNodeID;
    var p = tree.getParentNode(selectNodeID.replace("treeTd",""));
    if (p == null) return;

    tree.selectNodeID = p.id.replace("treeDiv","treeTd");
    if (tree.selectNodeID == "treeTd0")
    {
         tree.selectNodeID = tree.TagName[1].name+"0";
         tree.appendHtml(getObjById("tree"),tree.getNodeHtml(-1,0,name,"",undefined,"","child"));
         tree.getHtmlData("&methodName=GetData&id=-1");
    }
    else
    {
        tree.refreshNode(p.id.replace("treeDiv",""));
    }
    if(getObjById("treeTbl"+o.replace("treeTd","")).innerHTML.indexOf("child.gif") ==-1) //更新叶子节点时，则不执行该叶子节点的展开事件
     {
          tree.tdClick(getObjById(o.replace("treeTd","treeImg")));
     }
}

④删除节点处理：

删除当前选中节点时，刷新其父节点，同时执行父节点的URL点击事件，如下：

//删除选中的节点
function treeDeleteNode()
{
    if (selectNodeID == null) return;
    var p = tree.getParentNode(selectNodeID.replace("treeTd",""));
    if (p == null) return;
    tree.selectNodeID = p.id.replace("treeDiv","treeTd");
    tree.refreshNode(p.id.replace("treeDiv",""));
    document.getElementById(tree.selectNodeID).click();//删除节点后执行父节点点击事件
}

三、递归数据层的处理：

最开始也说了，每颗树只允许有一个递归层，并且第一层不允许递归，对于绝大多数目录结构来说，通常就是给的一个递归数据源通过程序处理展现目录结构，程序处理有可能采用递归方式调用，也有可能不是的，但是数据一般是会组织成递归形式的，比如查询出来的数据一般会带有ID,ParentID等。这里的配置模块中，如果将一个树层数据源设置成递归的话，只要是没有跳出该层，展开下一层始终执行该层的SQL语句，比如部门的目录结构，第一层是一级部门，第二层部门就可能是递归了，点击第一层时加载第二层的数据，即layer+1，执行第二层的SQL语句，这时进入递归层了，同时打上一个递归标志，点击第二层部门逐级展开时layer始终是2，保证了始终执行第二层的SQL语句。贴个代码片段：

int nextLayer = 2;
if (this.context.Session["Layer"] != null && this.context.Session["Layer"].ToString() == layer.ToString())//判断是否属于递归层

Session["Layer"]标识递归层的层序号，如果进入递归层，展开时层序号不变
            {
                info = GetLayerInfo(layer);//读取层配置信息信息此处layer>=2
                nextLayer = layer + 1; //取递归层的下一层
            }
            else
            {
                info = GetLayerInfo(layer + 1);//或取下一层的节点数据
                nextLayer = nextLayer + layer; //第一次取递归层的下一层
            }
            if (info.Recursive == "1") {......}//1表示递归，0表不递归

读取递归层数据的同时会尝试去读取递归层的下一层的SQL语句（如果还有下一层的话），如果还有第三层，部门用户层时，那么递归部门的同时，还要“递归人”，有时候人员会和子部门并列在同层次，这个在后面用个例子来说明。

四、选择框的处理：

节点前是否显示勾选框，会判断是否输出一个<input id='"+nodeID+"' name='"+parentID+"' type='checkbox' onclick='SelectAll(this)'/>标签，代码片段是这样的：

if (type == "child")
            {
                if(!showbox) //是否显示选择框
                {
                  return "<table border=0 cellpadding='0' cellspacing='0'><tr><td><img class='" + type + "' layer='" + layer + "'  src='../Images/child.gif' hspace='0' vspace='0' style='cursor:hand'></td><td><img id='"+ this.TagName[2].name+nodeID+"' src='../Images/"+nodetype+".gif'></td></tr></table>";
                }
                else
                {
                  return "<table border=0 cellpadding='0' cellspacing='0'><tr><td><img class='" + type + "' layer='" + layer + "'  src='../Images/child.gif' hspace='0' vspace='0' style='cursor:hand'></td><td><input id='"+nodeID+"' name='"+parentID+"' type='checkbox' /></td><td><img id='"+ this.TagName[2].name+nodeID+"' src='../Images/"+nodetype+".gif'></td></tr></table>";
                }
            }
            else
            {
                if(!showbox)
                {
                  return "<table border=0 cellpadding='0' cellspacing='0'><tr><td><img class='" + type + "' layer='" + layer + "' id='"+ this.TagName[2].name+nodeID+"' onclick='"+this.treeName+".tdClick(this)' src='"+ this.IMG[1].imgSrc+"' title='"+this.IMG[1].imgTitle+"' hspace='0' vspace='0' style='cursor:hand'></td><td><img id='folder"+this.TagName[2].name+nodeID+"' name='"+nodetype+"' src='../Images/"+nodetype+".gif'></td></tr></table>";
                }
                else
                {
                  return "<table border=0 cellpadding='0' cellspacing='0'><tr><td><img class='" + type + "' layer='" + layer + "' id='"+ this.TagName[2].name+nodeID+"' onclick='"+this.treeName+".tdClick(this)' src='"+ this.IMG[1].imgSrc+"' title='"+this.IMG[1].imgTitle+"' hspace='0' vspace='0' style='cursor:hand'></td><td><input id='"+nodeID+"' name='"+parentID+"' type='checkbox' onclick='SelectAll(this)'/></td><td><img id='folder"+this.TagName[2].name+nodeID+"' name='"+nodetype+"' src='../Images/"+nodetype+".gif'></td></tr></table>";
                }
            }

由于节点是动态加载的，勾选中父节点时，如果没有展开子节点，子节点是不会被选中的，因为dom对象标签此时还没有创建，对应所有已展开的节点，勾选父节点，子节点会全部选中，这里调用了一个递归的处理方法，方法如下：

这个方法应该是可以修改得更合理些，没有深入考虑，目前的话，比如展开了节点个数是100个（即创建加载的checkbox对象有100个），如果勾选某个父节点，父节点下有5个子节点，那么一共相当于选择了6个，这样的话计算次数是6*100=600次，可以考虑从勾选节点的下游开始判断，那样计算次数就要少很多了。

五、树型配置及应用示例（种树）：

种树之前，先说下配置信息在数据库的存储方式，有两张表，即树根信息表和树层信息表，如下图：

主要是树层表说下，STL_LayerIndex是层序号，动态加载各层的数据时就是通过层序号去执行对应层的SQL语句，STL_LayerName是层名称，STL_Select层对应的数据源（SQL语句）， STL_KeyField是层的主键字段，该字段会传入下一层进行数据过滤，STL_NodeName是节点名称字段，目录结构的各节点显示的名称就是设置这个字段，STL_Recursive表示是否属于递归层(1是0否) ，STL_URL存储链接地址（即一段JS），STL_State这个字段应该去掉的，STL_NodeType是节点类型字段，根据该字段的值加载不同的节点图标。

①添加树根

我就以常见的人力资源结构目录为例来种一棵树，截图操作如下：

上面的树根标题也可以这样写SELECT '人力资源结构'，根据需要可以带参数，这个是链接传入的参数，比如配置树的链接为TreeView.aspx?STI_Code=HR_Map&Param=ID|9527,NAME|ZXC(表示传了两个参数)，标题可以写成SELECT Title FROM TABLE WHERE T_ID=[ID] AND T_NAME='[NAME]'，一般种一棵树，树根标题是固定，有的情况标题是要动态变化的。

② 添加树层

简单说下上面的几个效果图，对应各层的数据源有三个内置的替换参数，首先是[TreeID] 这个是上一层节点的主键字段的值，[UserID]当前登录用户的ID（对应于Session["USER_ID"])，[ReportYear]控制整棵树的外围参数，对应报表目录来说一般是年度，当然也可以是其它，一般的目录这个外围参数可能用不着，一会下面再贴个实际示例给大家看下这三个参数怎么用。每层里面有个type字段，这个很重要，这个是标志是否叶子节点（0表示叶子，非0则不是叶子），会输出到前端页面做判断，对于递归层，必须动态判断是否叶子节点，上图中的下级部门是一个递归层，而且这个递归层下面还有下一层，这就是上面说的递归部门时还要“递归人” 的情况了，如果某个部门下既没有子部门也没有用户，那么就是叶子节点，所以第二层的type需要(SELECT COUNT(1) FROM Department AS d
WHERE ParentCode = d2.Code)+(SELECT COUNT(0) FROM USER WHERE DeptID=d2.Code) AS type 这样来判断，对于第三层毫无疑问是叶子层，所以type直接给0即可，在已知某个层是否叶子或非叶子层时，可以直接对type赋0或非0值。像上面那样配置后链接到TreeView.aspx?STI_Code=HR_Map看到的效果如下：

让这棵树显示选择框的情况也截个图看下：

前面也说选择框的应用对一般的展示目录没有什么意思，选择框主要应用在赋值权限的权限目录结构和选择收件人的消息通讯目录等。

删除树的时候直接做了个级联删除，把树层一起删除，如下：

这个提示消息框是不是觉得有点小酷的，用的是netman写的ymPrompt.js消息组件，比较漂亮，有很多样式可选（ http://www.ajaxbbs.net/test/ymPrompt4.0/demo.html ），写这篇文章打了两家广告了，呵呵~~~~~~~~~~，顺便说下确定取消这种仿系统自带confirm提示框，一般只是界面重画了，大多都是用DIV什么的重画，实际上并没有系统自带的confirm那种功能，当然可以通过异步实现等效于confirm的功能。系统自带的confirm一个最大的特点是可以暂停后台服务器按钮的事件的执行，点击确定后继续执行服务器按钮下面的事件，重写的就不行，重写的弹出的整个框是没有返回值的，而confirm是有返回值的。不过可以借助模态窗口来实现confirm完全一样的功能，就是界面比较丑陋，因为模态窗口是有返回值的。我试了下是可以的，截个图看下

不过IE8里模态窗口的地址栏，状态栏没法屏蔽，显得比较难看，所以上面删除树的时候，我也只能是通过异步操作删除的。

到此为止已经种了一棵树，并且也看到了树型的效果，列举的这个示例其实也是比较简单的，而实际的项目应用中种的树是比较复杂的，尤其是涉及报表目录结构的树，从上层领导到基层单位，逐级根据权限查看不同类的报表并且逐级汇总数据，点击左边的汇总表，右边对应出汇总报表，点击基层表，右边出相应的基本报表数据，这样的目录就要用到前面说的内置参数，用户ID，外围参数。下面只以截图的方式来列举一个稍微复杂点的目录树，以其中一个项目中的报表逐级汇总目录为例，各层的数据源来自于自定义的表值函数。下面的截图是一棵日报树，分三级汇总，处室、区县、基层单位，处室登录后可以看所有的汇总然后上报，也可看各区县的汇总，同时可以看基层的数据，区县登录查看本区县所有基层上报的数据和每个基层单独的数据，基层就只看本单位的数据。（以下图片文字即图片内容仅为本文参考所用，在此保留最终解释权）

简单说下上面图中URL的链接地址，点击某个节点名称右边出现相应的数据页面，肯定是要传参数的，比如 [FormCode]在URL地址中表示取该节点对应的一条数据中的编号，这里有个参数适配调整的过程，即根据列名查找对应列的值。至于不同用户登录加载不同的数据，关键关系要明确，编写自定义函数组织好数据，例如对于区县来说，读到第4层就相当于是叶子节点了，对于基层单位来说读到第3层就相当于叶子节点了，所以对type要做好控制，各层节点什么情况下是叶子节点，什么情况下是非叶子节点。

上面的实例中，实际情况不完全那样，还有另外一个要求，要求局级领导可以查看每日总的汇总数据和各个处室、各处室下各区县及各区县下的单位报表数据。对应上面的日报目录只需要做一个小小调整即可，即把第5层设置为递归层，主键设置成和第四层一样(主外键的传递要控制好)，同时把第5层的type判断改为动态判断是否叶子节点就可以了，还是截个图，如下：

六、功能探索——嫁接树

虽然这个模块的功能基本能满足绝大多数项目的应用，严格来说还是有些要改善的地方，比如一棵树可以考虑允许多个递归层，另外其中一个可以考虑完善功能就是希望能把多棵树组合起来形成一棵目录树进行展现，暂把这个称之为“嫁接树”，有这个所谓的概念出现，当然是有实际项目中有这样的潜在需求，比如上面的日报目录，还有月、季、年等目录，但是日报结构比较特殊，是单独的一棵树，月报等其它报表是另外一个树，希望日、月、季、年所有报表目录用一棵树来展现，但是这两棵树的层次结构差别比较大，如果要整合成一棵树，不用嫁接的概念去体现，也不是没有办法，可以通过自定义函数来组织，这样的话函数的判断就很复杂和臃肿了，不值得。所以要考虑下多棵树的组合展现，初步的想法是再种一棵“友谊树”，这棵树负责组织不同的树，前端展现的时候展现“友谊树”就可以了。有时间再折腾吧~~~

七、文件下载及调用说

将TreeView文件夹拷贝到站点根目录，TreeView.dll复制到站点bin目录，webconfig里配置如下：

</appSettings>

系统配置链接地址： /TreeView/Tree/TreeInfoList.aspx

树型展示链接地址： /TreeView/Tree/TreeView.aspx?STI_Code=树根编号&ReportYear=[Year]（ReportYear为可选参数）

文件下载：树型配置（点击链接下载）

补充上一篇的一个文件，上一篇实际应用也很少那么做，权当忽悠好了:) 只是一个大致参考： download

八、后记

到此这个树型配置模块大致说完了，有些没说到，有些也没细说，上面给的下载的是发布后的文件，基本上只要数据符合数据库关系结构，利用这个配置就能组合成树型结构进行展示，要求熟悉数据库自定义函数编写，种复杂的树基本上都是通过用自定义表值函数作为数据源来实现的。还有对于这个目录选择框的扩展应用，实际应用中也是效果很好的，有空再说了，另外这个树型配置一直是在IE里跑的，其它浏览器我没试过，不行的话可以自行修改JS代码。

夏天到了，大家心里容易燃烧，对键盘温柔点：），不要把内心的烦躁发泄到猛敲键盘上，猛敲代码到是可以~~~呵呵~~

写这篇树型配置时，我想起了一首歌《好大一棵树》，这歌是田震阿姨(或者大姐吧：）)唱的，比较喜欢她的歌，和韦维唱的风格差不多，柔中带刚的那种。

                    田震-好大一棵树
                    作词：邹友开作曲：伍嘉冀
                                      头顶一个天
                                      脚踏一方土
                                      风雨中你昂起头
                                      冰雪压不服
                                      好大一棵树
                                      任你狂风呼
                                      绿叶中留下多少故事
                                      有乐也有苦
                                      欢乐你不笑
                                      痛苦你不哭
                                      撒给大地多少绿荫
                                      那是爱的音符
                                      风是你的歌
                                      云是你脚步
                                      无论白天和黑夜
                                      都为人类造福
                                      好大一棵树
                                      绿色的祝福
                                      你的胸怀在蓝天
                                      深情藏沃土
                           好大一棵树
　绿色的祝福
    你的胸怀在蓝天
　深情藏沃土
　头顶一个天
    脚踏一方土
    风雨中你昂起头
    冰雪压不服
好大一棵树
任你狂风呼
绿叶中留下多少故事
有乐也有苦
欢乐你不笑
痛苦你不哭
撒给大地多少绿荫
那是爱的音符
风是你的歌
云是你脚步
论白天和黑夜
都为人类造福
好大一棵树
绿色的祝福
你的胸怀在蓝天
深情藏沃土
好大一棵树
绿色的祝福
你的胸怀在蓝天
深情藏沃土
你的胸怀在蓝天
深情藏沃土

小时候听着歌的时候，我总觉得是在歌颂书守边疆，保家卫国的解放军战士，歌词里那么多是绿色，容易让人想到绿色军装嘛，那么多大树，战士的形象就高大挺拔嘛。今天专门搜了下，并不是表达这个意思，原来是为了纪念先前领导人胡耀邦所作。

搜索注解：好大一棵树这首歌是89年初胡耀邦去世的时候作的，当时著名词曲作家邹友开正坐在火车上，听到耀邦同志病逝的消息，思绪万千，久久不能入眠，就在列车上写下了歌词。这首歌就是怀念伟人，由伍嘉冀谱曲，田震演唱。

本文链接

告别ADO.NET实现应用系统无缝切换的烦恼(总结篇)

2009-11-02T02:18:00Z

要实现无缝切换，当然还是要有前提条件了，就是各个不同的数据库之间的表和其它对象都已经成功移植了，没有这个前提，纯用ADO.NET做系统无缝切换那是不可能的了，比如SQL SERVER中写的存储过程，自定义函数直接复制到ORACLE上就行了吗？当然是不行，写法及变量定义要做些调整才可以成功移植的，还有变结构字段类型等等的都可能是要做相应调整，这些都做好了才能谈系统的无缝切换。

SQL SERVER行转列应用小结

2009-09-08T01:15:00Z

SQL SERVER行转列，有点老的话题，还是要忽悠下~~最好上首页忽悠更多的同志~~

SQL SERVER函数——表值函数的处理

2009-09-08T01:13:00Z

有些情况可能用下表值函数，表值函数主要用于数据计算出来返回结果集，可以带参数（和视图的一个大的区别），如果函数中没有过多的逻辑处理，如变量的定义，判断等，表值函数返回结果集可以简单向下面这么写：[代码]调用的时候就 SELECT XX FROM Fun_GetReprotNews('xx')如果函数中要定义变量，进行判断计算处理什么的，写法有点不一样了，要定义表变量才行，表值函数里是不允许创建临时...

博客园_船长

审批流设计方案的探究

WEB项目(B/S系统)打包安装（总结篇）

文件上传之断点续传方案

再次分享一个多选文件上传方案

SQL SERVER里的赋值机制闲聊

FLEX4.0开发流媒体视频播放器(总结篇)

1 流媒体视频简介

2 功能概述

2.1 设计目的 作为系统平台功能的扩充，开发此模块，现实一个功能相对全面的流媒体播放器，主要用于播放流媒体格式的视频，提供给特殊要求的客户用于外网在线播放新闻视频。

2.2 功能说明1） 视频的暂停、播放2） 视频拖动播放和定点播放3） 音量的禁音和开启4） 拖动滑块控制音量5） 视频缓冲进度高亮显示6） 视频全屏处理，点击按钮或点击视频画面实现全屏

2.3 运行环境此模块采用Flex4.0开发，要求客户端安装flash 10.0.0 （含以上版本）

3 功能设计

告别ASP.NET种树的烦恼

告别ADO.NET实现应用系统无缝切换的烦恼(总结篇)

SQL SERVER行转列应用小结

SQL SERVER函数——表值函数的处理

2.1 设计目的
作为系统平台功能的扩充，开发此模块，现实一个功能相对全面的流媒体播放器，主要用于播放流媒体格式的视频，提供给特殊要求的客户用于外网在线播放新闻视频。

2.2 功能说明
1）视频的暂停、播放
2）视频拖动播放和定点播放
3）音量的禁音和开启
4）拖动滑块控制音量
5）视频缓冲进度高亮显示
6）视频全屏处理，点击按钮或点击视频画面实现全屏

2.3 运行环境
此模块采用Flex4.0开发，要求客户端安装flash 10.0.0 （含以上版本）