Introdução

Visual Studio 2010 Tools for SharePoint Development

Steve Fox

O desenvolvimento para o SharePoint sempre foi um tanto misterioso para muitos desenvolvedores, que consideravam o desenvolvimento para a plataforma problemático e fora de seu alcance. A comunidade de desenvolvedores sempre ficou dividida quanto ao conjunto de ferramentas a ser usado. Por exemplo, alguns desenvolvedores usavam uma combinação de bibliotecas de classes, pastas de projeto manual com arquivos de configuração XML e eventos de saída pós-compilados para gerar recursos e soluções para o SharePoint. Outros usavam o STSDEV, uma ferramenta da comunidade, ou o Visual Studio Extensions for Windows SharePoint Services (VSeWSS) para compilar diferentes aplicativos e soluções e implantá-los no SharePoint. Em outras palavras, os desenvolvedores podiam seguir vários caminhos para implantar pacotes de recursos e soluções no SharePoint. Desafios à parte, a comunidade de desenvolvedores do SharePoint cresceu significativamente — são, aproximadamente, 600.000 desenvolvedores — e continua aumentando. No futuro, o Visual Studio 2010 oferecerá aos desenvolvedores um ótimo ponto de entrada para o desenvolvimento para o SharePoint com as novas ferramentas para SharePoint que serão fornecidas com o produto.

O SharePoint 2010 é um importante passo à frente como plataforma de desenvolvimento, não só devido ao rico conjunto de recursos aos quais a plataforma oferece suporte, mas também devido aos grandes investimentos que foram feitos no pacote de ferramentas projetado para tornar o processo de desenvolvimento mais produtivo e acessível para desenvolvedores com todos os níveis de habilidade. As duas ferramentas centrais de desenvolvimento para o SharePoint 2010 são o SharePoint Designer 2010 e o Visual Studio 2010. (O conjunto de ferramentas relacionado para designers é o pacote Expression.) Este artigo fornece uma introdução ao desenvolvimento para o SharePoint 2010, apresentando as ferramentas do SharePoint no Visual Studio 2010 (incluindo uma visão rápida dos novos modelos de projeto) e demonstrando como criar e implantar um exemplo de Web Part visual.

Ferramentas do SharePoint no Visual Studio 2010

Diversas áreas para desenvolvedores do SharePoint no Visual Studio 2010 merecem ser mencionadas. Primeiro, temos os modelos de projeto do SharePoint prontos para uso; portanto, você pode começar a desenvolver soluções imediatamente. Em segundo lugar, as ferramentas foram padronizadas segundo o empacotamento do Windows SharePoint Package (WSP). Sendo assim, quando você importar ou implantar uma solução para o SharePoint, o Visual Studio a tratará como um pacote de solução. Em terceiro lugar, alguns ótimos recursos de implantação e empacotamento, como a retração de solução e as configurações de implantação personalizada, são fornecidos com as ferramentas do SharePoint no Visual Studio 2010. E, finalmente, o novo SharePoint Explorer fornece uma exibição dos artefatos nativos e personalizados (por exemplo, listas e fluxos de trabalho) existentes em seu servidor do SharePoint. Essa é, obviamente, uma lista resumida dos recursos que representam uma grande extensão de um conjunto de ferramentas do Visual Studio projetado para atingir uma comunidade e facilitar operações para os desenvolvedores do SharePoint.

