DataTemplate

@dioxidin · Регистрация: 21.11.2007

Студворк — интернет-сервис помощи студентам

Решил все-таки вывести на всеобщее обозрение мое с Костэн'ом обсуждение на тему "DataTemplate". Заранее извиняюсь перед ним, но это, на мой взгляд, необходимо, т.к. данная инфа полезной будет не только для него.

Сообщение от Костэн

...
что я делаю не правильно, когда хочу изменить цвет текста из шаблона ?

XML
1
2
3
4
5
6
7
8
9
10
11
12
13
<Grid x:Name="LayoutRoot" Background="White">
<my:TreeView Width="200" Height="300" BorderBrush="Black" BorderThickness="1">
<my:TreeViewItem Header="DDDD">
<my:TreeViewItem.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Foreground="White" />
</StackPanel>
</DataTemplate>
</my:TreeViewItem.ItemTemplate>
</my:TreeViewItem>
</my:TreeView>
</Grid>

Когда я смотрю на строку <TextBlock Foreground="White" />, я предполагаю что она заменяет свойство Foreground в <my:TreeViewItem Foreground="White" />, правильно ? Вы сказали, что в предоставленном мною коде нехватает привязки свойства Text к данным элемента списка т.е. это изъятие текста "из вне". Скажите почему нет никакого эфекта, когда я явно указываю текст в <TextBlock Foreground="White" Text="ASD" /> ?

Начну с того, что ссылок на русскоязычные источники не дам - сам пользуюсь в основном аглицкими.
Теперь собственно по теме... Что такое DataTemplate? Как следует из названия - это шаблон. Предназначен он для отображения в том или ином виде данных содержащихся в коллекции ListBox'ов (и прочих похожих контролов). Каждый элемент в коллекции должен быть экземпляром класса с некими публичными свойствами (к ним привязываются контролы внутри шаблона).
Что происходит при присвоении шаблона ListBox'у? Создаются контролы на основе присвоенного шаблона, в качестве контекстов данных (DataContext) которых берутся элементы данных из коллекции. То есть в ListBox'е отображаются не сами данные, а лишь их "представления" (ознакомьтесь в MSDN с понятием M-V-VM сценарий - Model-View-ViewModel, Модель-Вид-МодельВида). Таким образом, если мы в шаблоне пишем так:

XML
1
2
3
4
5
<DataTemplate>
<StackPanel>
<TextBlock Foreground="White" Text="ASD" />
</StackPanel>
</DataTemplate>

То вместо своих данных мы должны увидеть список одних и тех же слов "ASD" в ListBox'e. А вот если напишем вот так:

XML
1
2
3
4
5
<DataTemplate>
<StackPanel>
<TextBlock Foreground="White" Text="{TemplateBinding [какое-то-публичное-свойство-элемента-коллекции]}" />
</StackPanel>
</DataTemplate>

То должны получить список строк получаемых подстановкой вида: [какое-то-публичное-свойство-элемента-коллекции].ToString() (имейте в виду, что квадратные скобки введены для ограничения названия и НЕ ЯВЛЯЮТСЯ ЧАСТЬЮ СИНТАКСИСА; в имени свойства их НЕ ДОЛЖНО быть).
Привязка лишь связывает свойства визуального элемента с источником данных. В фоне приложения крутится поток, в котором производится копирование данных источника во все приемники (в случае двусторонней привязки делает и обратную процедуру).

@dioxidin · 09.07.2010, 11:22 **[ТС]**

АААА Все понятно.. В Silverlight оказывается его нет...
Ничего страшного - реализуем это с помощью обычных. Дай время.. а сам покумекай над концепцией:
1) Пусть есть у тебя Data-класс, у которого имеется свойство, возвращающее коллекцию экземпляров этого же класса (такая вот заготовка "дерева")
2) Делаешь шаблон для этого класса, у которого есть ListBox или ListView для указанной выше коллекции. В качестве ItemTemplate этого (шаблонного) листа указываешь тот же шаблон твоего иерархического Data-класса
3) Пусть в интерфейсе страницы есть корневой List... , в котором нужно отобразить все дерево. Добавляешь корень своего дерева (экземпляр Data-класса) в итемы корневого листа на интерфейсе и указываешь его шаблон (ItemTemplate).

В итоге рекурсивно созданный шаблон будет применен к корню дерева и далее вниз ко всем вложенным элементам..

@Костэн · 11.07.2010, 11:16

Сообщение от dioxidin

