WPF Expander control header not rendering on XP machine - wpf

I have a WPF expander control which is not rendering the expander header content when the app is run on XP machine (XP with SP3), when run on a Win7 machine the content is rendered as expected.
The expander header is a virtualised stack panel (horizontal) with a couple of text blocks inside.
When I use snoop to investigate I can see the expected text and the font colour is black - so it's not white text on a white background.
Anyone know why it would not be rendering on XP?
Header template:
<Expander.Header>
<VirtualizingStackPanel Orientation="Horizontal">
<Controls2:HighlightTextBlock Style="{StaticResource RegularTextStyle}"
Text="{Binding Name, Mode=OneWay}"
Margin="10,0,0,0"
HighlightText="{Binding RelativeSource=RelativeSource FindAncestor, AncestorType={x:Type Controls2:ViewHost}}, Path=DataContext.SearchText}"
Foreground="{StaticResource Jedi.HighlightForegroundTextBrush}"
HighlightBackground="{StaticResource Jedi.HighlightBackgroundTextBrush}"/>
<TextBlock Margin="15,0,0,0">
<Run Text="(" />
<Run Text="{Binding Id, Mode=OneWay}"></Run>
<Run Text=")"/>
</TextBlock>
</VirtualizingStackPanel>
</Expander.Header>

You should replace the VirtualizingStackPanel by a StackPanel.
According to MSDN :
The word "virtualize" refers to a technique by which a subset of user
interface (UI) elements are generated from a larger number of data
items based on which items are visible on-screen. Generating many UI
elements when only a few elements might be on the screen can adversely
affect the performance of your application. The VirtualizingStackPanel
calculates the number of visible items and works with the
ItemContainerGenerator from an ItemsControl (such as ListBox or
ListView) to create UI elements only for visible items.
So in this case, as there are few items inside your panel, it is not needed.

Related

WPF TextBox in DataTemplate of ToggleButton does not show text if in toolbar flyout

If I put the Column where the toolbar is hosted to be very big (800) then all the text is visible:
but if I put a smaller column this happens:
But I cannot understand why:
<DataTemplate x:Key="IconFilterButton">
<StackPanel Orientation="Horizontal">
<TextBlock
VerticalAlignment="Center"
Style="{StaticResource LargeIconStyle}"
Text="{Binding}" />
<TextBlock
Margin="6,0,0,0"
VerticalAlignment="Center"
DataContext="{Binding}"
Style="{StaticResource BodyTextStyle}"
Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ToggleButton}, Path=Tag}" />
</StackPanel>
</DataTemplate>
and here the definition
<ToggleButton
x:Name="DFilter"
Click="Filtering_Click"
Content=""
ContentTemplate="{StaticResource IconFilterButton}"
Tag="1d"
/>
<ToggleButton
x:Name="WFilter"
Click="Filtering_Click"
Content=""
ContentTemplate="{StaticResource IconFilterButton}"
Tag="1w"
/>
Even worst if I click on the button once they are out:
and then the text is visible but is wrong as the TextBlock is not considered in the object size:
The WPF ToolBar control uses a custom panel for the overflow Popup. In many styles, the ToolBarOverFlowPanel has a property WrapWidth set to a static value like 200. This determines how many items can be displayed before it wraps to another row in the popup.
I've created custom styling for this control and have found that the ToolBarOverFlowPanel used internally is buggy. That's probably the source of your problem.
You can re-template the ToolBar and wire-up a different value for WrapWidth to try to fix the issue, but my guess is that you'll still run into layout problems.
Otherwise, you might consider making your own replacement control.

how to draw wpf ui with many many controls?

My application UI use Tab control.
One of the tab has 20 groupboxes (in scrollviwer), and each groupbox contents 300 textbox with a name (label) above the textbox (not one on one match).
When the app running (not yet), each textbox will display a byte value from the buffer.
I am manually drawing this groupbox, it is too much work. I am trying use itemcontrol to draw the textboxes, but don't know how to make a new line since there are name-value pair.
Any solution will be appreciated.
You would use an ItemControl with a DataTemplate, where the DataTemplate represents one key-value pair.
<ItemsControl>
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Hi I am a label" />
<TextBox />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>

Align text vertical and horizontal center in stack panel?

