Как создать простой элемент управления Custom Container с 2 Div внутри? - PullRequest
Новая
       35

Как создать простой элемент управления Custom Container с 2 Div внутри?

1 голос
/ 18 мая 2009

Я хочу создать собственный контейнерный элемент управления ASP.NET, который позволит мне перетаскивать в него дополнительные элементы управления в конструкторе VS.

Конечный HTML, который я ищу, очень прост .. 

<div id="panel1">
    <div id="panel2">
    </div>
    <div id="panel2">
    </div>
</div>

С возможностью перетаскивания дополнительных элементов управления на панели 2 и 3.

Я уверен, что это очень просто, но я изо всех сил пытаюсь найти примеры, которые помогут.

Любые указатели или идеи приветствуются!

Приветствие Стюарт

Ответы [ 2 ]

2 голосов
/ 19 мая 2009

Я делал такие вещи в прошлом, и да, исходя из моего опыта, в то время не было много доступной документации. Хуже того, в то время некоторые документы были неверными или расплывчатыми!

Итак, чтобы избавить вас от всех головных болей (ой, это уже начинает болеть, когда я просто об этом думаю :-P), вот некоторая информация, которую вам определенно нужно знать.

В основном все элементы управления предназначены только для использования во время выполнения. Вы можете прикрепить ControlDesigner к элементу управления с атрибутом в определении класса, который среда времени разработки (VS.NET IDE) будет загружать и использовать в качестве слоя поверх вашего элемента управления.

Шаблоны

Крис предлагает использовать шаблоны в правильном направлении. Ваш элемент управления должен где-то хранить «содержимое» элементов div, и шаблоны являются идеальным решением. Убедитесь, что вы правильно поняли эту часть. Примечание: свойства шаблона могут вести себя странно, если в них есть предложение set! Кроме того, проверьте использование NotifyParentAttribute.

Если у вас есть шаблоны и вы можете использовать декларативный синтаксис на страницах ASPX для добавления элементов управления, и они хорошо отображаются, тогда вы можете начать работать над конструктором.

Для дизайнера у вас есть 2 варианта; простой и сложный способ.

Простое дизайнерское решение

Давайте начнем с простого пути. Базовые классы ControlDesigner уже предоставляют структуру для отображения шаблонов. Вы, вероятно, уже видели это в действии, как в элементе управления GridView и его полях шаблона.

Ознакомьтесь со следующей статьей MSDN о создании дизайнера элемента управления .

С этим простым решением вы получаете автоматическую реализацию смарт-тега (стрелка справа от элемента управления во время разработки) и можете выбрать шаблон для редактирования из раскрывающегося списка.

Комплексное дизайнерское решение

Теперь, если это вас не устраивает, и вы хотели бы иметь возможность редактировать элементы управления так же, как элементы управления Panel, тогда вам нужно копать глубже. Итак, вот комплексное решение с использованием Control Designer Regions.

См. Пример в примере в классе EditableDesignerRegion .

То, что делает этот пример, переопределяет CreateChildControls класса конструктора. Помните, я говорил, что дизайнерский элемент управления - это слой поверх вашего элемента управления во время выполнения? Таким образом, этот метод CreateChildControls будет запущен после реализации вашего элемента управления. Что вам нужно сделать, так это пометить HTML-элемент в выводе рендера специальным HTML-атрибутом региона дизайнера. Таким образом, дизайнер знает, какая часть в вашем отрендеренном элементе управления должна быть областью.

Теперь вы должны указать IDE назначить редактора или средства просмотра для ваших регионов. Это необходимо сделать в методе GetDesignTimeHtml (Регионы DesignerRegionCollection) (обратите внимание на перегруженную версию этого метода). Как видите, этот метод получает коллекцию регионов. Вы должны назначить редактируемые области просмотра этой коллекции. Здесь важно - и это плохо документированная часть - то, что порядок в этой коллекции очень важен . Значение атрибута region в вашем HTML-коде относится к индексу в этой коллекции.

Итак, теперь мы определили области в нашем отрисованном выводе, назначив для него редактора или средства просмотра. Далее следует, как заполнить эти регионы и сохранить значения из этих регионов в нашей декларации управления.

Эти два действия обрабатываются в методах GetEditableDesignerRegionContent и SetEditableDesignerRegionContent конструктора элемента управления. Здесь вы видите, почему важно назвать регионы, которые вы добавили в коллекцию в методе GetDesignTimeHtml. В этих двух методах вы получаете ссылку на регион и по ее свойству Name вы можете определить, какое свойство Template вашего элемента управления читать / писать.

Для чтения и записи свойств шаблона мы используем магию ControlPersister и ControlParser. Персистер создает экземпляр шаблона из декларативного кода ASP.NET (HTML). Парсер выполняет работу наоборот; создает простой HTML из экземпляра шаблона.

В двух словах

Так что вам решать, подходит ли вам стандартная среда редактирования шаблонов. Если вы хотите иметь необычные возможности редактирования для обеих ваших областей редактирования в вашей IDE, вам придется реализовать сложное решение. В противном случае просто придерживайтесь простой реализации. Упомянутые примеры вам очень помогут.

0 голосов
/ 19 мая 2009

Вот ссылка на статью MSDN, касающуюся того, что вы пытаетесь сделать, к сожалению, нет поддержки конструктора VS, поэтому он корректно отрисовывается с сервера, но не из IDE.

Как: создать шаблонные элементы управления ASP.NET
http://msdn.microsoft.com/en-us/library/36574bf6.aspx

...