- •Лабораторная работа 4. Мастер-страницы и шаблоны web форм. Темы.
- •Создание тем
- •Области действия тем
- •Темы и изображения
- •Установка текущей темы
- •Установка темы для отдельной страницы
- •Установка темы для всего сайта
- •Мастер-страницы
- •Зачем нужны мастер-страницы?
- •Основы Master Pages
- •Содержание по умолчанию
- •Последовательность событий.
- •Задание.
- •Контрольные вопросы.
Области действия тем
По области действия различают темы локальные и темы, определенные глобально. Локальные темы хранятся в папке App_Themes приложения и могут использоваться только в данном приложении. Глобально-определенные темы должны быть расположены в папке %SystemRoot%\Microsoft.NET\Framework\v2.0.xxxxx\ASP.NETClientFiles\Themes. Данные темы может использовать любой сайт, работающий на данной машине. При совпадении названий локальной и глобальной темы к контролам будут применяться настройки из обоих тем, но приоритет будет у свойств локальной темы.
Темы и изображения
В директорию темы вы можете поместить картинки. Изображения в темах особенно полезны для таких контролов, как TreeView и Menu, которые позволяют изменять стандартные изображения, используемые ими при рендеринге.
Все что от вас потребуется при этом - это указать в скине относительный путь к картинке. ASP.NET сам позаботится о приведении этого пути в корректный полный путь. В css-файлах также необходимо указывать относительные для данной темы пути.
Установка текущей темы
Есть два способа указания страницам сайта, какую из имеющихся тем им использовать. От способа указания темы будет зависеть поведение выполняющей среды при работе с темами. Так если для этого будет использован атрибут Theme, то атрибуты из скинов темы будут иметь больший приоритет, чем атрибуты установленные у контролов непосредственно на странице. В случае же использования атрибута StylesheetTheme атрибуты заданные в теге контрола будут иметь больший приоритет при отрисовке контрола, чем атрибуты, полученные из скина.
Примечание: В режиме дизайнера страницы Visual Studio не отображает свойства контролов, заданные в скинах при установленном атрибуте Theme. Однако, если задавать тему через атрибут StyleSheetTheme, то в качестве побочного действия студийный дизайнер начинает их отображать, соответственно можно посмотреть все настройки в действии без компиляции сайта и просмотра его в браузере. Также, к сожалению, студийный редактор не поддерживает IntelliSense в ".skin"-файлах. Единственным способом удобного создания скинов является создание и настройка нужного элемента на странице и последующий перенос текста контрола в ".skin"-файл с удалением лишних атрибутов (таких как ID и EnableViewState).
Установка темы для отдельной страницы
В следующем примере показан способ указания текущей темы с использованием атрибута Theme директивы @Page.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" Theme="Синяя" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Темы</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Calendar ID="Calendar1" runat="server" />
<br /><asp:Label ID="Label1" runat="Server" Text="Theme" />
<br /><asp:Label ID="Label2" ForeColor="Brown" runat="Server" Txt="StyleSheetTheme" />
</div>
</form>
</body>
</html>
После этого, несмотря на то, что никаких настроек внешнего вида контролов на данной странице мы не делали, все контролы будет выглядеть так, как мы это задали в соответствующих файлах скинов текущей темы.
Если в данном примере заменить атрибут Theme на атрибут StylesheetTheme, то первая надпись будет выведена цветом темы, а вторая – коричневым цветом, заданным в теге контрола.