练习1– Hello Umboy在这个实验中,你将开发和部署你的第一个Web Part。这个Web Part将:
·
在这个Web Part中显示标签上的文本
·
允许在这个标签上编辑文本和修改文本颜色
任务1– 创建一个SharePoint Web Part 解决方案在这个任务重将创建一个解决方案和项目。将包含此实验中开发工作的其余部分。


1.
开始|程序|Microsoft Visual Studio 2008 | Microsoft Visual Studio 2008打开Visual Studio 2008.
2.
从这个菜单选择 文件 | 新建| 项目.  
3.
在这个新项目对话框中,展开Visual C# SharePoint
项目类型 并选择 Web Part.
4.
位置中输入 “E:"testcode"Labs"Lab01-WebParts
5.
名称中输入“HelloUmboyWebPart

6.
解决方案名称中输入“UMBOY_WebParts

图1 – 新建项目
7.
单击确定.
8.
在解决方案文件夹中出现了 HelloUmboyWebPart
项目。注意将创建名为WebPart1的文件夹 和他包含的一些文件.

图2 – 在解决方案资源管理器中的WebPart1
9.
从这个项目中删除WebPart1
文件夹.  在下一步你将创建一个合适名称的新Web Part.
注意:
虽然您可以重命名 WebPart1 文件夹和其内部文件,但更快、 更简单的还是删除并重新创建 这个Web  Part。
10.
解决方案资源管理器中右击刚建的 HelloUmboyWebPart
项目,选择添加 | 新建项.
11.
添加新项对话框的类别区域选择SharePoint,在模板区域选择Web Part.
12.
把这个Web Part命名为 HelloUmboy 并选择 添加.

图3 – 添加新项


注意这个HelloUmboy文件夹已经被添加到了本项目中。这个文件夹包含了三个基本名称为HelloUmboy的文件
13.
右击这个HelloUmboyWebPart
项目并选择属性. 将显示这个项目的属性.
14.
选择这个调试标签.
15.
设置启动URL
http://localhost. 这个URL被VSeWSS 用来确定SharePoint 的位置,当部署这个方案时.

图4: 启动URL
任务2 –添加Web Part 定制这个任务将描述增加代码到这个Web Part的步骤。将创建 Web Part的属性,包括可以使用 SharePoint 基于浏览器的接口更改设置.


1.
打开HelloUmboy.webpart. 这个XML文件包含了部署到SharePoint 中的Web Part 定义.
<?xml version="1.0" encoding="utf-8"?>
<webParts>
  <webPart xmlns="http://schemas.microsoft.com/WebPart/v3">
    <metaData>
      <!--
      The following Guid is used as a reference to the web part class,
      and it will be automatically replaced with actual type name at deployment time.
      -->
      <type name="3513d572-17c8-4551-a0ef-7da53d1e34de" />
      <importErrorMessage>Cannot import HelloUmboy Web Part.</importErrorMessage>
    </metaData>
    <data>
      <properties>
        <property name="Title" type="string">HelloUmboy Web Part</property>
        <property name="Description" type="string">HelloUmboy Description</property>
      </properties>
    </data>
  </webPart>
</webParts>
图5- HelloUmboy.webpart
2.
修改这个Description property为 “A simple Hello Umboy Web Part”.
3.
在Visual Studio 中打开HelloUmboy.cs
文件,并检查这个代码.  这个CreateChildControls
方法包含了实现添加标签控件到Web Part中注释代码。
在这个CreateChildControls

方法中反注释掉缺省代码.  这个方法将类似如下代码.
protected override void CreateChildControls()
    {
            base.CreateChildControls();


            // TODO: add custom rendering code here.
             Label label = new Label();
             label.Text = "Hello Umboy";
             this.Controls.Add(label);
}


注意:
CreateChildControls是一个被重写的方法.  HelloUmboyWebPart需要这个方法提供一个明确的实现,在控件被创建时。


4.
下面的步骤是为这个Web Part添加属性。创建一个新属性以便允许用户定义这个“Hello Umboy” 消息来显示.  粘帖下面的代码到这个Web Part 类中.
private string _helloUmboyText = "Hello SharePoint!";


public string HelloUmboyText
{
  get { return _helloUmboyText; }
  set { _helloUmboyText = value; }
}


5.
这个 Web Part 属性必须用一个新特性来修饰。添加下列using语句到HelloUmboy.cs的头部.  
using System.ComponentModel;


6.
为SharePoint正确的显示这个用户修改的HelloUmboyText 属性, 你必须添加下列特性到这个属性中。
[WebBrowsable(true),
Personalizable(PersonalizationScope.User),
WebDescription("Hello World Text"),
Category("Hello World"),
WebDisplayName("Text")]
public string HelloUmboyText
{
  get { return _helloUmboyText; }
  set { _helloUmboyText= value; }
}


