Создание настраиваемой веб части на SharePoint

Так уж получилось, что я начал изучение SharePoint...

В первой статье, посвящённой SharePoint я буду разбираться, как сделать информер с прогнозом погоды, позволяющий производить некоторую настройку из визуального интерфейса. Информер должен уметь следующее: выводить прогноз погоды для одного или нескольках городов, при наличии нескольких городов менять вывод на горизонтальный или вертикальный, переключаться на русский или английский языки.

Для начала, нужно определиться с информером, я взял информер прогноза погоды с сайта яндекса. Мне понравился информер 150x150, выглядит он следующим образом:

Виджет погоды

Яндекс даёт даёт код для данного информера:



Но можно заметить, что его можно немного очистить, без ущерба функционалу:



Теперь можно создавать проект в SharePoint. Я использую SharePoint 2013, но всё написанное ниже будет работать и на 2010 версии (покрайней мере без длительных танцов с бубном)

Я создал пустой проект, с названием «Weather», затем добавил добавил в проект Visual Web Part с названием «WeatherWP», именно эта вебчасть будет отвечать за вывод информера.

Заходим в файл WeatherWP.ascx, здесь нужно добавить область, в которой будет выводится информер, для этого в самом конце нужно вставить следующий код:

<div id="Main" runat="server">
</div>

Должно получиться следующее:

Код страницы Web Part в SharePoint

Теперь заходим в файл «WeatherWP.ascx.cs» и пишем следующий код:

using System;
using System.ComponentModel;
using System.Web.UI.WebControls.WebParts;

namespace Weather.WeatherWP
{
    [ToolboxItemAttribute(false)]
    public partial class WeatherWP : WebPart
    {
        //widget's code
        private const string HtmlWeather = "";
        //Error message
        private string _error = "Can not load widget";

        public enum eLanguage { ru, en }
        private static eLanguage _language = eLanguage.en;

        public enum ePosition { veltival, horisontal }
        private static ePosition _position = ePosition.horisontal;

        private static string _citys = "minsk";

        [Category("Advanced Settings")]
        [WebBrowsable(true)]
        [WebDisplayName("Displayed city through \";\"")]
        [WebDescription("Displayed city through \";\"")]
        [Personalizable(PersonalizationScope.Shared)]
        public string Citys
        {
            get { return _citys; }
            set { _citys = value; }
        }

        [Category("Advanced Settings")]
        [WebBrowsable(true)]
        [WebDisplayName("Language")]
        [WebDescription("Language")]
        [Personalizable(PersonalizationScope.Shared)]
        public eLanguage Language
        {
            get { return _language; }
            set { _language = value; }
        }

        [Category("Advanced Settings")]
        [WebBrowsable(true)]
        [WebDisplayName("Position")]
        [WebDescription("Position for mouse")]
        [Personalizable(PersonalizationScope.Shared)]
        public ePosition Position
        {
            get { return _position; }
            set { _position = value; }
        }

        public WeatherWP()
        {
        }

        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            InitializeControl();
        }

        protected void Page_Load(object sender, EventArgs e)
        {
            try
            {
                string html = "";
                string[] citysArray = Citys.Split(';');
                for (int i = 0; i < citysArray.Length; i++)
                {
                    var city = citysArray[i].Trim();
                    var widget = string.Format(HtmlWeather, city, _language);
                    html += _position == ePosition.horisontal ? widget : "

" + widget + "

"; } Main.InnerHtml = html; } catch (Exception) { Main.InnerHtml = _error; } } } }

Разбор полётов:

HtmlWeather – содержит код информера, вместо {0} будет подставлен трубуемый город, а вместо {1} – трубуемый язык.

_error – данное сообщение увидит пользователь, если возникнет ошибка при отображении информера.

_language, _position – язык отображения информера и позиция(вертикалькая, горизонтальная)

_citys – содержит список городов для отображения, города должны быть разделены знаком «;»

Для того, чтобы в настройках веб части появилась вкладка с настройками, нужно сделать следующее: (на примера выбора языка)

[Category("Advanced Settings")] - Задаёт название вкладки, в которой будет отображаться настройка

[WebBrowsable(true)] - Показывает, что данное свойство нужно отображать в PropertyGridEditorPart

[WebDisplayName("Language")] - Название свойства на вкладке с параметрами

[WebDescription("Language")] - Описание.(отображается подсказкой, при наведении мыши)

[Personalizable(PersonalizationScope.Shared)] - указывает на область персонализации.(в данном примере для всех пользователей)

public eLanguage Language - Свойство, для чтения и записи языка информера

{

get { return _language; }

set { _language = value; }

}

В итоге получается следующее:

Результат добавления виджета погоды в SharePoint

Результат добавления виджета погоды в SharePoint

По ссылке можно скачать данный проект целиком: SharePoint Web Part

Комментарии (1) -

Александр 13.02.2015 13:30:24

Я скачал данный проект целиком. Но что именно нужно заносить в коллекцию веб-частей?

Добавить комментарий