I am trying to align a textblock vertically and horizontally center in a stack panel which is there in Listview but i am only able to get text vetically center but not horizontally. Plus the text is not getting wrapped. Here is the code that i have tried:
<ListBox Name="lstTiles" Margin="12,0,-12,0" Grid.Row="1" SelectionChanged="lstTiles_SelectionChanged">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<toolkit:WrapPanel/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Background="{StaticResource PhoneAccentBrush}" Width="145" Height="80" Margin="8,8,0,0" Orientation="Vertical" >
<TextBlock Text="{Binding Name}" Tag="{Binding ID}" Style="{StaticResource PhoneTextNormalStyle}" FontSize="15" TextWrapping="Wrap" TextAlignment="Center" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
How can i achieve text vertically, horizontally and textwrap?
It looks like since you have the orientation of the StackPanel set to Horizontal, you're putting textblocks next to each other rather than on top of each other. Since the StackPanel elements take the size of their children, you would be able to visualize this as a horizontal, side-by-side, listing of textblocks. Since each textblock takes the size of the text that is in it, you are going to see blocks that are of varying widths, so centering horizontally is going to have no effect.
You could use margins (a pain) to accomplish equal widths. I don't recommend this.
You could also put grids of a set width in the stack panel, and put the textblocks on the grid. You may be able to set the width of the textblocks to get the right effect, but I can't test this at the moment, and I don't remember if it will cause the text to stretch or not.
For text wrapping, I assume you're talking about within the textblock, and that's easy - just set the textblock's TextWrapping property to Wrap.
Try setting the HorizontalContentAlignment and VerticalContentAlignment properties on the listboxitem. I don't have my dev computer now, so I can't experiment, but here is a post that might help you: Silverlight 3: ListBox DataTemplate HorizontalAlignment. Look at both of the first two answers, and see which one might be most helpful in your situation, substituting center, of course, in place of left, top, or stretch.

Extended WPF Toolkit RichTextBox display text vertically

I'm trying to bind a rich content (RTF format) to a rich text box (of Extended WPF Toolkit) via its Text property like this
<extToolkit:RichTextBox x:Name="rtbKIContent" Margin="8,8,8,8"
IsEnabled="{Binding IsEditable}"
Text="{Binding Content}">
<extToolkit:RichTextBox.TextFormatter>
<extToolkit:RtfFormatter></extToolkit:RtfFormatter>
</extToolkit:RichTextBox.TextFormatter>
<extToolkit:RichTextBoxFormatBarManager.FormatBar>
<extToolkit:RichTextBoxFormatBar />
</extToolkit:RichTextBoxFormatBarManager.FormatBar>
</extToolkit:RichTextBox>
Sometimes it works just fine, but there are circumstances that they just display the text vertically like this.
I don't know what's wrong with it...What should I do to make it display text from left to right like normal?
If you add a width to the RichTextBox, it should fix it.
I did this so it binds to the parent.
Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Grid, AncestorLevel=1}, Path=ActualWidth}"
Note you will have to determine AncestorType for you. But you can do this too. Width="100"
Agree with "jmogera".
Need to set width for this issue.
HorizontalAlignment="Stretch" MinWidth="100"
You can set MinWidth to 100 and keep HorizontalAlign to streach if you want control to resize.

Unable to get vertical scroll bars in an WPF TextBlock

I'm presenting text in a wpf TextBlock control (.Net 3.5). The content of the textblock varies depending on what the user selects in a list box. The text wraps, so I don't need an horizontal scroll bar. However, there is often more text than the amount the window can display, so I need a vertical scroll bar.
As I started searching I quickly found that the answer is to wrap the TextBlock in a ScrollViewer. However, It Does Not Work (TM) and I'm hoping someone can help me work out why.
This is the structure of the UI code:
<Window x:Class=..>
<StackPanel>
<ListBox HorizontalAlignment="Stretch"
VerticalAlignment="Top" Height="200"
SelectionChanged="listbox_changed" SelectionMode="Single">
</ListBox>
<Button Click="Select_clicked">Select</Button>
<ScrollViewer VerticalScrollBarVisibility="Auto">
<TextBlock Name="textblock" TextWrapping="Wrap"/>
</ScrollViewer>
</StackPanel>
</Window>
When the user selects an item in the list box, some text associated with this item is presented in the TextBlock. I would have thought that the code as it stands should have been all that's required, but it never provides me with a scroll bar.
Searching and experimenting have given me two clues: the root of the problem might be related to me updating the content of the TextBlock dynamically, and that the TextBlock does not resize itself based on the new content. I found a posting that seemed relevant that said that by setting the Height of the TextBlock to its ActualHeight (after having changed its content), it would work. But it didn't (I can see no effect of this).
Second, if I set the height (during design time) of the ScrollViewer, then I do get a vertical scroll bar. For instance, if I set it to 300 in the xaml above, the result is almost good in that the window as first opened contains a TextBlock with a vertical scroll bar when (and only when) I need it. But if I make the window larger (resizing it with the mouse during runtime), the ScrollViewer does not exploit the new window size and instead keeps its height as per the xaml which of course won't do.
Hopefully, I've just overlooked something obvious..
Thanks!
Because your ScrollViewer is in a StackPanel it will be given as much vertical space as it needs to display it's content.
You would need to use a parent panel that restricts the vertical space, like DockPanel or Grid.
<DockPanel>
<ListBox DockPanel.Dock="Top" HorizontalAlignment="Stretch"
VerticalAlignment="Top" Height="200"
SelectionChanged="listbox_changed" SelectionMode="Single">
</ListBox>
<Button DockPanel.Dock="Top" Click="Select_clicked">Select</Button>
<ScrollViewer VerticalScrollBarVisibility="Auto">
<TextBlock Name="textblock" TextWrapping="Wrap"/>
</ScrollViewer>
</DockPanel>

Resources