2013-04-04 4 views
0

Я хотел бы стиль моего TreeView, как Mac NSOutlineView.WPF TreeView стиль, как Mac NSOutlineView

http://s3.amazonaws.com/cocoacontrols_production/osx_screens/44/full.png?1299027729

Ключом фичи:

  1. TreeView полная ширина подсветка выбранного элемента
  2. Цвет фона
  3. Различные стиль для элементов корня заголовка

Я полагаю, может отследить 2 и 3, но не может найти ничего, что связано с номер 1.

Похоже, я не могу этого сделать, но я буду играть с Blend. Нет ли доступа к рисунку для кода? например, вот ящик заменяет код рисования строк? Я сделал прототип только сейчас в wxPython, используя чистый скрипт HyperTreeList от AGW, который выглядит одинаково, но, к сожалению, перетаскивание имеет серьезные проблемы с графикой/обновлением.

ответ

0

Будет ли подходящим элементом ItemsControl.ItemContainerStyle? http://msdn.microsoft.com/fr-fr/library/system.windows.controls.itemscontrol.itemcontainerstyle(v=vs.85).aspx

Быстрый тест под Blend, привел следующее:

Для родителей:

enter image description here

Для детской:

enter image description here

Обратите внимание, что это неравномерно, он не выглядит хорошо.

Можно спросить, почему бы не растянуть его до левой границы? Я думаю, это невозможно (из того, что я видел в Blend), если вы, конечно, не воссоздаете большую часть шаблона. Также это, безусловно, приведет к уничтожению иерархического взгляда между элементами, если их левая сторона селектора будет выровнена с одним и тем же горизонтальным значением.

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

В конечном итоге ваш элемент управления будет больше похож на ListBox, чем TreeView.

Во всяком случае, вот процедура (я редактировал ItemContainerStyleTemplate из TreeView)

enter image description here

(жаль не хорошо читать ваш последний комментарий, в конце концов, мой результат в значительной степени, как у вас)

Где сделать это в смесь:

enter image description here

+0

Я пытался работать с этим, но она охватывает только элемент, который является право стрелка расширения до конца строки. – Mark

+0

Не знаю о смешении спасибо. Я поиграю. – Mark

+0

Я добавил изображение о том, где это сделать в Blend. Также обратите внимание, что если вы работаете на VS2012 и работаете в проекте WPF, только просмотр Blend + Sketchflow Preview позволит вам редактировать такой проект, а не Blend для Visual Studio 2012. http://msdn.microsoft.com/en-us /expression/jj154135.aspx (мне потребовалось некоторое время, чтобы понять, почему я не мог редактировать проекты WPF с помощью Blend, поставляемого с VS2012 ... :-) Наконец, я бы сказал, что Blend похож на хлеб на сливочное масло, вам действительно нужно это когда вы начинаете серьезно относиться к WPF, если вы не любите кодировать все XAML вручную. – Aybe

2

Я только р ushed на Mongoose репозиторий TreeViewItem Style, который делает то, что вам нужно.

Вы можете найти здесь: StretchedTreeViewItemControlTemplate

Вот пример кода:

<TreeView ItemContainerStyle="{StaticResource StretchedTreeViewItemControlTemplate}"> 
    <TreeViewItem Header="Item 1"> 
     <TreeViewItem Header="Item 1.1"> 
      <TreeViewItem.Style> 
       <Style BasedOn="{StaticResource StretchedTreeViewItemControlTemplate}" TargetType="{x:Type TreeViewItem}"> 
        <Setter Property="FontSize" Value="15" /> 
       </Style> 
      </TreeViewItem.Style> 
     </TreeViewItem> 
    </TreeViewItem> 
    <TreeViewItem Header="Item 2" Background="AntiqueWhite" /> 
</TreeView> 

enter image description here

+0

Упрощенный для полезного кода для проверки. Не уверен, что я могу использовать TreeView, как я хочу, без строки полной ширины, выделенной слева направо. Это просто странно для меня в моем случае использования. – Mark

Смежные вопросы