Passo a passo: Criando uma Web Part do SharePoint usando um Designer

Artigo
02/25/2013

Web Parts permite aos usuários modificar diretamente o conteúdo, a aparência, e o comportamento de páginas do site da web do SharePoint usando um navegador.Essa explicação passo a passo mostra como criar visualmente Web parts usando o modelo de projeto do SharePoint Visual Web parts em Visual Studio.

Web parts exibe uma visualização de calendário mensal e uma caixa de seleção para cada lista de calendário no site.Os usuários podem escolher o calendário lista para incluir no modo de calendário mensal selecionando as caixas de seleção.

Essa explicação passo a passo mostra as seguintes tarefas:

Criando Web parts usando Visual Web parts projeta o modelo.
Criando Web parts utilizando o designer do Visual Web Developer no Visual Studio.
Adicionando código para manipular os eventos de controles de Web parts.

Testando Web parts no SharePoint.

Observação
Seu computador pode mostrar diferentes nomes ou localizações para alguns dos elementos de interface do usuário Visual Studio nas instruções a seguir.A edição Visual Studio que você possui e as configurações que você usa determinam esses elementos.Para mais informações, consulte Configurações de Visual Studio.

Pré-requisitos

Para completar este passo-a-passo, são necessários os seguintes componentes:

Edições suportadas do Microsoft Windows e do SharePoint.Para mais informações, consulte Requisitos para o desenvolvimento de soluções do SharePoint.
Visual Studio Professional ou uma edição de gerenciamento (ALM) do ciclo de vida do aplicativo do Visual Studio.

Criando um projeto de Web parts

Primeiro, crie um projeto de Web parts usando o modelo de projeto de Visual Web parts .

Para criar um projeto visual Web parts

Início Visual Studio usando a opção de execução como o administrador .
Em a barra de menu, escolha Arquivo, Novo, Projeto.Se o seu IDE é configurado para usar configurações de desenvolvimento do Visual Basic, na barra de menu, escolha Arquivo, Novo Projeto.

A caixa de diálogo Novo Projeto será exibida.
Em a caixa de diálogo de Novo Projeto , em Visual C# ou Visual Basic, expanda o nó de SharePoint , e então escolha o nó de 2010 .
Em o painel de Modelos instalados do Visual Studio , escolha o modelo de Visual Web parts do SharePoint 2010 , e então escolha o botão OK .

Assistente de personalização do SharePoint Aparece.Usando o assistente, você pode especificar o site que você usará para depurar o projeto e o nível de confiança de solução.
Em a seção de Que é o nível de confiança para esta solução do SharePoint? , escolha o botão de opção de Implantar como uma solução de farm .
Escolha o botão Concluir para aceitar o site da web do SharePoint local padrão.

Criando Web parts

Criar Web parts adicionando controles de Caixa de Ferramentas para a superfície do controle de usuário.

Para criar o layout de Web parts

Em o designer do Visual Web Developer, escolha a guia de Design para alternar para o modo design.
Em a barra de menu, escolha Modo de Visualização, Caixa de Ferramentas.
Em o nó de Padrão de Caixa de Ferramentas, escolha o controle de CheckBoxLIst e então execute uma das seguintes etapas:
- Abra o menu de atalho para o controle de CheckBoxList e escolha Copiar, escolha a primeira linha no designer, abra o menu de atalho para a linha, e então escolha Colar.
- Arraste o controle de CheckBoxList de Caixa de Ferramentas e conectá-lo a primeira linha no designer.
Repita a etapa anterior, mas mover um botão para a próxima linha de designer.
Em o designer, escolha o botão Botão1 .
Em a barra de menu, escolha Modo de Visualização, Janela de propriedades.

a janela de Propriedades abre.
A propriedade de Texto do botão, digite a atualização.

Manipulando os eventos de controles de Web parts

Adicione código que permite que o usuário para adicionar calendários para modo de calendário mestra.

Para manipular eventos de controles de Web parts

Execute um dos seguintes conjuntos de etapas:
- Em o designer, clique duas vezes no botão Atualizar .
- Em a janela de Propriedades para o botão Atualizar , escolha o botão Eventos .A propriedade de Clicar , entre em Button1_Click, e escolha a tecla ENTER.
O arquivo de código de controle de usuário abre no editor de códigos e o manipulador de eventos de Button1_Click aparece.Posteriormente, você adicionará código para o manipulador de eventos.

Adicione as instruções a seguir à parte superior do arquivo de código de controle de usuário.

Imports Microsoft.SharePoint
Imports Microsoft.SharePoint.WebControls

using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;

Adicione a seguinte linha de código para a classe de VisualWebPart1 .Esse código declara um controle de calendário mensal de exibição.
```
Private MonthlyCalendarView1 As MonthlyCalendarView
```
```
private MonthlyCalendarView MonthlyCalendarView1;
```