Também dignos de nota são alguns dos aprimoramentos do SharePoint 2010, que certamente podem ser usados no contexto do Visual Studio 2010. Por exemplo, o novo modelo de objeto do cliente lhe permite acessar objetos do SharePoint por meio de uma DLL referenciada, ao contrário das chamadas de serviço da Web. (No SharePoint 2007, você acessa dados de lista do SharePoint, por exemplo, usando um serviço Web do ASP.NET.) Além disso, o LINQ para SharePoint traz a potência do LINQ para o SharePoint, permitindo que você trate as listas, por exemplo, como objetos fortemente tipados. Além disso, o Silverlight (especialmente em combinação com o modelo de objeto do cliente) tem suporte nativo no SharePoint 2010 — não é mais preciso mexer no web.config para iniciar esse desenvolvimento. As soluções em modo seguro também oferecem uma forma de compilar Web Parts do SharePoint e de implantá-las em um site sem a necessidade de intervenção administrativa — ou seja, você pode implantar uma Web Part em um site do SharePoint e fazer com que ela seja executada no contexto desse site, seja em uma instância do SharePoint no local ou na nuvem, usando a versão hospedada do SharePoint. Finalmente, as listas de dados externas fazem da interação com sistemas de linha de negócios um processo de leitura/gravação e, embora aparentemente pequeno, esse é um grande salto à frente, considerando-se o suporte a ferramentas que lhe permite criar integrações de linha de negócios de forma rápida e eficaz. Para cada uma dessas inovações no SharePoint 2010, o Visual Studio 2010 fornece algum nível de suporte, seja por meio de modelos de projeto ou de APIs, aos desenvolvedores profissionais. Se existe um momento certo para começar a desenvolver com o SharePoint, o momento é este.

Desenvolvendo um projeto de Web Part visual

Um dos artefatos mais comuns que os desenvolvedores compilam e implantam no SharePoint é a Web Part. Isso faz sentido, já que as Web Parts compõem um dos principais blocos de construção para o SharePoint. Como o SharePoint é construído sobre o ASP.NET, a Web Part herda os principais recursos da arquitetura de Web Part do ASP.NET.

Um dos novos modelos de projeto do Visual Studio 2010 é o modelo de projeto de Web Part Visual, que permite que os desenvolvedores projetem visualmente uma Web Part que pode ser implantada no SharePoint. Se você for novo no SharePoint, essa é uma ótima maneira de começar a compilar aplicativos personalizados para o SharePoint 2010. A Web Part visual que demonstrarei tem algum código autossuficiente, que calcula os custos dos produtos e lista as informações em uma interface do usuário de Web Part simples.

Figura 1 Novos modelos de projeto do SharePoint

Figura 2 Exibição do designer para uma Web Part visual

Você deve ter a versão Beta 2 do Visual Studio 2010 e a versão Beta 2 do SharePoint 2010 instaladas no Windows Server 2008 de 64 bits. Abra o Visual Studio 2010, clique em Arquivo, Novo Projeto e, em seguida, navegue até o nó do SharePoint na seção Modelos Instalados. A Figura 1 mostra os diferentes tipos de modelos de projeto disponíveis. Por exemplo, o modelo Import VSeWSS Project fornece um caminho de atualização de seus projetos atuais do VSeWSS; os modelos de fluxo de trabalho lhe permitem criar e implantar projetos de fluxo de trabalho no SharePoint; o modelo Site Definition fornece uma infraestrutura no nível do site que você pode compilar e implantar; e o Import SharePoint Solution Package é o modelo que permite importar WSPs para reimplantação em uma instância de servidor local. Para este passo a passo, selecione o modelo de projeto de Web Part Visual, forneça um nome (por exemplo, SampleWebPartProject) e um local para seu projeto e clique em OK.

Uma vez criado um projeto, o Visual Studio 2010 cria vários arquivos padrão. Expanda os nós do projeto no Gerenciador de Soluções para ver os arquivos. Os principais arquivos com os quais você trabalhará neste artigo estão no nó SampleWebPartProject. Observe que a Web Part visual padrão se chama VisualWebPart1. Para alterar isso, clique com o botão direito do mouse no nó VisualWebPart1 no Gerenciador de Soluções, selecione Renomear e digite um novo nome para sua Web Part.

Observe também, no Gerenciador de Soluções, a presença dos nós Recursos e Pacote. Essas são as novas partes da infraestrutura do Visual Studio 2010 que empacotam uma solução do SharePoint usando um recurso do SharePoint. Para os novos desenvolvedores do SharePoint, um recurso organiza seu aplicativo de uma forma que pode ser compreendida pelo SharePoint. Os recursos podem ser implantados no SharePoint no nível de site ou da Web, por exemplo. Um recurso é estruturado por meio de um conjunto de arquivos de configuração XML, e ele também faz referência (dependendo do nível de confiança para seu aplicativo) ao assembly do cache de assembly global (GAC). Especificamente, cada recurso tem sua própria pasta na hierarquia de pastas do SharePoint, e os arquivos de configuração ficam nessa pasta e fornecem os metadados necessários para o recurso. O pacote contém recursos e outros ativos, e é usado quando você implanta soluções no SharePoint. O pacote é também o local onde é determinada a localização da implantação do assembly. O Visual Studio 2010 introduz um designer de pacote, que facilita muito a exibição e o gerenciamento de pacotes. Se você clicar duas vezes no nó Pacote, o designer será aberto. O designer fornece a capacidade de adicionar e remover recursos de seu pacote implantável. Esse designer representa um importante avanço para ajudar os desenvolvedores a moldar suas soluções do SharePoint por meio da adição de recursos.

