Návod: Vytvoření webové části pro službu SharePoint pomocí návrháře

Článek
06/14/2015

Pokud vytváříte webové částí webu pro službu SharePoint, uživatelé mohou přímo upravit obsah, vzhled a chování stránky na tomto webu pomocí prohlížeče.Tento návod ukazuje, jak vizuálně vytvářet webové části služby SharePoint pomocí šablony projektu Visual Web Part v Visual Studio.

Webová část, kterou vytvoříte, zobrazí zobrazení měsíčního kalendáře a zaškrtávací políčko pro každý seznam kalendáře na webu.Uživatelé mohou zadat, které kalendáře budou zahrnuty v měsíčním zobrazení kalendáře zaškrtnutím políček.

Tento návod ilustruje následující úkoly:

Vytvoření webové části pomocí šablony projektu Visual Web Part.
Návrh webové části pomocí návrháře aplikace Visual Web Developer v aplikaci Visual Studio.
Přidávání kódu pro zpracování událostí ovládacích prvků ve webové části.
Testování webové části služby SharePoint.

[!POZNÁMKA]

Váš počítač může zobrazit jiné názvy nebo umístění pro některé prvky uživatelského rozhraní sady Visual Studio v následujících pokynech.Tyto prvky jsou určeny verzí aplikace Visual Studio a použitým nastavením.Viz téma Přizpůsobení nastavení pro vývoj v sadě Visual Studio.

Požadavky

Chcete-li dokončit tento návod, potřebujete následující komponenty:

Podporované edice systému Windows a SharePoint.Viz téma Požadavky na vývoj řešení služby SharePoint.
Visual Studio Professional nebo vyšší.

Vytvoření projektu webové části

Nejprve vytvořte projekt webové části pomocí šablony projektu Visual Web Part.

Vytvoření projektu vizuální webové části

Spusťte Visual Studio pomocí možnosti Spustit jako správce.
Na panelu nabídky vyberte možnosti Soubor, Nový, Projekt.

Zobrazí se dialogové okno Nový projekt.
V dialogovém okně Nový projekt v nabídce Visual C# nebo Visual Basic rozbalte možnost Office/SharePoint a zvolte kategorii Řešení SharePoint.
V seznamu šablon vyberte šablonu SharePoint 2013 - Visual Web Part a klikněte na tlačítko OK.

Zobrazí se Průvodce přizpůsobením SharePoint.Pomocí tohoto průvodce můžete vybrat web, který budete používat k ladění projektu a úroveň důvěryhodnosti řešení.
V části Jaká je úroveň důvěryhodnosti pro toto řešení SharePoint? vyberte možnost Nasadit jako řešení farmy.
Zvolte tlačítko Dokončit k přijetí výchozího místního webu služby SharePoint.

Návrh webové části

Návrh webové části přidáním ovládacích prvků ze Sady nástrojů na povrch návrháře aplikace Visual Web Developer.

Návrh rozložení stránky webové části

V návrháři aplikace Visual Web Developer klikněte na kartu Návrh a přejděte tak na zobrazení návrhu.
Na panelu nabídek zvolte možnost Zobrazení > Souprava nástrojů.
V uzlu Standardní v nabídce Panel nástrojů zvolte ovládací prvek CheckBoxList a proveďte jeden z následujících kroků:
- Otevřete místní nabídku ovládacího prvku CheckBoxList, klikněte na tlačítko Kopírovat, v návrháři otevřete místní nabídku pro první řádek a klikněte na tlačítko Vložit.
- Přetáhněte ovládací prvek CheckBoxList ze Sady nástrojůa připojte ho k prvnímu řádku v návrháři.
Opakujte předchozí krok, ale přesuňte Tlačítko na další řádek v návrháři.
V návrháři klikněte na tlačítko Button1.
V panelu nabídky zvolte Zobrazení, Okno vlastností.

Otevře se okno Vlastnosti.
Ve vlastnosti Text tlačítka zadejte údaj Aktualizace.

Zpracování událostí ovládacích prvků ve webové části

Přidejte kód, který umožňuje uživateli přidávat kalendáře do zobrazení hlavního kalendáře.

Zpracování událostí ovládacích prvků na webové části

Proveďte jednu z následujících sad kroků:
- V návrháři dvakrát klikněte na tlačítko Aktualizovat.
- V okně Vlastnosti tlačítka Aktualizace klikněte na tlačítko Události.U vlastnosti Kliknutí zadejte hodnotu Button1_Click a stiskněte klávesu Enter.
V editoru kódu se otevře soubor kódu uživatelského řízení a zobrazí se ovladač událostí Button1_Click.Později přidáte kód pro tuto obslužnou rutinu události.