Substituir o método de Page_Load da classe de VisualWebPart1 com o código a seguir.Esse código executa as seguintes tarefas:

Adiciona um modo de exibição de calendário mensal ao controle de usuário.
Adiciona uma caixa de seleção para cada lista de calendário no site.
Especifica um modelo para cada tipo de item que aparece no modo de calendário.

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    MonthlyCalendarView1 = New MonthlyCalendarView()
    Me.Controls.Add(MonthlyCalendarView1)
    Dim items As New SPCalendarItemCollection()
    Dim thisWeb As SPWeb = SPControl.GetContextWeb(Context)

    If CheckBoxList1.Items.Count = 0 Then
        Dim listItem As SPList
        For Each listItem In thisWeb.Lists
            If listItem.BaseTemplate = SPListTemplateType.Events Then
                CheckBoxList1.Items.Add(New ListItem(listItem.Title))
            End If
        Next listItem
    End If
    MonthlyCalendarView1.ItemTemplateName = "CalendarViewMonthItemTemplate"
    MonthlyCalendarView1.ItemAllDayTemplateName = "CalendarViewMonthItemAllDayTemplate"
    MonthlyCalendarView1.ItemMultiDayTemplateName = "CalendarViewMonthItemMultiDayTemplate"
End Sub

protected void Page_Load(object sender, EventArgs e)
{
    MonthlyCalendarView1 = new MonthlyCalendarView();
    this.Controls.Add(MonthlyCalendarView1);
    SPCalendarItemCollection items = new SPCalendarItemCollection();
    SPWeb thisWeb = SPControl.GetContextWeb(Context);

    if (CheckBoxList1.Items.Count == 0)
    {
        foreach (SPList listItem in thisWeb.Lists)
        {
            if (listItem.BaseTemplate == SPListTemplateType.Events)
            {
                CheckBoxList1.Items.Add(new ListItem(listItem.Title));
            }
        }
    }
    MonthlyCalendarView1.ItemTemplateName =
        "CalendarViewMonthItemTemplate";
    MonthlyCalendarView1.ItemAllDayTemplateName =
        "CalendarViewMonthItemAllDayTemplate";
    MonthlyCalendarView1.ItemMultiDayTemplateName =
        "CalendarViewMonthItemMultiDayTemplate";
}

Substituir o método de Button1_Click da classe de VisualWebPart1 com o código a seguir.Este código adiciona itens de cada calendário selecionado para modo de calendário mestra.

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
    Dim items As New SPCalendarItemCollection()
    Dim thisWeb As SPWeb = SPControl.GetContextWeb(Context)

    Dim item As ListItem
    For Each item In CheckBoxList1.Items
        If item.Selected = True Then
            Dim calendarList As SPList = thisWeb.Lists(item.Text)
            Dim dtStart As DateTime = DateTime.Now.AddDays(-7)
            Dim dtEnd As DateTime = dtStart.AddMonths(1).AddDays(7)
            Dim query As New SPQuery()
            query.Query = [String].Format("<Query>" + "<Where><And>" + _
                                          "<Geq><FieldRef Name=""{0}"" />" + _
                                          "<Value Type=""DateTime"">{1}</Value></Geq>" + _
                                          "<Leq><FieldRef Name=""{0}"" />" + _
                                          "<Value Type=""DateTime"">{2}</Value></Leq>" + _
                                          "</And></Where><OrderBy><FieldRef Name=""{0}"" /></OrderBy>" + _
                                          "</Query>", "Start Time", dtStart.ToShortDateString(), dtEnd.ToShortDateString())

            Dim listItem As SPListItem
            For Each listItem In calendarList.GetItems(query)
                Dim calItem As New SPCalendarItem()
                With calItem
                    .ItemID = listItem("ID").ToString()
                    .Title = listItem("Title").ToString()
                    .CalendarType = Convert.ToInt32(SPCalendarType.Gregorian)
                    .StartDate = CType(listItem("Start Time"), DateTime)
                    .ItemID = listItem.ID.ToString()
                    .WorkSpaceLink = [String].Format("/Lists/{0}/DispForm.aspx", calendarList.Title)
                    .DisplayFormUrl = [String].Format("/Lists/{0}/DispForm.aspx", calendarList.Title)
                    .EndDate = CType(listItem("End Time"), DateTime)
                    .Description = listItem("Description").ToString()
                End With

                If Not (listItem("Location") Is Nothing) Then
                    calItem.Location = listItem("Location").ToString()
                End If
                items.Add(calItem)
            Next listItem
            MonthlyCalendarView1.DataSource = items
        End If
    Next item

End Sub