Volte para a exibição do Gerenciador de Soluções, clique com o botão direito do mouse no arquivo ProductInfoUserControl.ascx e escolha Exibir no Designer. Isso abre uma exibição na qual você pode arrastar e soltar controles da caixa de ferramentas para a superfície do designer da Web Part. Você notará três exibições: Design, Dividir e Código. Neste exemplo, adicionei (digitando) um título e alguns controles, incluindo caixas de texto e um botão para calcular o custo do produto. Também digitei rótulos para os controles que foram adicionados à página (consulte a Figura 2).

Depois de concluir o layout de sua Web Part visual, você pode adicionar manipuladores de eventos para o botão. Mas, antes de fazermos isso, vamos dar uma olhada rapidamente no código-fonte da Web Part visual. Como você pode ver no extrato de código da Figura 3, o Visual Studio acrescenta um pouco de definição automática de estilos à interface do usuário na forma de sintaxe de CSS. Você também pode ver os controles reais (e, no caso da lista suspensa, a coleção de itens) que compõem a interface do usuário. Observe que, a fim de resumir o artigo, eu removi as diretivas que são geradas automaticamente e incluídas na parte superior do código-fonte.

Para adicionar manipuladores de eventos à Web Part, clique duas vezes no botão. Isso o leva ao code-behind. Isso também adiciona um evento onClick ao projeto do controle ASCX. Por exemplo, na Figura 3, observe o evento onclick="btnCalcPrice_Click" incluído em btnCalcPrice. O code-behind, listado na Figura 4, contém um código simples que lhe permite calcular o preço do produto que é selecionado na caixa de listagem. As principais partes do código são as variáveis de nível de classe (os "doubles"), que representam a forma por extenso que usei para calcular o custo do produto; a coleção List of Products (que mantém vários objetos Products que são adicionados à caixa de listagem); e o evento btnCalcPrice_Click. Quando a página é carregada no SharePoint, o código chama o método generateProductList, que popula a caixa de listagem. O evento btnCalcPrice_Click, então, calcula o custo de um produto específico — dependendo da seleção do usuário — e exibe as informações na caixa de listagem da interface do usuário.

Figura 3 Código-fonte para SalaryCalcWebPartUserControl.ascx

<style type="text/css">
.style1
{
font-family: Calibri;
font-size: medium;
font-weight: bold;
}
.style2
{
font-family: Calibri;
font-size: small;
font-weight: bold;
}
</style>
<p class="style1">
Product Catalog</p>
<p class="style2">
Product:  
<asp:DropDownList ID="dropdwnProducts" 
runat="server" Height="20px"
style="margin-left: 21px" Width="200px">
<asp:ListItem>Helmet</asp:ListItem>
<asp:ListItem>Stick</asp:ListItem>
<asp:ListItem>Skates</asp:ListItem>
<asp:ListItem>Elbow Pads</asp:ListItem>
<asp:ListItem>Kneepads</asp:ListItem>
</asp:DropDownList>
</p>
<p class="style2">
Description: <asp:TextBox ID="txtbxDescription" runat="server"
Width=”200px” Enabled=”False”></asp:TextBox>
</p>
<p class="style2">
SKU:
<asp:TextBox ID="txtbxSKU" runat="server" style="margin-left: 48px"
Width="200px" Enabled="False"></asp:TextBox>
</p>
<p class="style2">
Price:<asp:TextBox ID="txtbxPrice" runat="server"
style="margin-left: 48px"
Width="200px" Enabled="False"></asp:TextBox>
</p>
<p class="style2">
Quantity:
<asp:TextBox ID="txtbxQuantity" runat="server" 
Width="200px" Enabled="False"></asp:TextBox>
</p>
<p class="style1">
<asp:Button ID="btnCalcPrice" runat="server"
onclick="btnCalcPrice_Click"
Text="Calc." />
</p>