这些特性控制了这些属性如何显示给用户,当修改这个Web Part时.

表1 – HelloUmboyText  属性说明


WebDisplayName("…")
This attribute defines the text that is used to label the property in the Web Part task pane.
WebBrowsable(true)
This is used to allow Editing of the Web Part property.  Without this the property will not be displayed in the Web Part task pane.
Personalizable(PersonalizationScope.User)
This attribute should be coupled with WebBrowsable as it allows saving of modified property values.
WebDescription("…")
This is an optional attribute and can contain anything you define.  The description is displayed as a tooltip when hovering over the property in the Web Part task pane.
Category("…")
This optional attribute is an organizing mechanism, defining where the property should reside in the Web Part task pane of SharePoint and also providing a grouping strategy for logically related properties.  The default category is Miscellaneous.


7.
接下来, 添加一个允许用户为这个消息选择颜色的属性.  这将遵循与上面类似的步骤来处理。.
首先,添加System.Drawing的引用.  右击这个HelloUmboyWebPart
项目,并选择添加引用.
8.
从.NET标签中选择System.Drawing.

图7 – 添加引用对话框
9.
单击确定.
10.
添加下列using 语句到HelloUmboy.cs头部.
using System.Drawing;


11.
使用下列代码插入TextColor
属性.
private KnownColor _textColor = KnownColor.Black;


[WebBrowsable(true),
Personalizable(PersonalizationScope.User),
WebDescription("Hello Umboy
Text Color"),
Category("Hello Umboy"),
WebDisplayName("Text Color")]
public KnownColor TextColor
{
  get { return _textColor; }
  set { _textColor = value; }
}


注意: KnownColor 是包含在 .NET 彩色的所有颜色的枚举。枚举将提供一个下拉列表形式的选择组用于编辑 SharePoint Web 部件任务窗格中 Web 部件。


12.
接下来的这步是编辑CreateChildControls

方法中的代码。设置label.Text 前你应该确保这个属性包含了一些文本.  在设置label.Text值前添加下列代码.
if (string.IsNullOrEmpty(HelloUmboyText ))
{
  HelloUmboyText  = "Hello SharePoint!";
}


13.
删除设置这个标签文本的缺省代码.
label.Text = "Hello Umboy";


14.
现在设置这个label
变量Text
属性为HelloUmboyText
文本并设置这个labelForeColor
属性为TextColor property.
label.Text = HelloUmboyText ;
label.ForeColor = Color.FromKnownColor(TextColor);


注意:
你需要转换KnownColor
枚举值为Color 值.


15.
最终CreateChildControls
方法将象如下.
protected override void CreateChildControls()
{
  base.CreateChildControls();


  Label label = new Label();


  if (string.IsNullOrEmpty(HelloUmboyText ))
  {
    HelloUmboyText  = "Hello SharePoint!";
  }


  label.Text = HelloUmboyText ;
  label.ForeColor = Color.FromKnownColor(TextColor);
  this.Controls.Add(label);
}


任务 3 – 部署和测试这个With Web Part 编码完成后,这部分将部署它到SharePoint 网站.  你就可以测试它来确认它是否正确了。


1.
右击HelloUmboyWebPart
项目并选择部署
则部署这个项目到SharePoint 中。
2.
在 Visual Studio 状态栏中应该显示部署成功.
3.
打开 Internet Explorer 并导航到这个SharePoint 主页, http://localhost.
4.
在打开的网页的右上角位置,选择网站操作 | 编辑网页.

图8 – 编辑网页
5.
在左边的Web Part区域头部单击 添加Web Part.
6.
滚到所有Web Part | 杂项| HelloUmboy Web Part 并选择这个复选框.

图9 – 添加Web Part
7.
单击 添加 .
8.
这个HelloUmboy Web Part 将添加到这个页面中,并缺省显示Hello SharePoint!

图10 – 添加的Web Part
9.
在新添加的Web Part 上选择编辑按钮来编辑这个Web Part.  选择编辑共享 Web Part.

图11 – 编辑Web Part
10.
在这个显示的 Web Part 任务面板中, 展开这个 Hello Umboy 部分.
11.
在这个Text
框中输入期望的文本, 并在Text Color中选择期望的颜色.



图12 – 定制Web Part
12.
单击 确定.这个 Web Part 将显示修改的情况.

posted on 2008-08-04 10:22  晃晃悠悠  阅读(924)  评论(0)    收藏  举报