protected void Button1_Click(object sender, EventArgs e)
{
    SPCalendarItemCollection items = new SPCalendarItemCollection();
    SPWeb thisWeb = SPControl.GetContextWeb(Context);

    foreach (ListItem item in CheckBoxList1.Items)
    {
        if (item.Selected == true)
        {
            SPList calendarList = thisWeb.Lists[item.Text];
            DateTime dtStart = DateTime.Now.AddDays(-7);
            DateTime dtEnd = dtStart.AddMonths(1).AddDays(7);
            SPQuery query = new SPQuery();
            query.Query = String.Format(
                "<Query>" +
                "<Where><And>" +
                "<Geq><FieldRef Name=\"{0}\" />" +
                "<Value Type=\"DateTime\">{1}</Value></Geq>" +
                "<Leq><FieldRef Name=\"{0}\" />" +
                "<Value Type=\"DateTime\">{2}</Value></Leq>" +
                "</And></Where><OrderBy><FieldRef Name=\"{0}\" /></OrderBy>" +
                "</Query>",
                "Start Time",
                dtStart.ToShortDateString(),
                dtEnd.ToShortDateString());

            foreach (SPListItem listItem in calendarList.GetItems(query))
            {
                SPCalendarItem calItem = new SPCalendarItem();
                calItem.ItemID = listItem["ID"].ToString();
                calItem.Title = listItem["Title"].ToString();
                calItem.CalendarType = Convert.ToInt32(SPCalendarType.Gregorian);
                calItem.StartDate = (DateTime)listItem["Start Time"];
                calItem.ItemID = listItem.ID.ToString();
                calItem.WorkSpaceLink = String.Format(
                    "/Lists/{0}/DispForm.aspx", calendarList.Title);
                calItem.DisplayFormUrl = String.Format(
                    "/Lists/{0}/DispForm.aspx", calendarList.Title);
                calItem.EndDate = (DateTime)listItem["End Time"];
                calItem.Description = listItem["Description"].ToString();
                if (listItem["Location"] != null)
                {
                    calItem.Location = listItem["Location"].ToString();
                }
                items.Add(calItem);
            }
            MonthlyCalendarView1.DataSource = items;
        }

    }

}

Testando Web parts

Quando você executar o projeto, abra o site da web do SharePoint.Web parts é adicionado automaticamente à galeria de Web parts no SharePoint.Para testar o projeto, você executará as seguintes tarefas:

Adicionar um evento a cada uma das duas listas separadas do calendário.
Adicione Web parts a uma Página de Web Parts.
Especificar listas para incluir no modo de calendário mensal.

Para adicionar eventos a lista de calendário no site

Em o Visual Studio, escolha a tecla F5.

O site da web do SharePoint abre, e a barra rápida de lançamento de Microsoft SharePoint Foundation 2010 aparece na página.
Em a barra rápida de inicialização, em listas, escolha o link de Calendário .

A página de Calendário aparece.
Escolha a guia de Eventos , e então escolha novo evento em fita.
Em a caixa de Título , insira o evento no calendário padrão, e então escolha o botão Salvar .
Em o menu de Localize ações , escolha o comando de mais opções .
Em a página de Criar , escolha o tipo de Calendário , nomeie o calendário, e então escolha o botão Criar .

A página de calendário personalizado aparece.
Adicionar um evento ao calendário personalizado, nomeie o evento do evento personalizado no calendário, e então escolha o botão Salvar .

Para adicionar Web parts a uma Página de Web Parts

Em o menu de Localize ações , escolha o comando de mais opções .
Em a página de Criar , escolha o tipo de Página de Web Parts , e então escolha o botão Criar .
Em a página de Nova Página de Web Parts , nomeie a página SampleWebPartPage.aspx, e então escolha o botão Criar .

A página da Web parts aparece.
Escolha qualquer zona na página da Web parts.
Em a parte superior da página, escolha a guia de Inserir , e então escolha o botão Web parts .
Escolha a pasta de Personalizar , escolha VisualWebPart1 Web parts, e então escolha o botão Adicionar .

Web parts aparece na página.Os seguintes controles aparecem na Web parts:
- Uma visualização de calendário mensal.
- Um botão Atualizar .
- Uma caixa de seleção de Calendário .
- Uma caixa de seleção de calendário personalizado .

Para especificar listas para incluir no modo de calendário mensal

Em a Web parts, especifique os calendários que você deseja incluir no modo de calendário mensal, e então escolha o botão Atualizar .

Os eventos de todos os calendários que você especificou aparecem no modo de calendário mensal.

Consulte também

Tarefas

Como: criar uma parte da Web do SharePoint

Como: criar uma parte da Web do SharePoint, usando um Designer.

Passo a passo: Criando uma Web Part do SharePoint

Outros recursos

Criação de Web Parts para o SharePoint

Compartilhar via