Quando um usuário clica no botão, a Web Part realiza um postback para executar o evento — aqui, o cálculo do custo do produto. O que provavelmente é mais interessante do que o código da Figura 4, que, em sua essência, é bastante simples, é a forma como a Web Part expõe esse código na Web Part real. Uma vez que o que fizemos foi criar um controle de usuário ASP para nossa Web Part que inclui uma aparência e um code-behind, a estrutura do projeto ainda tem a Web Part real que deve expor esse controle. Para isso, o Visual Studio cria uma cadeia de caracteres chamada _ascxPath, que representa o caminho para o controle de usuário ASCX localizado dentro da hierarquia de pastas do SharePoint 2010. Observe também que, no método CreateChildControls, uma instância de um controle é criada e definida para o caminho do controle do usuário (usando o método LoadControl). Ela é, então, adicionada à coleção Controls usando o método Add. Isso permite que a Web Part exponha o controle de usuário ASP dentro da Web Part no SharePoint. A Figura 5 mostra o código.

Figura 4 Código-fonte para ProductInfoUserControl.ascx.cs

using System;
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Collections.Generic;
using System.Data;
namespace SampleWebPartProject.ProductInfo
{
public partial class ProductInfoUserControl : UserControl
{
double tax = .11;
double totalCost = 0.0;
List<Products> lstOfProducts = new List<Products>();
protected void Page_Load(object sender, EventArgs e)
{
generateProductList();
}
private void generateProductList()
{
lstOfProducts.Add(new Products()
{ strName = "Helmet", strDescr = "Hockey helmet.", strSKU =
"KLSONHELMT1224", dblPrice = 59.00, intQuantity = 28 });
lstOfProducts.Add(new Products()
{ strName = "Skates", strDescr = "Hockey skates.", strSKU =
"SKATWOKSH0965", dblPrice = 438.00, intQuantity = 88 });
lstOfProducts.Add(new Products()
{ strName = "Stick", strDescr = "Composite hockey stick.",
strSKU = "STIK82910JJKS", dblPrice = 189.99, intQuantity =
35 });
lstOfProducts.Add(new Products()
{ strName = "Elbow Pads", strDescr = "Hockey elbow pads.",
strSKU = "ELBOP563215NN", dblPrice = 34.00, intQuantity =
12 });
lstOfProducts.Add(new Products()
{ strName = "Knee Pads", strDescr = "Hockey knee pads.",
strSKU = "KPDS7827NNJS1", dblPrice = 47.99, intQuantity =
44 });
}
protected void btnCalcPrice_Click(object sender, EventArgs e)
{
double dblCost = 0;
string strPrice = "";
if (dropdwnProducts.SelectedValue == "Helmet")
{
dblCost = lstOfProducts[0].dblPrice;
totalCost = dblCost + (dblCost * tax);
System.Math.Round(totalCost, 2);
strPrice = "$" + totalCost.ToString();
txtbxDescription.Text = lstOfProducts[0].strDescr.
ToString();
txtbxSKU.Text = lstOfProducts[0].strSKU.ToString();
txtbxPrice.Text = strPrice;
txtbxQuantity.Text = lstOfProducts[0].intQuantity.
ToString();
}
else if (dropdwnProducts.SelectedValue == "Skates")
{
dblCost = lstOfProducts[1].dblPrice;
totalCost = dblCost + (dblCost * tax);
System.Math.Round(totalCost, 2);
strPrice = "$" + totalCost.ToString();
txtbxDescription.Text = lstOfProducts[1].strDescr.
ToString();
txtbxSKU.Text = lstOfProducts[1].strSKU.ToString();
txtbxPrice.Text = strPrice;
txtbxQuantity.Text = lstOfProducts[1].intQuantity.
ToString();
}
else if (dropdwnProducts.SelectedValue == "Stick")
{
dblCost = lstOfProducts[2].dblPrice;
totalCost = dblCost + (dblCost * tax);
System.Math.Round(totalCost, 2);
strPrice = "$" + totalCost.ToString();
txtbxDescription.Text = lstOfProducts[2].strDescr.
ToString();
txtbxSKU.Text = lstOfProducts[2].strSKU.ToString();
txtbxPrice.Text = strPrice;
txtbxQuantity.Text = lstOfProducts[2].intQuantity.
ToString();
}
else if (dropdwnProducts.SelectedValue == "Elbow Pads")
{
dblCost = lstOfProducts[3].dblPrice;
totalCost = dblCost + (dblCost * tax);
System.Math.Round(totalCost, 2);
strPrice = "$" + totalCost.ToString();
txtbxDescription.Text = lstOfProducts[3].strDescr.
ToString();
txtbxSKU.Text = lstOfProducts[3].strSKU.ToString();
txtbxPrice.Text = strPrice;
txtbxQuantity.Text = lstOfProducts[3].intQuantity.
ToString();
}
else if (dropdwnProducts.SelectedValue == "Knee Pads")
{
dblCost = lstOfProducts[4].dblPrice;
totalCost = dblCost + (dblCost * tax);
System.Math.Round(totalCost, 2);
strPrice = "$" + totalCost.ToString();
txtbxDescription.Text = lstOfProducts[4].strDescr.
ToString();
txtbxSKU.Text = lstOfProducts[4].strSKU.ToString();
txtbxPrice.Text = strPrice;
txtbxQuantity.Text = lstOfProducts[4].intQuantity.
ToString();
}
}
}
}