АААА Все понятно.. В Silverlight оказывается его нет...
Ничего страшного - реализуем это с помощью обычных. Дай время.. а сам покумекай над концепцией:
1) Пусть есть у тебя Data-класс, у которого имеется свойство, возвращающее коллекцию экземпляров этого же класса (такая вот заготовка "дерева")
2) Делаешь шаблон для этого класса, у которого есть ListBox или ListView для указанной выше коллекции. В качестве ItemTemplate этого (шаблонного) листа указываешь тот же шаблон твоего иерархического Data-класса
3) Пусть в интерфейсе страницы есть корневой List... , в котором нужно отобразить все дерево. Добавляешь корень своего дерева (экземпляр Data-класса) в итемы корневого листа на интерфейсе и указываешь его шаблон (ItemTemplate).

В итоге рекурсивно созданный шаблон будет применен к корню дерева и далее вниз ко всем вложенным элементам..

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

@dioxidin · 12.07.2010, 10:42 **[ТС]**

Сообщение от Костэн

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

Ну во-первых, это я универсальный алгоритм представил. Он работает на глубинах дерева от 1 до "восьмерки на боку"
Во-вторых, все просто.. ты заполнил один уровень - думаешь откуда начать следующий. Берешь и сохраняешь в отдельную переменную свойство первого уровня (например, на первом уровне ты определил свойство типа List<T>) => ты получил начало новой ветки. Далее работаешь с ней опять же как с деревом с одним уровнем вложенности.. Вместо одно большой задачи работай с кучей мелких. Это кажется сложным пока не попробуешь - осталось совсем чуток.
В-третьих, в том-то и прелесть, что самому тебе шаблон распространять по дереву и не нужно будет. Главное создать дерево и шаблон как я описал.

@Sequd · 12.08.2010, 22:15

проблема в следующем... есть лист бокс, в нем Темплайт для итемов:

XML
1
2
3
4
5
6
                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch">
                        <TextBlock Text ="Имя"></TextBlock>
                        <TextBlock Text ="текст"></TextBlock>
                        <Button Content="E" Name="E1" Width="20" Height="20" Click="Button_Click"></Button>
                        <Button Content="X" Width="20" Height="20" Click="DeleteItem"></Button>
                    </StackPanel>

как сделать что бы СтакПанел растягивался в длину на весь лист бокс??? ну естественно без указания конкретных размеров!!!

@ravenger · 26.06.2011, 16:06

Никак не могу понять, как напрямую обращаться к элементам, которые находятся внутри DataTemplate.
У меня есть ListBox, элементами которого являются RadioButton, к которым привязываются значения из ObservableCollection.

XML
1
2
3
4
5
6
7
8
9
    <ListBox MinHeight="50" MinWidth="200" Name="listAnswer" Background="{x:Null}" BorderBrush="{x:Null}" >
        <ListBox.ItemTemplate>
            <DataTemplate xmlns="http://schemas.microsoft.com/client/2007">
                <StackPanel Orientation="Horizontal">
                    <RadioButton Content="{Binding AnswerText}" Margin="5,5,0,0" GroupName="radioAnswer"/>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

Так вот, получить доступ к привязанному объекту я могу,

C#
1
2
var element = (AnswerInfo)listAnswer.Items[0];
labelQuestionPass.Text = element.AnswerText;

а вот доступ к самому элементу RadioButton (чтобы определить у какого элемента свойство IsChecked=true) у меня не получается. В гугле все такие примеры имеют отношения к WPF, а мне нужно Silverlight.

@dioxidin · 26.06.2011, 23:36 **[ТС]**

Пока могу ответить только "навскидку", так что могу чуток ошибаться.
Способы таковы (может и еще есть):
1) элементы в шаблонах можно достать переопределив OnApplyTemplate для класса, производного от того, к которому DataTemplate применяется. В данном случае это ListBoxItem, кажется. Т.е. нужно будет создать производный класс для ListBoxItem и как-то заставить ListBox захавать его. Чето как-то сложно и муторно.
2) Куда проще добавить хэндлер события смены IsChecked'нутости или клика интересующему вас RadioButton:

XML
1
2
3
4
5
6
<DataTemplate xmlns="http://schemas.microsoft.com/client/2007">
  <StackPanel Orientation="Horizontal">
    <RadioButton Content="{Binding AnswerText}" Margin="5,5,0,0" GroupName="radioAnswer"
                       IsCheckedChanged="RadioButton_IsCheckedChanged"/>
  </StackPanel>
</DataTemplate>

@ravenger · 27.06.2011, 12:47

Сообщение от dioxidin

2) Куда проще добавить хэндлер события смены IsChecked'нутости или клика интересующему вас RadioButton:

А как мне узнать, в таком случае, какой именно номер элемента ListBoxItem выделен? Мне нужен именно номер одного или нескольких Check'нутых (в случае, если элементом будет CheckBox) элементов получить

@dioxidin · 27.06.2011, 15:26 **[ТС]**

