I am developing a silverlight navigation application and got stuck on the following problem...
The guy I am developing the app wants to have a News page where you can see all published news on the left side and the clicked (or latest news if none is clicked) on the right side. He wanted to have a header, text and publishing date for each news in the news list. Also he wanted to have paging so that there won't be to many news in the list at once...
I did this:
foreach (Model.News news in s)
{
StackPanel stackPanel = new StackPanel();
HyperlinkButton hyperlinkButton = new HyperlinkButton();
hyperlinkButton.Tag = news.Header;
hyperlinkButton.Content = news.Header;
hyperlinkButton.FontSize = 15;
hyperlinkButton.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
hyperlinkButton.Click += new RoutedEventHandler(Button_Click);
stackPanel.Children.Add(hyperlinkButton);
TextBlock textBlock = new TextBlock();
textBlock.Foreground = new SolidColorBrush(Colors.Gray);
textBlock.FontSize = 12;
textBlock.FontFamily = new FontFamily("Verdana");
textBlock.TextWrapping = TextWrapping.Wrap;
textBlock.Text = news.Text;
stackPanel.Children.Add(textBlock);
TextBlock dateTextBlock = new TextBlock();
dateTextBlock.Foreground = new SolidColorBrush(Colors.Gray);
dateTextBlock.FontSize = 10;
dateTextBlock.FontFamily = new FontFamily("Verdana");
dateTextBlock.TextWrapping = TextWrapping.Wrap;
dateTextBlock.FontWeight = FontWeights.Bold;
dateTextBlock.HorizontalAlignment = System.Windows.HorizontalAlignment.Right;
dateTextBlock.Text = news.Date.ToShortDateString();
stackPanel.Children.Add(dateTextBlock);
stackPanel.Children.Add(new TextBlock());
newsStackPanel.Children.Add(stackPanel);
}
PagedCollectionView itemListView = new PagedCollectionView(newsStackPanel.Children);
newsPager.Source = itemListView;
and all of it goes here
<Grid x:Name="LayoutRoot" Loaded="LayoutRoot_Loaded" MaxWidth="1100">
<Grid.RenderTransform>
<CompositeTransform/>
</Grid.RenderTransform>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="2"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<RichTextBox Name="contentRTB" MaxWidth="1000" Margin="10, 30, 10, 30" Grid.Column="2"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
TextWrapping="Wrap"
Style="{StaticResource RichTextBoxStyle}" IsReadOnly="True"/>
<Rectangle Grid.Column="1" Margin="0,10"
Fill="#FF0067C6"/>
<TextBlock Name="header" Foreground="#FF0067C6" FontSize="18" FontFamily="Verdana" HorizontalAlignment="Center" VerticalAlignment="Top" Grid.Column="0"></TextBlock>
<sdk:DataPager x:Name="newsPager"
DisplayMode="FirstLastNumeric"
Background="#FF0067C6"
PageSize="3"
AutoEllipsis="True"
NumericButtonCount="3"/>
<StackPanel Name="newsStackPanel" Grid.Column="0" Orientation="Vertical" Margin="0,50,0,0"/>
</Grid>
The newsPager displayes (correctly) 2 pages because i have currently 5 news and the pageSize is set to 3 but they are all displayed on the same page so I dont get the desired paging... how can i fix it
Your code is adding all the items to a StackPanel, then it is putting that StackPanel inside another StackPanel called "newsStackPanel" below the DataPager. So, right now, the DataPager has nothing to do with the display of your news articles, and you won't be seeing any paging happening.
Instead, take a look at the DataPager sample code here:
http://msdn.microsoft.com/en-us/library/system.windows.controls.datapager(VS.95).aspx#Y9406
You'll need to modify that sample code to contain a list of StackPanels like this:
List<StackPanel> itemList = new List<StackPanel>();
Then, for each of your news items, add them to that list instead of an outer StackPanel:
itemList.Add(stackPanel);
You'll then wrap that up and bind it to both your data pager and a new list control:
// Wrap the itemList in a PagedCollectionView for paging functionality
PagedCollectionView itemListView = new PagedCollectionView(itemList);
// Set the DataPager and ListBox to the same data source.
newsPager.Source = itemListView;
listBox1.ItemsSource = itemListView;
The sample uses a ListBox called "listBox1". You have lots of choices there. Perhaps replace the "newsStackPanel" with a ListBox called "newsList".
OK, that should be enough to get you through this.
Now for a little more homework:
You should really consider switching this to the MVVM pattern where you bind these values and template them instead of making UI controls in C#. This results in much cleaner code, enables much easier reuse, improves testability, and so on. There are a million zillion articles on the web for this. Here is one from MS:
http://msdn.microsoft.com/en-us/library/gg430869(v=PandP.40).aspx
I don't know if the DataPager control you're using handles the paging completely.
You could only add the news items that are on the page you want to view to the stack panel.
One easy way to do that could be to use LINQ in your for each, something like:
foreach (Model.News news in s.Skip(newsPager.PageSize * newsPager.PageIndex).Take(newsPager.PageSize))
you'd have to reinitialize the items in the pager when the page index changes then too.
Related
I started by making a label in XAML with its content bound to a string in my resources file. I've implemented localization and confirm that when I change languages, the label's content updates accordingly.
Now I need to do the same from code behind.
Here is a taste of the XAML:
<Grid Background="#FF313131">
<ScrollViewer>
<StackPanel x:Name="GeneralTab_StackPanel">
<WrapPanel VerticalAlignment="Top" Background="{Binding AxisDataColorCode}" Margin="2,2,2,0">
<Label x:Name="lbl_General_MachineType" Content="{Binding GUI_MachineType, Source={StaticResource Resources}}" FontSize="20" />
<Label x:Name="lbl_General_MachineTypeResult" Content="{Binding MachineBaseType}" FontSize="20" />
</WrapPanel>
<WrapPanel....
Attempting to recreate this in code-behind I have the following:
Binding BgColorBinding = new Binding("AxisDataColorCode");
// Something needs to change here. I've tried a bunch of things already with no luck.
Binding GUI_MachineTypeBinding = new Binding("GUI_MachineType");
GUI_MachineTypeBinding.Source = Properties.Resources.GUI_MachineType;
Binding MachineBaseTypeBinding = new Binding("MachineBaseType");
Label Label_MachineType = new Label();
Label_MachineType.Name = "lbl_General_MachineType";
Label_MachineType.FontSize = 20;
// This does not work at all. Help!
Label_MachineType.SetBinding(Label.ContentProperty, GUI_MachineTypeBinding);
// this works! but it's not a binding and doesn't update...
// Label_MachineType.Content = Properties.Resources.GUI_MachineType;
Label Label_MachineTypeResult = new Label();
Label_MachineTypeResult.Name = "lbl_General_MachineTypeResult";
Label_MachineTypeResult.FontSize = 20;
Label_MachineTypeResult.SetBinding(Label.ContentProperty, MachineBaseTypeBinding);
WrapPanel MachineTypeWrapPanel = new WrapPanel();
MachineTypeWrapPanel.Name = "MachineTypeWrapPanel";
MachineTypeWrapPanel.VerticalAlignment = System.Windows.VerticalAlignment.Top;
MachineTypeWrapPanel.Margin = new Thickness(2, 2, 2, 0);
MachineTypeWrapPanel.SetBinding(WrapPanel.BackgroundProperty, BgColorBinding);
MachineTypeWrapPanel.Children.Add(Label_MachineType);
MachineTypeWrapPanel.Children.Add(Label_MachineTypeResult);
My other bindings work fine, because I've just tied them to properties in code behind that implement property changed notification.
Trying to bind to any of the keys in my resources however, gives me nothing. The label's content is simply blank, and there are no errors in my debug output window.
I can't find any examples of anyone binding to their Properties.Resources.Whatever from code behind anywhere.
The solution:
Thanks Henka!
Binding GUI_MachineTypeBinding = new Binding("GUI_MachineType");
GUI_MachineTypeBinding.Source = Application.Current.FindResource("Resources");
....
Label_MachineType.SetBinding(Label.ContentProperty, GUI_MachineTypeBinding);
If you set the Binding from code behind the UI will not be notified you should create your custom extension and save a WeakReference to the DependencyProperty and update the value when the culture changed, i propose an other solution to use, have a look at this article.Advanced WPF Localization
I have the follow XAML:
<ContentControl HorizontalAlignment="Left" HorizontalContentAlignment="Left" Content="{Binding TotalReviewWordBlock}" Width="465" Margin="5,10,0,5" Foreground="#FF2D2D2D" Background="White"/>
and its binded to the following property:-
public StackPanel TotalReviewWordBlock
{
get
{
StackPanel st = new StackPanel();
st.Orientation = Orientation.Horizontal;
st.Background = new SolidColorBrush(Colors.White);
Paragraph pgf = new Paragraph();
Run r = new Run();
r.Text = App.Convert("Blah ");
r.FontWeight = FontWeights.Bold;
r.Foreground = new SolidColorBrush(CommonLib.rgbFromHexString("#FF2D2D2D"));
pgf.Inlines.Add(r);
int Rating = (int)(this.userrating * 2);
string ratingReplacement;
(some more code in the property itself...)
Run run = new Run();
run.Text = " " + this.myText;
run.Foreground = new SolidColorBrush(CommonLib.rgbFromHexString("#FF2D2D2D"));
pgf.Inlines.Add(run);
RichTextBox rtb = new RichTextBox();
rtb.TextWrapping = TextWrapping.Wrap;
rtb.Width = 450;
rtb.Blocks.Add(pgf);
st.Children.Add(rtb);
st.Background = new SolidColorBrush(Colors.White);
return st;
}
}
The problem is when the text is too much(say more that a 1000 character), or the height of the stackpanel is a lot, Its background becomes black. Its as if the stackpanel breaks) I noticed this earlier but at that time it was in a listbox and had multiple items to i simply made the width of each item 480, used blank grids instead of margins and it was "covered". But this time its just one big chunk of text(in a Paragraph). Let me know if you need ay other info. Please help!!
I worked around a similar "black stackpanel" problem by splitting the text into paragraphs to form a List<String>. And then that list of strings would be the ItemsSource of a ListBox.
So instead of a very large StackPanel, I ended up with a long ListBox.
I also prevented user interaction in the ListBox and vertical scroll by using IsHitTestVisible="False" and ScrollViewer.VerticalScrollBarVisibility="Disabled"
So, the ListBoxended up as follows:
<ListBox x:Name="listBox" IsHitTestVisible="False" ScrollViewer.VerticalScrollBarVisibility="Disabled">
<ListBox.ItemTemplate>
<DataTemplate>
<Border Background="White">
<TextBlock TextWrapping="Wrap" Text="{Binding}"/>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
And in code behind:
textSplitInParagraphs = new List<String>();
// add paragraphs to the list...
listBox.ItemsSource = textSplitInParagraphs;
Don't know if it is the correct workaround, but I helped me, after some time of banging my head against the table.
Hope this helps.
I am trying to fix a larger block of code written by previous colleague - it i some sort of report system, output is a table with data. My task was to freeze column headerson top when scrolling. As i am new to this, I made very simple table, to find out how datagrid works:
public MainWindow()
{
this.InitializeComponent();
var dt = new DataTable();
dt.Columns.Add("prvni");
dt.Columns.Add("druhy");
for (int i = 0; i < 100; i++)
{
var row = dt.NewRow();
row[0] = "A" + i;
row[1] = "B" + i;
dt.Rows.Add(row);
}
this.MainGrid.ItemsSource = dt.AsDataView();
}
By lots of searching, I found many topics, which recommended to get rid of ScrollViewer, as the freezed headers are in datagrid by default. This was the original part of code I modified:
var scrollViewer = new ScrollViewer()
{
HorizontalScrollBarVisibility = ScrollBarVisibility.Auto,
VerticalScrollBarVisibility = ScrollBarVisibility.Auto
};
scrollViewer.AddHandler(UIElement.MouseWheelEvent, new RoutedEventHandler(this.MouseWheelHandler), true);
var stackPanel = new StackPanel();
scrollViewer.Content = stackPanel;
...
return scrollViewer;
And in another function, it was used/called as:
var reportInfo = ((((sender as DataGrid).Parent as StackPanel).Parent as ScrollViewer).Parent as ReportOutputTabItem).Tag as ReportInfo;
Well - I removed the scrollviewer, and was returning it as StackPanel, however - now I cannot scroll at all. When I searched questions, how to add vertical scrolling to StackPanel, answers were "add ScrollViewer".
So - is there a way, how either make column headers freezed inside the ScrollViewer, or how to enable vertical scrolling in StackPanel without using scrollViewer? (and another possible solution might be to make the vertical size of StackPanel bit shorter, as there are mostly pages of results, but full page is still required to scroll a bit).
XAML part:
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TabControl Name="MainTab" SelectionChanged="MainTabSelectionChanged" ItemTemplate="{StaticResource ClosableTabItemTemplate}"/>
<StackPanel Grid.Row="1" Name="NavigationPanel" Orientation="Horizontal" HorizontalAlignment="Center">
<Button Height="23" Name="FirstButton" Width="40" Content="<<" Click="PageButtonClick" Opacity="0.75"/>
<Button Height="23" Name="PrevButton" Width="40" Click="PageButtonClick" Opacity="0.75" Content="<"/>
<Label Height="23" Name="PageNumberLabel" Width="70" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Content="1/1"/>
<Button Height="23" Name="NextButton" Width="40" Content=">" Click="PageButtonClick" Opacity="0.75"/>
<Button Height="23" Name="LastButton" Width="40" Click="PageButtonClick" Opacity="0.75" Content=">>"/>
</StackPanel>
Thanks in advance.
Well, I finally found solution to this:
Originally, the datagrid was wrapped in the StackPanel, and then in ScrollViewer. I removed the ScrollViewer, and replaces StackPanel with Grid.
Now I have both vertical scrollbars, and frozen column headers.
I removed the entire
var scrollViewer = new ScrollViewer()
{
HorizontalScrollBarVisibility = ScrollBarVisibility.Auto,
VerticalScrollBarVisibility = ScrollBarVisibility.Auto
};
scrollViewer.AddHandler(UIElement.MouseWheelEvent, new RoutedEventHandler(this.MouseWheelHandler), true);
var stackPanel = new StackPanel();
scrollViewer.Content = stackPanel;
and replaced with simple var grid = new Grid();
and all stackPanel.Children.Add(dataGrid); replaced with grid.Children.Add(dataGrid);
I'm developing a kind of Store or something, where I read an RSS Feed and display its content in a ListBox. The RSS Feed contains additional data (for example "download" or "customCategory") that I use (or want to use) to sort the results of the ListBox. The ListBox looks like this:
<ListBox Grid.Column="2" HorizontalAlignment="Stretch" Name="ItemsListParent" VerticalAlignment="Stretch" Margin="0,25,0,0">
<ItemsControl Name="ItemsList" ItemsSource="{Binding Source={StaticResource rssData}}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Name="itemElement" Orientation="Horizontal" Loaded="itemElement_Loaded">
<StackPanel.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0.15" />
<GradientStop Color="LightGray" Offset="0.85" />
<GradientStop Color="White" Offset="1" />
</LinearGradientBrush>
</StackPanel.Background>
<!--<Image Width="15" Margin="2" Source="{Binding XPath=url, Path=InnerText}"/>-->
<!--<TextBlock Margin="2" FontSize="16" VerticalAlignment="Center" Text="{Binding XPath=title}" FontWeight="Normal">
<Hyperlink Name="lnkGoToArticle" Tag="{Binding XPath=link, Path=InnerText}" Click="lnkGoToArticle_Click">
>>
</Hyperlink>
<Button Name="lnkDownload" Tag="{Binding XPath=download, Path=InnerText}" Style="{DynamicResource NoChromeButton}" Click="lnkDownload_Click">
<Image Source="Images/download31.png" Name="DownloadIcon" Width="30" Height="30" />
</Button>
</TextBlock>-->
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ListBox>
the code in
<!-- -->
is what I rewrote to C#, as I thought I can figure out how to sort the XML. The point is, that I've created
void UpdateListBox()
{
ItemsList.Items.Clear();
selected = (string)CategoriesList.SelectedItem;
//if (selected==xmldp
/*System.Xml.XmlDocument data = new System.Xml.XmlDocument();
data.Load(#"http://www.andystore.bluefile.cz/?feed=rss2");
xmldp.Document = data;
xmldp.XPath = "//item";*/
Thickness mrg = new Thickness();
mrg.Left = 2;
mrg.Right = 2;
mrg.Top = 2;
mrg.Bottom = 2;
TextBlock itemTitle=new TextBlock();
itemTitle.Margin=mrg;
itemTitle.FontSize=16;
itemTitle.VerticalAlignment = VerticalAlignment.Center;
itemTitle.Text = "{Binding XPath=title}";
itemTitle.FontWeight = FontWeights.Normal;
itemTitle.Name="itemTitle";
Binding itemTitleBinding=new Binding();
itemTitleBinding.XPath="title";
itemTitle.SetBinding(TextBlock.TextProperty,itemTitleBinding);
itemElement.Children.Add(itemTitle);
itemElement.RegisterName(itemTitle.Name, itemTitle);
Label gta = new Label();
Hyperlink goToArticle = new Hyperlink();
goToArticle.Click += new RoutedEventHandler(lnkGoToArticle_Click);
goToArticle.Inlines.Add(#">>");
Binding goToArticleBinding = new Binding();
goToArticleBinding.Path = new PropertyPath("InnerText");
goToArticleBinding.XPath = "link";
goToArticle.SetBinding(Hyperlink.TagProperty, goToArticleBinding);
gta.Content = goToArticle;
itemElement.Children.Add(gta);
itemElement.RegisterName(goToArticle.Name, goToArticle);
Button downloadButton = new Button();
downloadButton.Name = "lnkDownload";
downloadButton.Cursor = Cursors.Hand;
downloadButton.Click += new RoutedEventHandler(lnkDownload_Click);
Binding downloadButtonBinding = new Binding();
downloadButtonBinding.XPath = "download";
downloadButtonBinding.Path = new PropertyPath("InnerText");
downloadButton.SetBinding(Button.TagProperty, downloadButtonBinding);
Style downloadButtonStyle = this.FindResource("NoChromeButton") as Style;
downloadButton.Style = downloadButtonStyle;
BitmapImage dbiBitmap = new BitmapImage();
dbiBitmap.BeginInit();
dbiBitmap.UriSource = new Uri("pack://application:,,,/AndyLaunchWPF;component/Images/download31.png");
dbiBitmap.EndInit();
Image dbi = new Image();
dbi.Width = 30;
dbi.Height = 30;
dbi.Name = "downloadIcon";
dbi.Source = dbiBitmap;
downloadButton.Content = dbi;
itemElement.Children.Add(downloadButton);
itemElement.RegisterName(downloadButton.Name, downloadButton);
//itemElement.Children.Add(dbi);
//itemElement.RegisterName(dbi.Name, dbi);
}
but it completes the whole listbox (as before in wpf code) without repeating the calling!! I wanted to add somekind of condition for sorting such as if(xmldp.IDontKnowTheExactName==selectedCategory){display the textblock} else {do not display it and go to next item in XML} but i really dont know how to do it. Please be patient with me, as i am new to WPF and this is also my first question. In the case that you didn't really got what I'm trying to achieve, here is a simple list:
1) I want to load the XML and display all it's items in ItemsList
2) I want to select an item in the ListBox called categoriesList and based on the selection update ItemsList to display only items that have their customCategory==selected (selected is a string that will be updated depending on the categoriesList selection)
Problem is, I dont know where to put the condition, nor how it should look like and if it's even possible.
Hope you understood and you are able to help me.
Thanks for any answer ;) Andy
OK forget constructing the view via code, that's not how WPF is supposed to work. Go back to your original xaml template.
Now the problem you have is that you want to sort and filter the items in the ItemsControl. To do this you need to bind the ItemsSource of the ItemsControl to a CollectionView based on the rssFeed, instead of binding to the rssFeed itself.
CollectionView allows you to easily sort and filter collections.
By the way, you appear to have a redundant ListBox in your XAML. It's not doing anything since you are declaring an ItemsControl inside it. ListBox already derives from ItemsControl.
If you want a scrollbar then just use the ListBox.
Well, this might be a strange question. But as title says, can you add Grid to ContainerVisual. Since Grid inherits Visual, I should be able to do it via Children.Add.
Why do I need this? Well, I'm using FlowDocument to print a report. This report needs to have a header, and since Flow Document doesn't support Headers, I decided to add headers during pagination, by using a solution found on the internet.
Also since I don't want to draw entire header by hand but be able to edit it during desing in a designer, I designed it in a separate file as a Grid element.
So my header looks something (I shortened it) like this:
<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="2cm" Width="18.7cm">
<Grid.Resources>
<!-- some resources -->
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2cm"/>
<ColumnDefinition/>
<ColumnDefinition Width="2cm"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Border Grid.RowSpan="2">
<Image Source="Logo.jpg"/>
</Border>
<Border Grid.Column="1" Grid.RowSpan="2">
<StackPanel>
<Label Name="staje" Style="{DynamicResource naslov}"></Label>
<Label Name="predmet" Style="{DynamicResource naslov}"></Label>
</StackPanel>
</Border>
<Border Grid.Column="2" BorderThickness="1">
<StackPanel>
<TextBlock>Datum:</TextBlock>
<Label Name="datum">22. 12. 2013.</Label>
</StackPanel>
</Border>
<Border Grid.Column="2" Grid.Row="1" BorderThickness="1,0,1,1">
<StackPanel>
<TextBlock>Strana:</TextBlock>
<Label Name="strana">
1/2
</Label>
</StackPanel>
</Border>
</Grid>
at each pagination call I load the header using the folowing code:
public FrameworkElement GetHeaderForPage(int Strana)
{
FrameworkElement header = Application.LoadComponent(new Uri("/Header.xaml", UriKind.Relative)) as FrameworkElement;
Label lblTest = LogicalTreeHelper.FindLogicalNode(header, "staje") as Label;
Label lblPredmet = LogicalTreeHelper.FindLogicalNode(header, "predmet") as Label;
Label lblDatum = LogicalTreeHelper.FindLogicalNode(header, "datum") as Label;
Label lblStrana = LogicalTreeHelper.FindLogicalNode(header, "strana") as Label;
lblTest.Content = KakavTest;
lblPredmet.Content = Predmet;
lblDatum.Content = Datum;
lblStrana.Content = string.Format("{0}", Strana);
return header;
}
And finally in the pagination call I place it in the page like so:
DocumentPage page = m_Paginator.GetPage(pageNumber);
// Create a wrapper visual for transformation and add extras
ContainerVisual newpage = new ContainerVisual();
FrameworkElement header = headerGen.GetHeaderForPage(pageNumber);
// header.RenderTransform = new TranslateTransform(0, -header.ActualHeight+10);
ContainerVisual smallerPage = new ContainerVisual();
smallerPage.Children.Add(page.Visual);
//smallerPage.Transform = new MatrixTransform(0.95, 0, 0, 0.95,
// 0.025 * page.ContentBox.Width, 0.025 * page.ContentBox.Height);
newpage.Children.Add(smallerPage);
newpage.Children.Add(header);
newpage.Transform = new TranslateTransform(m_Margin.Left, m_Margin.Top);
RenderTargetBitmap bmp = new RenderTargetBitmap((int)m_PageSize.Width, (int)m_PageSize.Height, 96, 96, PixelFormats.Default);
bmp.Render(newpage);
ImageShow show = new ImageShow(bmp);
show.Show();
return new DocumentPage(newpage, m_PageSize, Move(page.BleedBox), Move(page.ContentBox));
ImageShow class simply opens up new window with an image representing bmp. I was using it to see if the problem was in further processing that is done to display the pages in DocumentViewer. But since ImageShow doesn't display the header Grid, it seems tht I'm doing something terribly wrong.
IN SHORT:
Can you add Grid element to ContainerVisual as a child and have it be drawn correctly. Or do I need to draw it by hand?
In the end I hard coded it all by hand. So no, anything that is higher than VIsual and DrawingVisual, can not be included into ContainerVisual.