Figura 5 Código-fonte para ProductInfo.cs

using System;
using System.ComponentModel;
using System.Runtime.InteropServices;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
namespace SampleWebPartProject.ProductInfo
{
public class ProductInfo : WebPart
{
private const string _ascxPath =
@"~/CONTROLTEMPLATES/SampleWebPartProject/ProductInfo/" +
@"ProductInfoUserControl.ascx";
public ProductInfo()
{
}
protected override void CreateChildControls()
{
Control control = this.Page.LoadControl(_ascxPath);
Controls.Add(control);
base.CreateChildControls();
}
protected override void Render(HtmlTextWriter writer)
{
base.RenderContents(writer);
}
}
}

Figura 6 Arquivo XML ProductInfo.webpart

<?xml version="1.0" encoding="utf-8"?>
<webParts>
<webPart xmlns="https://schemas.microsoft.com/WebPart/v3">
<metaData>
<type name="SampleWebPartProject.ProductInfo.ProductInfo,
SampleWebPartProject, Version=1.0.0.0, Culture=neutral,
PublicKeyToken=db3a9f914308c42a" />
<importErrorMessage>
$Resources:core,ImportErrorMessage;
</importErrorMessage>
</metaData>
<data>
<properties>
<property name="Title" type="string">
Product Info Web Part</property>
<property name="Description" type="string">Provides some
information about hockey products.</property>
</properties>
</data>
</webPart>
</webParts>

Agora que você compilou a Web Part visual, pode implantá-la em seu servidor do SharePoint. Ao criar o projeto, você o configurou para estar associado a uma instância de servidor em particular. A implicação aqui é que ainda existe algum trabalho de emenda programática que reúne o código que você acabou de escrever com o servidor do SharePoint. Se você revisar os arquivos no Gerenciador de Soluções, verá diversos arquivos XML que auxiliam nessa integração. Por exemplo, o arquivo Feature.xml (consulte o código a seguir) fornece uma definição do recurso. Você pode ver no XML que o arquivo faz referência a dois outros arquivos XML que também fornecem informações específicas sobre a Web Part. Aqui, você pode ver que Elements.xml e ProductInfo.webpart são referenciados:

<?xml version="1.0" encoding="utf-8"?>
<Feature xmlns="https://schemas.microsoft.com/sharepoint/" 
Id="416172c1-cfa7-4d7a-93ba-fe093b037fab" 
ImageUrl="" Scope="Site" Title="SampleWebPartProject Feature1">
  <ElementManifests>
    <ElementManifest Location="ProductInfo\Elements.xml" />
    <ElementFile Location="ProductInfo\ProductInfo.webpart" />
  </ElementManifests>