Вот здесь я написал про паттерн MVVM. Да и в этой ветке наверняка должно было быть что-то. Иначе поищите в "этих интернетах".

Во ViewModel заводите меременнутю int'овую (например, Key или Index). После этого вы можете прибиндить свойство Tag у RadioButton к свойству Key (или Index) у ViewModel. Тогда в хэндлере события легко получить индекс:

C#
1
2
3
4
5
6
7
8
9
private void RadioButton_IsCheckedChanged(object sender, EventArgs e)
{
    if(sender is RadioButton)
    {
        var radioButton = (RadioButton)sender;
        int index = (int)radioButton.Tag;
    }
    
}

По-хорошему там нужно еще добавить проверку на null свойства Tag и на int тоже проверить.

@ravenger · 29.06.2011, 21:12

С паттернами разбираться времени вообще нет, поэтому пришлось добавить самые важные параметры RadioButton в класс AnswerInfo и привязать их.

C#
1
2
<RadioButton Margin="5,5,0,0" IsChecked="{Binding IsSelected}" Content="{Binding AnswerText}"
 Foreground="{Binding Color}" GroupName="radioAnswer"/>

@dioxidin · 30.06.2011, 10:31 **[ТС]**

Сообщение от ravenger

С паттернами разбираться времени вообще нет

Ну так описанное вами - первый шаг к MVVM. Прибиндили к чему? В DataContext положите класс с публичными свойствами (тот же AswerInfo как раз и есть ваша ViewModel) и вы практически получите базовую реализацию MVVM (ну или что-то типа).

Новые блоги и статьи Все статьи Все блоги /
Лето уходит kumehtar 17.08.2026	Мысли в слух kumehtar 17.08.2026 Забавно, насколько сейчас стала доступна информация. Например о магии, духовном развитии, медитациях, и других подобных направлениях, ранее зачастую тайных, передаваемых от учителя к ученику. Хотя. . .	Перемещение строк из ТЧ в другой документ с учетом текущего пробега Maks 17.08.2026 Реализация из решения ниже выполнена на примере нетипового документа "Автозапчасти", с ТЧ "Шины". За основу взят алгоритм отсюда: https:/ / www. cyberforum. ru/ blogs/ 359708/ 10838. html Задача: . . .	Саморегулирующийся социальный контракт для сервера cross-section. Hrethgir 14.08.2026 С кодом конечно таких глубоких размышлений пока не было, впрочем я уже привык к алгоритмизации. Суть предмета записи: снова в диалоге с нейросетью (я взял пока себе ник для учётки админа - Rector). . . .
Часы электронные Uhbif79 12.08.2026 Выкладываю программу часов. Программа позволяет: 1. Использовать системное время и дату, 2. Есть возможность вводить время и дату вручную. 3. Реализованы 2 будильника: начало и конец рабочего дня. . . .	Часы с будильником на основе класса QLCDNumber Uhbif79 12.08.2026 Всем добрый день, выкладываю программу часов с будильником на основе класса QLCDNumber. Здесь я пробовал самостоятельно создавал классы, впервые столкнулся с видимостью переменной одного класса из. . .	Установка MinGW GCC 16.2 и CMake 8Observer8 10.08.2026 VK Видео: https:/ / vkvideo. ru/ video-240781534_456239017 YouTube: eY5-5PyI9NM Текстовая версия	Неделя из жизни имитационной модели склада: мои кривые руки растут, откуда надо anaschu 10.08.2026 Неделя из жизни имитационной модели склада: как я почти написал неправильную логику и что с этим делать Работаю сейчас над учебно-рабочим проектом: строю в AnyLogic имитационную модель процессов. . .

@dioxidin 132 / 99 / 11 Регистрация: 21.11.2007 Сообщений: 544
	09.07.2010, 11:22 [ТС]
	АААА Все понятно.. В Silverlight оказывается его нет... Ничего страшного - реализуем это с помощью обычных. Дай время.. а сам покумекай над концепцией: 1) Пусть есть у тебя Data-класс, у которого имеется свойство, возвращающее коллекцию экземпляров этого же класса (такая вот заготовка "дерева") 2) Делаешь шаблон для этого класса, у которого есть ListBox или ListView для указанной выше коллекции. В качестве ItemTemplate этого (шаблонного) листа указываешь тот же шаблон твоего иерархического Data-класса 3) Пусть в интерфейсе страницы есть корневой List... , в котором нужно отобразить все дерево. Добавляешь корень своего дерева (экземпляр Data-класса) в итемы корневого листа на интерфейсе и указываешь его шаблон (ItemTemplate). В итоге рекурсивно созданный шаблон будет применен к корню дерева и далее вниз ко всем вложенным элементам.. 0