Na začátek souboru kódu uživatelského ovládacího prvku přidejte následující příkazy.

Imports Microsoft.SharePoint
Imports Microsoft.SharePoint.WebControls
Imports System.Web.UI.WebControls

using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using System.Web.UI.WebControls;

Přidejte následující řádek kódu do třídy VisualWebPart1.Tento kód deklaruje ovládací prvky měsíčního zobrazení kalendáře.
```
Private MonthlyCalendarView1 As MonthlyCalendarView
```
```
private MonthlyCalendarView MonthlyCalendarView1;
```

Nahraďte metodu Page_Load třídy VisualWebPart1 následujícím kódem.Tento kód provede následující úlohy:

Přidá měsíční zobrazení kalendáře do uživatelského ovládacího prvku.
Přidá zaškrtávací políčko pro každý seznam kalendáře na webu.
Určuje šablonu pro každý typ položky, který je uveden v zobrazení Kalendář.

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";
}

Nahraďte metodu Button1_Click třídy VisualWebPart1 následujícím kódem.Tento kód přidá položky z každého vybraného kalendáře pro zobrazení hlavního kalendáře.

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;
        }

    }

}

Testování webové části

Při spuštění projektu se otevře web SharePoint.Webová část je automaticky přidána do Galerie webových částí služby SharePoint.Chcete-li testovat tento projekt, budete provádět následující úkoly:

Přidejte událost do každého ze dvou samostatných seznamů kalendáře.
Přidejte webovou část na stránku webových částí.
Určete seznamy, které chcete zahrnout do zobrazení měsíčního kalendáře.

Přidání události do seznamů kalendáře na webu

V aplikaci Visual Studio stiskněte klávesu F5.

Otevře se web služby SharePoint a panel Snadné spuštění Microsoft SharePoint Foundation 2010 se zobrazí na stránce.
Na panelu Snadné spuštění v nabídce Seznamy klikněte na odkaz Kalendář.

Zobrazí se stránka Kalendář.

Pokud není žádný odkaz kalendář zobrazen na panelu Snadné spuštění, vyberte odkaz Obsah webu.Pokud stránka obsahu webu nezobrazí položku Kalendář, vytvořte ji.
Na stránce Kalendář zvolte den a kliknutím na odkaz Přidat u vybraného dne přidejte událost.
V poli Název zadejte pro výchozí kalendář Událost a klikněte na tlačítko Uložit.
Zvolte odkaz Obsah webu a potom zvolte název Přidat aplikaci.
Na stránce Vytvořit zvolte typ Kalendář, zadejte název kalendáře a klikněte na tlačítko Vytvořit.
Přidejte událost do nového kalendáře, pojmenujte událost jako Událost ve vlastním kalendáři a pak použijte tlačítko Uložit.

Chcete-li přidat webové části na stránku webových částí

Na stránce Obsah webu otevřete složku Stránky na webu.
Na pásu karet klikněte na kartu Soubory, otevřete nabídku Nový dokument a vyberte příkaz Stránka webové části.
Na stránce Nová stránka webových částí pojmenujte stránku jako SampleWebPartPage.aspx a klikněte na tlačítko Vytvořit.

Zobrazí se stránka webové části.
V horní oblasti stránky webové části zvolte kartu Vložit a klikněte na tlačítko Webová část.
Zvolte složku Custom, webovou část VisualWebPart1 a potom vyberte tlačítko Přidat.

Webová část se zobrazí na stránce.Následující ovládací prvky se zobrazí ve webové části:
- Měsíční zobrazení kalendáře.
- Tlačítko Aktualizace.
- Políčko Kalendář.
- Zaškrtávací políčko Vlastní kalendář.

Určení seznamů pro zahrnutí do zobrazení měsíčního kalendáře

Ve webové části zadejte kalendáře, které chcete zahrnout do zobrazení měsíčního kalendáře a klikněte na tlačítko Aktualizace.

Události ze všech kalendářů, které jste vybrali, se zobrazí v zobrazení měsíčního kalendáře.

Viz také

Úkoly

Postupy: Vytvoření webové části služby SharePoint

Postupy: Vytvoření webové části služby SharePoint pomocí návrháře

Návod: Vytvoření webové části pro službu SharePoint

Další zdroje

Vytváření webových částí pro službu SharePoint

Sdílet prostřednictvím