Elements.xml fornece informações sobre os assemblies principais incluídos no recurso, e ProductInfo.webpart define os metadados sobre a Web Part, como seu título e a descrição. Por exemplo, a Figura 6 mostra as propriedades padrão Title e Description. Você pode atualizar essas propriedades para assegurar que os metadados da Web Part expostos na Galeria de Web Parts sejam intuitivos e significativos. No caso desta Web Part, seria aconselhável corrigir o título para Product Information Web Part (Web Part de informações sobre produtos) e a descrição para algo como "Web Part that provides calculated product pricing and information" (Web Part que fornece informações e preços calculados dos produtos).

Figura 7 Web Part na página de Web Part

Existem outros arquivos de configuração XML e, se você for novo no desenvolvimento para o SharePoint, sugiro que revise cada um dos arquivos do projeto para compreender melhor suas finalidades. Agora, vamos passar para a implantação da Web Part em seu servidor do SharePoint.

Implantando o projeto de Web Part visual

Antes do SharePoint 2010, o Stsadm, uma ferramenta de administração orientada por linha de comando, era comumente usado para implantar aplicativos no SharePoint. Essa necessidade termina com o Visual Studio 2010 (e com a introdução do Windows PowerShell, mas esse é um tópico que merece seu próprio artigo). Como o seu projeto já tem um relacionamento com o seu servidor do SharePoint, e a associação tem um nível definido de confiança, você só precisa clicar com o botão direito do mouse no projeto e selecionar Compilar, verificar se a solução foi compilada e, em seguida, clicar com o botão direito do mouse e selecionar Implantar. É claro que usar a tecla F5 também funciona na depuração de suas soluções do SharePoint. Com isso, a experiência de depuração inclui etapas como anexar ao processo apropriado e reinicializar o IIS.

Depois de ter implantado com êxito a Web Part, você precisa abrir seu site do SharePoint e criar uma nova página de Web Part. Se você tiver pressionado F5 para depurar seu aplicativo, a página Criar Web Part será invocada por padrão. Caso contrário, clique em Exibir Todo o Conteúdo do Site e em Criar. Clique na opção Página de Web Part e forneça as informações solicitadas sobre a página de Web Part em particular. Por exemplo, forneça um nome e um modelo de layout para a página. Depois de ter inserido essas informações, clique em Criar, e o SharePoint criará a sua página de Web Part.

Agora, você precisa adicionar a Web Part visual que foi criada e implantada no servidor. Para isso, navegue até a página de Web Part e clique em Ações do Site e em Editar Página. Clique na área da Web Part na qual deseja colocar a Web Part visual, clique na guia Inserir e, em seguida, clique na Web Part na guia Inserir.

Quando você faz isso, o SharePoint expõe várias categorias de Web Part nas quais você pode procurar e selecionar uma Web Part a ser adicionada a área da Web Part selecionada na página. Navegue até a categoria Personalizado e, no painel Web Parts, você verá a Web Part visual que foi criada e implantada. Se você tiver acompanhado o código deste artigo, clique na Web Part ProductInfo e no botão Adicionar.

A Web Part será adicionada à área da Web Part na página de Web Part, como mostra a Figura 7. Neste ponto, você pode configurar as opções da Web Part por meio do painel Ferramentas ou pode simplesmente aceitar as opções padrão e clicar em Parar Edição.

Aprofundando-se no desenvolvimento para o SharePoint

Para os desenvolvedores do SharePoint, o Visual Studio 2010 fornece não só um pacote de ferramentas nativas, mas também uma incrível oportunidade para se aprofundar no desenvolvimento para o SharePoint. Eu o encorajo a verificar essas ferramentas. Existem algumas ótimas opções para os desenvolvedores que gostam de ter controle sobre seu código e para aqueles que gostam da experiência de projeto de compilar e implantar ótimas soluções no SharePoint.

Steve Fox é um treinador técnico sênior da equipe de treinamento em plataformas e para desenvolvedores da Microsoft. Ele passa a maior parte de seu tempo trabalhando com os clientes no desenvolvimento para o Office e o SharePoint. Fox já publicou vários livros e artigos e participa regularmente como palestrante em conferências para desenvolvedores em todo o mundo.