tag:blogger.com,1999:blog-455072646448673416.post8929343099500275710..comments2023-05-12T13:03:46.779+01:00Comments on LeeCampbell: Horizontal stretch on TreeViewItemsLee Campbellhttp://www.blogger.com/profile/16932445715757919177noreply@blogger.comBlogger31125tag:blogger.com,1999:blog-455072646448673416.post-86303072073054736342014-09-30T11:08:10.887+01:002014-09-30T11:08:10.887+01:00Hi Lee,
Your solution works like a charm. But wit...Hi Lee,<br /><br />Your solution works like a charm. But with this the content before the text is not getting highlighted i.e the expandcollapse buttons etc. <br /><br />Can you help with this.Kaveesh Dashorahttps://www.blogger.com/profile/11799762970397443099noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-23854906671745434062014-08-06T00:48:32.893+01:002014-08-06T00:48:32.893+01:00I came here from Stackoverflow, expecting a quick ...I came here from Stackoverflow, expecting a quick and elegant fix.<br />Boy, oh boy, was I mistaken.<br /><br />That is a quite a lot of xaml for something as idiotic as treeviewitem.width ?!<br /><br />However, I sincerely thank you for your time putting this together. You have no idea how delighted I was to paste and just... enjoy.Anonymoushttps://www.blogger.com/profile/00495902768014793746noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-71769882626209996182014-01-29T15:22:27.235+00:002014-01-29T15:22:27.235+00:00Thanks for the reply.
I am trying to get simplify...Thanks for the reply.<br /><br />I am trying to get simplify this problem. It seems to have something to do with RichTextBox default width not being set.<br /><br />jl.reynoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-20039555283004458812014-01-28T18:38:52.037+00:002014-01-28T18:38:52.037+00:00Sorry, it is really hard to read your sample code ...Sorry, it is really hard to read your sample code @jl.rey.<br />Maybe you can post it as a gist on gist.github.com and then share the link? <br />On initial investigation, I would hazard to guess that it is that you create a style in your resources, but then overwrite it in your TreeView.ItemContainierStyle.Lee Campbellhttps://www.blogger.com/profile/16932445715757919177noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-65097379630709958032014-01-28T16:15:22.288+00:002014-01-28T16:15:22.288+00:00I tried this an saw no change in behavior.
Maybe ...I tried this an saw no change in behavior.<br /><br />Maybe I am using it wrong.<br /><br />I will try summarize.<br /><br /><UserControl ... /&rt;<br /> <UserControl.Resources&rt;<br /> <Style argetType="TreeViewItem"<br /> BasedOn="{StaticResource {x:Type TreeViewItem}}"&rt; <br />... Your template ...<br /> </UserControl.Resources&rt;<br /> <DocPanel LastChild=fill&rt;<br /> <-- Tree view is last child --&rt;<br /> <TreeView<br /> ItemSource={Bindig ...}<br /> ...&rt;<br /> <TreeView.ItemContainierStyle&rt;<br /> <Style TargetType="{x:Type TreeViewItem}" &rt;<br /> <? Note 1 ?&rt;<br /> ... set bindings to MVVM model ...<br /> <? Note 2 ?&rt;<br /> </Style&rt;<br /> </TreeView.ItemContainerStyle&rt;<br /><br /> <TreeView.ItemTemplate&rt;<br /> <HierarchicalDataTemplate<br /> ItemsSource="{Binding Children}"&rt;<br /><br /> <Grid Name="gridItem"<br /> HorizontalAlignment="Stretch"&rt;<br /> <Grid.ColumnDefinitions&rt;<br /> <ColumnDefinition Width="Auto" /&rt;<br /> <ColumnDefinition Width="*" /&rt;<br /> </Grid.ColumnDefinitions&rt;<br /> <Image<br /> Grid.Column="0"<br /> Width="20"<br /> Height="20"<br /> Margin="0,0,3,0"<br /> Source="{Binding Path=Image, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}" /&rt;<br /><br /> <xctk:RichTextBox <-- This is the RichTextBox from Extended WPF Toolkit - 1.9.0 --&rt;<br /> Grid.Column="1"<br /> HorizontalAlignment="Stretch"<br /> Name="rtfName"<br /> Text="{Binding Name}"<br /> AcceptsTab="True"<br /> IsReadOnly="True"<br /> IsTabStop="False" <br /> MinWidth="50"&rt;<br /> <xctk:RichTextBox.TextFormatter&rt;<br /> <jlr:TextFormatterRTF /&rt;<br /> </xctk:RichTextBox.TextFormatter&rt;<br /> </xctk:RichTextBox&rt;<br /> <br /> </HierarchicalDataTemplate&rt;<br /> </TreeView.ItemTemplate&rt;<br /> <Style TargetType={xType TreeView<br /> </DocPanel&rt;<br /></UserControl&rt;<br /><br />The bindings work but the rtf box is less the MinWidth, or less than 1 character if minwidt is omitted.<br /><br />Note 1: I also attempted to name the style and assign here as a named style.<br /> Was unable to load this control something about a null reference.<br /><br /><br />Note 2: Attempted to put the Setter Property template portion of your example here.<br /> Did run but no effect.<br /><br />How am I to use this example???jl.reynoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-90910704785057960502013-04-05T14:56:00.182+01:002013-04-05T14:56:00.182+01:00Lee, Thank you for taking an interest in my questi...Lee, Thank you for taking an interest in my question.<br /><br />lmgtfy ... nice :-)<br /><br />Hmmm... now to specify the problem...<br /><br />__Background__<br /><br />Given the following hiearchical structure (Hopefully my ASCII art is clear enough).<br /><br />- Group 1 <br /> Leaf 1A<br /> Leaf 1B<br />+ Group 2<br /><br /><br />1) If I select "Group 1", the default TreeView will only highlight the "Group 1" label. <br />-*Group*1 <br /> Leaf 1A<br /> Leaf 1B<br />+ Group 2<br /><br />Whereas your solution will highlight both the item label _and the entire 'line' beside it_ <br /><br />-*Group*1******* <br /> Leaf 1A<br /> Leaf 1B<br />+ Group 2<br /><br /><br />2) If I double click on the "Group 2" text, the default TreeView will open it.<br />however, if I double click to the right of "Group 2", the default TreeView will not open it.<br /><br />Your solution will allow me to double click the item label _or anywhere on the 'line' beside it_ to open it.<br /><br />So I am using your solution. Thank you.<br /><br />__The Problem __<br /><br />Now I want to attach a Context Menu to the items of the list. One context menu will apply to Group items and another context menu will apply to Leaf items.<br /><br />I would like to be able to right click on the item label, _or anywhere on the 'line' beside it_ to get the context menu. <br />For example: <br /><br />-*Group*1*****------------- <br /> Leaf 1A | Group menu |<br /> Leaf 1B -------------<br />+ Group 2<br /><br /><br />I know how to attach a Context Menu to the TreeView<br /> TreeView ... <br /> TreeView.ContextMenu ...<br /> ....<br /><br />I know how to attach a context Menu to a control in the HierarchicalDataTemplate and DataTemplate as follows:<br /> HierarchicalDataTemplate...<br /> Grid ...<br /> Grid.ContextMenu ...<br /> ....<br /><br /> DataTemplate ...<br /> TextBlock ...<br /> TextBlock.ContextMenu <br /> ....<br /> <br /><br />However, the context menus only pop up when I right-click on the item text. I.e. not _anywhere on the 'line' beside it_.<br /><br />I am hoping that is a clearer explanation of the problem.<br /><br />It almost seems like I need to attach the context menu to the _parent_ of the DataTempate.<br /><br />Help?Anonymousnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-62613227984679301352013-04-04T23:52:52.790+01:002013-04-04T23:52:52.790+01:00Without you specifying what your problem, or what ...Without you specifying what your problem, or what solutions you have tried to use to add a context menu to your application, I can only assume you have not tried anything yet.<br />Here might be a helpful link for adding a <a href="http://lmgtfy.com/?q=WPF+ContextMenu" rel="nofollow">context menu in wpf </a>Lee Campbellhttps://www.blogger.com/profile/16932445715757919177noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-90234165078847006472013-04-04T23:48:45.467+01:002013-04-04T23:48:45.467+01:00If you dont want it centered then sure remove the ...If you dont want it centered then sure remove the setter doing this. If you want it left aligned, then you possibly dont need any of this code and can just use the default? (unless you want to control the background color?)Lee Campbellhttps://www.blogger.com/profile/16932445715757919177noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-4156715297689432882013-04-04T20:30:45.613+01:002013-04-04T20:30:45.613+01:00Now can you help me attach a context menu the node...Now can you help me attach a context menu the nodes (for each of my HierarchicalDataTemplate and DataTemplate)<br /><br />I would like it so that the context menu opens no matter where on the line I select.<br /><br />This would be consistent with selection and highlighting. Since they work for the entire line, so to should the context menu.<br /><br />Help?Anonymousnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-78819225091809149462013-04-04T20:28:21.039+01:002013-04-04T20:28:21.039+01:00In the solution, you have
Setter Property="H...In the solution, you have <br />Setter Property="HorizontalContentAlignment" Value="Center"<br /><br />This makes all the content centered. but the comment was that the default is Left.<br /><br />Anyway, I wonder if that line should be removed. <br />I removed it and things works as expected for me.Anonymousnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-31620026714923197862013-04-04T17:36:33.028+01:002013-04-04T17:36:33.028+01:00This comment has been removed by a blog administrator.Anonymousnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-45821152471957654062013-03-04T16:41:23.238+00:002013-03-04T16:41:23.238+00:00Lee, I found your solution while working on a Tree...Lee, I found your solution while working on a TreeView related issue on Silverlight 5. <br />The problem I have is that the mouse wheel scrolling does not work if the cursor is on the empty space between the items in the tree and the vertical scrollbar. I have a TreeView defined in XAML<br /><br /><br /><br />In the code behind I add the TreeViewItems.<br /><br />I have tried to use your solution by editing the TreeViewItem template. I commented out the middle column and changed the ColumSpan for the ItemsPresenter tab. <br />I am setting the template on the Load event of the TreeViewItem that I add.The TreeViewItem has a checkbox and text inside a StackPanel. I have set the HorizontalContentAlignment to Stretch for the TreeViewPanel.<br /><br />I thought that this would stretch the TreeViewItem contents to fill the column and that will allow the scrolling to work. But it is not working. Any thoughts on what I can be doing wrong?<br /><br />Thanks.Ronnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-34065955475600122652012-08-14T12:42:13.747+01:002012-08-14T12:42:13.747+01:00I had the same problem in Silverlight 5, which dro...I had the same problem in Silverlight 5, which drove me nuts while trying to find a solution.<br /><br />Your solution for WPF set me off in the right direction, though I could not make out what was the essence of the whole Template you had posted.<br /><br />So I had to experiment a while until I found what was really needed to solve my problem. It came down to just a couple of changed lines.<br /><br />So here it is. ( I had to replace the sharp brackets by straight ones here, the code tag was not accepted either. Maybe you can restore them.)<br /><br />- Copy the ControlTemplates in Blend for TreeViewItem and TreeView.<br /><br />- For TreeViewItem, just change the ColumnDefinitions and ItemsPresenter along your line of thought:<br /> [Grid.ColumnDefinitions]<br /> [ColumnDefinition Width="15"/]<br /> [!--[ColumnDefinition Width="Auto"/]--]<br /> [ColumnDefinition Width="*"/]<br /> [/Grid.ColumnDefinitions]<br /> <br /> [!--[ItemsPresenter x:Name="ItemsHost" Grid.ColumnSpan="2" Grid.Column="1" Grid.Row="1" Visibility="Collapsed"/]--]<br /> [ItemsPresenter x:Name="ItemsHost" Grid.ColumnSpan="1" Grid.Column="1" Grid.Row="1" Visibility="Collapsed"/]<br /> <br />- For TreeView, just change the HorizontalScrollBarVisibility of the ScrollViewer.<br /> [!--[ScrollViewer x:Name="ScrollViewer" BorderBrush="Transparent" BorderThickness="0" Background="{x:Null}" HorizontalScrollBarVisibility="Auto" IsTabStop="False" TabNavigation="Once" VerticalScrollBarVisibility="Auto"]--]<br /> [ScrollViewer x:Name="ScrollViewer" BorderBrush="Transparent" BorderThickness="0" Background="{x:Null}" HorizontalScrollBarVisibility="Disabled" IsTabStop="False" TabNavigation="Once" VerticalScrollBarVisibility="Auto"]<br /><br />And that was it! <br />(I hope this is all readable.)<br /><br />It is frustrating that such a logical feature is not already built in by Microsoft and takes such effort to fix on our own.Robertnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-55288950972163161652012-04-25T11:15:20.202+01:002012-04-25T11:15:20.202+01:00Certainly is an ugly hack, Yves!
:p
I hope you don...Certainly is an ugly hack, Yves!<br />:p<br />I hope you don't resort to it for the sake of the poor developer who may have to maintain it later.<br /><br />Thanks for the feedback, hope it helped.Lee Campbellhttps://www.blogger.com/profile/16932445715757919177noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-75652773844802802232012-04-25T11:07:11.770+01:002012-04-25T11:07:11.770+01:00Hello and thank you very much for theese explanati...Hello and thank you very much for theese explanations. Its good to understand how things work and may be valuable information to find solutions to many problems. Personally, I found a different uggly but very simple hack :<br /><br /><br /><br /><br /><br /><br /><br />Where :<br /><br />public class OptionWidthConverter : IValueConverter<br /> {<br /> public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)<br /> {<br /> double width = 0;<br /> TreeViewItem parent = value as TreeViewItem;<br /><br /> width = parent.ActualWidth - 30;<br /> <br /> return width;<br /> }<br /><br /> public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)<br /> {<br /> throw new InvalidOperationException();<br /> }<br /> }<br /><br />YvesYves Darmaillacnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-44035630112964341272012-02-08T14:23:52.929+00:002012-02-08T14:23:52.929+00:00Great to see that this post is still helping peopl...Great to see that this post is still helping people out. Feel free to reuse and link back @Artiom.Lee Campbellhttps://www.blogger.com/profile/16932445715757919177noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-11397884344044804112011-09-25T10:12:02.755+01:002011-09-25T10:12:02.755+01:00Hi lee, thx for ur post, I used ur style in my blo...Hi lee, thx for ur post, I used ur style in my blog, (http://mypronotes.blogspot.com/) hope you are not agains. I wrote link to your post as a source.Anonymoushttps://www.blogger.com/profile/06512185262555947172noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-36795656667785876312010-10-22T20:56:40.644+01:002010-10-22T20:56:40.644+01:00I've also experienced the problem with the tre...I've also experienced the problem with the treeviewitem not decreasing in size, but it seems to only occur when I also have to apply the textbox hack in order for textboxes to respect the parent container width when entering a lot of text:<br /><br /><Border Name="placeholderSectionBorder" Grid.Column="1" /><br /><TextBox Grid.Column="1" TextWrapping="Wrap" Width="{Binding ElementName=placeholderSectionBorder, Path=ActualWidth}"><br /></TextBox><br /><br />Unfortunately, I need the textbox to stretch and wrap properly and I have not yet figured out a workaround.Anonymousnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-36433105338569723912010-06-10T20:33:21.709+01:002010-06-10T20:33:21.709+01:00With this solution, has anyone experienced when th...With this solution, has anyone experienced when the treeview width expands the treeviewitem expands with it; but when the treeview width decreases the treeviewitem does not?Anonymousnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-60894415985848479712009-10-19T15:12:25.892+01:002009-10-19T15:12:25.892+01:00Thanks! This solution solved my problem perfectly!...Thanks! This solution solved my problem perfectly!Stephen Wrightonhttps://www.blogger.com/profile/04327444702584281387noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-51779273239005218712009-09-04T10:58:38.666+01:002009-09-04T10:58:38.666+01:00I didnt like the idea of editing the whole templat...I didnt like the idea of editing the whole template of the treeview, so I decided a far simplest way to do it, just by creating a datatemplate for my object which has a itemscontrol which has a binding to the childs. <br /><br />then I did a itemcontrol. <br /><br />Of course, all of this inspired in the explanation of Lee.<br /><br />Thanks once again.Juan Diegohttps://www.blogger.com/profile/10504445898695947946noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-73237077668568214252009-08-13T10:32:20.071+01:002009-08-13T10:32:20.071+01:00/Jens,
If you want to have a different look and fe.../Jens,<br />If you want to have a different look and feel, then apply the same process I have in the post but do so with the template from the Theme you are targeting. You can get the original template from tools such as Blend or the fantastic free tool "ShowMeTheTemplate".<br /><br />LeeLee Campbellhttps://www.blogger.com/profile/16932445715757919177noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-23217765725953523772009-08-13T10:27:16.158+01:002009-08-13T10:27:16.158+01:00Neat!
But this gives the Vista visual style even ...Neat!<br /><br />But this gives the Vista visual style even in other environments?<br /><br />/JensAnonymousnoreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-69714524343179609352009-07-14T05:06:10.691+01:002009-07-14T05:06:10.691+01:00Thanks a ton, was trying to do this with no luck w...Thanks a ton, was trying to do this with no luck with all the same Hacks you had linked to. Yours is the only one that actually feels like a maintainable solution.Chris Towleshttps://www.blogger.com/profile/04155229722980005328noreply@blogger.comtag:blogger.com,1999:blog-455072646448673416.post-86340307333381073162009-06-09T00:41:33.871+01:002009-06-09T00:41:33.871+01:00Hi, Lee.
I think that tomorrow my manager will be...Hi, Lee.<br /><br />I think that tomorrow my manager will be very releived with this simple solution. :) I'll test it and send the results to you.<br /><br />Thanks!Anonymoushttps://www.blogger.com/profile/11657938686964524821noreply@blogger.com