SharePoint开发学习笔记3——Visual Web Part及自定义配置界面

Visual Web Part

我们在使用VS2010新建SharePoint项目的时候,我们可以看到一个Visual Web Part工程模板(如图)。

 

以前在SharePoint中实现一个Web Part一般都是使用类工程,几乎所有的表现样式和控件等都是通过手写代码来实现的,要不就是借用第三方的用户控件包装器去实现,而且调试运行也相对麻烦。

现在VS2010提供的这个模板直接使用用户控件来进行Web Part的设计,可以像做普通网页一样对它进行开发,而且调试运行的时候,VS2010也会临时的自动将它部署在你选择的站点里进行运行,调试也变得相当方便了。

 

首先,你要创建一个Visual Web Part项目需要你在计算机管理员的权限下运行VS2010才行,当然,如果不是的话,VS2010也会对你警告的。

 

下一步我们正式开始创建一个新的Visual Web Part工程。当你点击点击创建按钮后,VS2010会弹出一个窗口,让你选择在哪个本地站点中进行调试(如图)。

 

 

填写一个你自己的SharePoint站点即可,然后点击完成之后,你的项目就创建成功了。VS2010也会在项目创建成功后立即转向到用户控件上。然后我们点开设计视图,就可以直接拖服务端或者Html控件上来了,此外,还可以直接在此加载JQuery这些JS库进来(如图)。

 

 

完成的功能很简单,就是输入你的名字,点击按钮后,下排的文字就显示欢迎你的文字。

 

我们直接点调试运行,就会自动弹出我们之前选择部署的站点,输入用户名和密码后进入,点击站点设置,选择编辑页面。(如图)

 

 

然后在页面上再点击添加Web Part,在Custom目录下找到之前我们创建的Web Part,点击添加按钮。(如图)

 

 

之后,我们做好的Web Part就出现在SharePoint的站点界面中了。(如图)

 

 

自定义Web Part配置界面

SharePoint对于WebPart中的字符串、整数、浮点数等数据类型的属性,会自动在配置界面显示出一个文本框,对于枚举类型,SharePoint也会自动显示为一个下拉列表,对于布尔型,SharePoint也会自动显示复选框。

 

那可能还有其它的一些更复杂的类型怎么办哩?SharePoint也支持自定义WebPart的配置界面。此时就要用到EditorPart类了。

 

接着上面的工程,我们需要在工程里新建一个类,随便命一个名字:WebPartEditor,引入命名空间:System.Web.UI.WebControls.WebParts,并让这个类继承EditorPart类,并实现它的两个方法ApplyChanges和SyncChanges,简单描述:

  • ApplyChanges:是由配置界面向WebPart传值;
  • SyncChanges:是由WebPart向配置界面传值。
 

类WebPartEditor代码如下:

 

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.WebControls;

namespace VisualWebPartProject2
{
    class WebPartEditor:EditorPart
    {
        DropDownList ddl_Text;

        protected override void OnInit(EventArgs e)
        {
            //保证控件被创建
            EnsureChildControls();
            base.OnInit(e);
        }

        //创建控件
        protected override void CreateChildControls()
        {
            Controls.Clear();

            ddl_Text = new DropDownList();
            ddl_Text.Items.Add("配置一");
            ddl_Text.Items.Add("配置二");

            Controls.Add(ddl_Text);
        }

        //绘制自定义配置界面的外观
        protected override void RenderContents(System.Web.UI.HtmlTextWriter writer)
        {
            writer.Write("配置选项:");
            ddl_Text.RenderControl(writer);
        }

        public override bool ApplyChanges()
        {
            return true;
            //throw new NotImplementedException();
        }

        public override void SyncChanges()
        {
            //throw new NotImplementedException();
        }
    }
}

 

在WebPart类中,我们还需要实现IWebEditable接口的一个方法,注意,这个接口已经在WebPart类中引用了,我们这里只需要重写它CreateEditorParts方法,代码如下:

 

using System;
using System.ComponentModel;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using System.Collections;

namespace VisualWebPartProject2.VisualWebPart1
{
    [ToolboxItemAttribute(false)]
    public class VisualWebPart1 : WebPart
    {
        // Visual Studio might automatically update this path when you change the Visual Web Part project item.
        private const string _ascxPath = @"~/_CONTROLTEMPLATES/VisualWebPartProject2/VisualWebPart1/VisualWebPart1UserControl.ascx";

        protected override void CreateChildControls()
        {
            Control control = Page.LoadControl(_ascxPath);
            Controls.Add(control);
        }

        //自定义配置界面需重写此方法
        public override EditorPartCollection CreateEditorParts()
        {
            ArrayList controlList = new ArrayList();
            WebPartEditor ePart = new WebPartEditor();

            //分配ID,要不然会报错
            ePart.ID = this.ID + Guid.NewGuid().ToString();
            controlList.Add(ePart);

            return new EditorPartCollection(controlList);
        }
    }
}

 

这样,我们自定义的配置界面就做好了,效果如下图所示

posted @ 2010-11-05 15:58  heqichang  阅读(3247)  评论(11编辑  收藏  举报