Пример конструктора элементов управления со списками действий и службами
Обновлен: Ноябрь 2007
В данном разделе описывается использование конструкторов элементов управления ASP.NET со службами и списками действий, обеспечивающими пользовательский интерфейс времени разработки для пользовательских серверных элементов управления.
Код, описываемый в следующих подразделах, демонстрирует, как создавать и использовать конструкторы элементов управления ASP.NET для пользовательских серверных элементов управления. В частности, в данном разделе (включая раздел с исходным кодом, указанный ниже), рассматриваются следующие функции и задачи, возникающие при работе с конструкторами:
Создание конструкторов, использующих службы среды разработки и списки действий.
Связывание конструктора с пользовательским элементом управления.
Компиляция элементов управления и связанных с ними конструкторов в одну сборку.
Обращение к элементам управления на веб-странице.
Работа с конструкторами элементов управления в представлении «Конструктор» Visual Studio 2005.
В данном разделе код конструкторов представлен на двух языках — Visual Basic и C#. В примере показаны конструкторы пользовательских элементов управления, использующие службы среды разработки и списки действий. Код примера приведен в разделе Практическое руководство. Использование служб и списков действий с конструкторами элементов управления. В примере имеются четыре пользовательских элемента управления, все они просты и созданы только для того, чтобы проиллюстрировать использование конструкторов. Три из них являются производными от класса Panel, а четвертый — это пользовательский элемент управления Button. Каждый из элементов управления панели в исходном коде также имеет соответствующий конструктор пользовательского элемента управления. Эти конструкторы используют службы, что позволяет элементу управления взаимодействовать со средой разработки, например Visual Studio 2005. В визуальной среде разработки (в Visual Studio 2005 — в режиме конструктора) эти конструкторы предоставляют код, который позволяет создавать меню времени разработки, решающим различные задачи по настройке элементов управления.
Компиляция примера
Примеры Visual Basic и C# имеют одинаковую функциональность, поэтому можно выбрать тот, который использует наиболее предпочтительный язык программирования.
Скомпилируйте пример на выбранном языке как библиотеку и поместите полученную сборку в каталог Bin веб-приложения.
Компиляция примера из командной строки:
vbc /r:System.dll /r:System.Design.dll /r:System.Drawing.dll /debug+ /r:System.Web.dll /t:library /out:DesignerServicesAndListsVB.dll DesignerServicesAndLists.vb
csc /r:System.dll /r:System.Design.dll /r:System.Drawing.dll /debug+ /r:System.Web.dll /t:library /out: DesignerServicesAndListsCS.dll DesignerServicesAndLists.cs
После компиляции примера не забудьте скопировать полученный файл DesignerServicesAndListsVB.dll или DesignerServicesAndListsCS.dll в папку Bin веб-узла.
Требуемые XML-файлы
Кроме сборки, содержащей элементы управления и конструкторы, пример использует три XML-файла. Эти XML файлы содержат информацию о базовом стиле; с их помощью демонстрируется, как конструкторы могут использовать службы, предоставляемые средой разработки. В этом случае конструктор динамически загружает данные стиля из XML-файлов во время разработки и использует эти данные для изменения внешнего вида элементов управления в рабочей области конструирования. Этот пример демонстрирует использование служб среды разработки, и не имеет целью дать рекомендации по реализации определений стилей.
XML-файлы примера находятся в той же папке, что и веб-страницы, на которой будут размещаться элементы управления ASP.NET. Содержимое файлов RedStyle.xml, BlueStyle.xml и GreenStyle.xml показано ниже:
RedStyle.xml
<?xml version="1.0" encoding="utf-8" ?>
<styles>
<style name="BackColor" value="red"></style>
<style name="ForeColor" value="white"></style>
</styles>
BlueStyle.xml
<?xml version="1.0" encoding="utf-8" ?>
<styles>
<style name="BackColor" value="blue"></style>
<style name="ForeColor" value="white"></style>
</styles>
GreenStyle.xml
<?xml version="1.0" encoding="utf-8" ?>
<styles>
<style name="BackColor" value="green"></style>
<style name="ForeColor" value="white"></style>
</styles>
Использование примеров элементов управления и конструкторов на странице ASP.NET
Для работы с примерами элементов управления и конструкторами необходимо разместить элементы управления на веб-странице ASP.NET, воспользовавшись, например, конструктором Visual Studio 2005. В Visual Studio 2005 необходимо добавить одну страницу ASP.NET к веб-узлу. Сначала создайте новую веб-страницу. Затем в представлении «Исходный код» удалите содержимое страницы по умолчанию и добавьте директивы Page и Register, как показано в следующем фрагменте:
<%@ page language="VB" %>
<%@ register tagprefix="aspSample"
assembly="DesignerServicesAndListsVB"
namespace="Samples.AspNet.VB.Controls" %>
<%@ page language="C#" %>
<%@ register tagprefix="aspSample"
assembly="DesignerServicesAndListsCS"
namespace="Samples.AspNet.CS.Controls" %>
.gif "Примечание") Примечание. |
|---|
Единственное отличие между директивами для Visual Basic и C# — это атрибут языка в директиве Page и расширение имени сборки в директиве Register. |
Также скопируйте следующий код разметки после директивы Register. (Этот код одинаков для Visual Basic и C#.)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Designer Samples</title>
</head>
<body>
<form id="form1" runat="server">
<p style="font-family:tahoma;font-size:larger;
font-weight:bold">
Using Action Lists and Designer Host Services</p>
<div style="font-family:tahoma;font-size:x-small">
<span style="font-size: 10pt">Control #1 (ControlWithStyleTasksDesigner):
PanelContainerDesigner using a DesignerActionList, which
obtains a list of XML files in the project and sets
the style using the XML element
definitions.</span><p />
</div>
<aspSample:ControlWithStyleTasks id="ctl1"
runat="server"
backcolor="Red" forecolor="White">
Hello there.</aspSample:ControlWithStyleTasks>
<br />
<div style="font-family:tahoma;font-size:x-small">
<span style="font-size: 10pt">Control #2 (ControlWithConfigurationSettingDesigner):
PanelContainerDesigner using configuration settings
to obtain
the FrameCaption value.</span><p />
</div>
<aspSample:ControlWithConfigurationSetting
id="ctl2" runat="server">
Hello There
</aspSample:ControlWithConfigurationSetting>
<br />
<div style="font-family:tahoma;font-size:x-small">
<span style="font-size: 10pt">Control #3 (ControlWithButtonTasksDesigner):
PanelContainerDesigner using a smart-task action
item to insert a new button on the Web Forms page.</span><p />
</div>
<aspSample:ControlWithButtonTasks
id="ctl3" runat="server">
Hello There
</aspSample:ControlWithButtonTasks>
</form>
</body>
</html>
Параметры конфигурации для примера
Один из конструкторов в этом примере использует запись файла конфигурации для динамического отображения заголовка в представлении «Конструктор» на одном из пользовательских элементов управления. Откройте файл Web.config веб-узла или создайте его, если он не существует, и добавьте следующий раздел в элемент <appSettings>:
<appSettings>
<add key="ContainerControlTitle" value="Title from Config File"/>
</appSettings>
Проверка конструкторов элементов управления в Visual Studio 2005
После добавления скомпилированной сборки (DLL-файл) в папку Bin веб-узла, добавления XML-файлов, страницы с пользовательскими элементами управления на ней и создания записи в файле Web.config, можно приступать к работе с элементами управления в конструкторе. Откройте страницу в представлении конструктора в Visual Studio 2005. Обратите внимание, что на странице расположены три элемента управления панели. Если щелкнуть элемент управления, будет выделена область редактирования.
Проверка служб конструктора и списков действий
Чтобы проверить конструктор первого элемента управления, установите указатель мыши на правый верхний угол элемента управления и затем щелкните список действий. На следующем снимке экрана показан элемент управления с открытым списком действий.
Элемент управления со списком действий
.gif "Конструктор VS для элемента управления PanelContainer")
В текстовое поле Configure Xml в списке действий можно выбрать один из созданных ранее XML-файлов. Выбор одного из XML-файлов приведет к обновлению стиля времени разработки элемента управления данными стиля из XML-файла. Попробуйте использовать имена других XML-файлов.
При нажатии кнопки списка действий для третьего элемента управления отображается список действий, как показано на следующем снимке экрана.
Список действий третьего элемента управления
.gif "Конструктор VS с настраиваемыми задачами для добавления кнопок")
Команда Add a Button добавляет элемент управления Button в представление времени разработки. Команда Add a custom button добавляет экземпляр пользовательского элемента управления кнопки на страницу.
Проверка служб конструктора и редактируемых областей
Второй элемент управления отображает надпись Title Added From Config. Конструктор элемента управления использует службы конструктора среды для извлечения этого параметра из файла Web.config и добавления его в представление режима разработки.
Этот элемент управления также представляет область редактирования в элементе управления. Щелкните область редактирования для ввода нового содержимого. Содержимое сохраняется в исходном коде страницы.