davidpoll's printcollection - silverlight

I'm trying to use David Poll's printcollection control, from the SLaB project- www.davidpoll.com but for some reason no items get shown. Maybe it's something with my itemtemplate, please have a look at this:
<Style x:Key="PrintStyle"
TargetType="SLaB:CollectionPrinter">
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<Grid>
<sdk:Label x:Name="lblTitle" HorizontalAlignment="Left" Margin="0,8,0,0" VerticalAlignment="Top" Content="{Binding Source={StaticResource ResourceWrapper}, Path=NoteEditorResources.Title}"/>
<sdk:Label x:Name="lblTitleResult" HorizontalAlignment="Left" Margin="42,8,0,0" VerticalAlignment="Top" Content="{Binding Path=Title}"/>
<sdk:Label x:Name="lblDateCreated" HorizontalAlignment="Right" Margin="0,8,156,0" VerticalAlignment="Top" Content="{Binding Source={StaticResource ResourceWrapper}, Path=NoteEditorResources.DateCreated}"/>
<sdk:Label x:Name="lblDateCreatedResult" HorizontalAlignment="Right" Margin="0,8,113,0" VerticalAlignment="Top" Content="{Binding Path=DateCreated}"/>
<RichTextBox x:Name="rtbContent" Margin="0,28,0,8" Width="582" Xaml="{Binding Content}" />
</Grid>
</DataTemplate>
</Setter.Value>
</Setter>
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel HorizontalAlignment="Stretch">
<StackPanel HorizontalAlignment="Right"
Orientation="Horizontal">
<TextBlock Text="{Binding CurrentPage, StringFormat='{}Page {0} '}" />
<TextBlock Text="{Binding PageCount, StringFormat='{}/ {0}'}" />
</StackPanel>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
<Setter Property="FooterTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel HorizontalAlignment="Center"
Orientation="Horizontal">
<TextBlock Text="{Binding FirstItemValue.Name}" />
<TextBlock Text=" - " />
<TextBlock Text="{Binding LastItemValue.Name}" />
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>

I've used his printing control, but I never modified the itemtemplate. I used his TestPrinter.xaml as a template and filled in the HeaderTemplate, FooterTemplate, and the BodyTemplate with my code.
The BodyTemplate being the important one to take a look at. Here is the BodyTemplate section from his example:
<Printing:CollectionPrinter.BodyTemplate>
<DataTemplate>
<sdk:DataGrid ItemsSource="{Binding CurrentItems}"
AutoGenerateColumns="False"
VerticalScrollBarVisibility="Disabled">
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Binding="{Binding Name}"
Header="Name" />
<sdk:DataGridTextColumn Binding="{Binding Address}"
Header="Address" />
<sdk:DataGridTextColumn Binding="{Binding Age}"
Header="Age" />
</sdk:DataGrid.Columns>
</sdk:DataGrid>
</DataTemplate>
</Printing:CollectionPrinter.BodyTemplate>
The important thing is to set the CurrentItems as the source for your control that will be used to display your collection. This way it can automatically calculate how many items to display in the page before they cut off.

Related

How to hide field based on condition check in wpf?

I am trying to hide the Textbox inside the list view based on a condition.
<ListView Margin="0" Name="lvAccessPoints" Background="#ff1d1d1d" Grid.Row="1" BorderThickness="0">
<ListView.ItemTemplate>
<DataTemplate>
<WrapPanel>
<iconPacks:PackIconModern Kind="ConnectionWifi" Foreground="White" Width="30" Height="30"/>
<TextBlock Text="{Binding Name}" FontWeight="Bold" Foreground="White" Padding="10,0" FontSize="15" VerticalAlignment="Center"/>
<TextBox HorizontalAlignment="Left"
Height="23"
Margin="10,10,0,0"
TextWrapping="Wrap"
Text=""
VerticalAlignment="Top"
Width="120"
TextChanged="TextBox_TextChanged"
Visibility="{Binding Name!=SelectedItem.Name ? Hidden : Visible}"/>
<Button Click="Button_Click_2"></Button>
</WrapPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I am trying like this , and its not seems to be the right way, what i want is when the particular name in the loop matches the selected items name, then only TextBox should show.
What I am doing wrong?
These kind of expressions are not supported in XAML:
Visibility="{Binding Name!=SelectedItem.Name ? Hidden : Visible}"
What you could do is to define a DataTrigger in your DataTemplate that sets the Visibility property of the TextBox to Visible when the parent ListViewItem is selected:
<ListView Margin="0" Name="lvAccessPoints" Background="#ff1d1d1d" Grid.Row="1" BorderThickness="0">
<ListView.ItemTemplate>
<DataTemplate>
<WrapPanel>
<iconPacks:PackIconModern Kind="ConnectionWifi" Foreground="White" Width="30" Height="30"/>
<TextBlock Text="{Binding Name}" FontWeight="Bold" Foreground="White" Padding="10,0" FontSize="15" VerticalAlignment="Center"/>
<TextBox HorizontalAlignment="Left"
x:Name="txt"
Height="23"
Margin="10,10,0,0"
TextWrapping="Wrap"
Text=""
VerticalAlignment="Top"
Width="120"
TextChanged="TextBox_TextChanged"
Visibility="Hidden"/>
<Button Click="Button_Click_2"></Button>
</WrapPanel>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource FindAncestor, AncestorType=ListViewItem}}" Value="True">
<Setter TargetName="txt" Property="Visibility" Value="Visible" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

wpf ListBox looks like datagrid?

I have a listbox control in my app.
I want to change his style to being look like to Datagrid (borders, columns, row...).
I don't want to using stantard datagrid - because its control cannot binding itemtemplte.
I trying to do it:
<ListBox
ItemsSource="{Binding Items}"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
Name="listBox1"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Border BorderThickness="1" BorderBrush="Black">
<TextBlock Text="{Binding Id}" Margin="5"/>
</Border>
<Border BorderThickness="1" BorderBrush="Black">
<TextBlock Text="{Binding Name}" Margin="5"/>
</Border>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
But it not looking good - as following:
it what i want to achieve:
Using Grid.IsSharedSizeScope
result
i believe you want the columns to be re-sized based on your string length, so Grid.IsSharedSizeScope is your choice here
example xaml
<ListBox ItemsSource="{Binding Items}"
Grid.IsSharedSizeScope="True">
<ListBox.Resources>
<Style TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<ContentPresenter />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.Resources>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="name" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Border BorderThickness="1"
BorderBrush="Black">
<TextBlock Text="{Binding Name}"
Margin="5" />
</Border>
<Border BorderThickness="1"
Grid.Column="1"
BorderBrush="Black">
<TextBlock Text="{Binding Id}"
Margin="5" />
</Border>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
if you move SharedSizeGroup to id like below
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition SharedSizeGroup="id" />
</Grid.ColumnDefinitions>
result
Using ListView with GridView
You have an option to use list view with grid view which will have same appearance as grid with flexibility of list
eg
<ListView ItemsSource="{Binding SourceItems}">
<ListView.View>
<GridView>
<GridViewColumn Header="Column1"
DisplayMemberBinding="{Binding Column1}" />
<GridViewColumn Header="Column2"
DisplayMemberBinding="{Binding Column2}" />
</GridView>
</ListView.View>
</ListView>
GridViewColumn offers you to modify CellTemplate, HeaderTemplate, HeaderContainerStyle, HeaderStringFormat etc.
I am sure you can achieve this using a grid control (It supports binding and everything else)
To fix your problem, you will have to give fixed widths to both your borders inside your stackpanel then your listbox items will look like a grid control.
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Border Width="150" BorderThickness="1" BorderBrush="Black">
<TextBlock Text="{Binding Id}" Margin="5"/>
</Border>
<Border Width="50" BorderThickness="1" BorderBrush="Black">
<TextBlock Text="{Binding Name}" Margin="5"/>
</Border>
</StackPanel>
Please let us know what problem you are having with GridControl and maybe we can fix that as well
Edit. If you were using a DataGrid your template would look like
<DataGrid ItemsSource="{Binding Items}" AutoGenerateColumns="False" HeadersVisibility="None">
<DataGrid.Columns>
<DataGridTemplateColumn Header="" Width="SizeToCells" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text={Binding Id}/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="" Width="SizeToCells" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text={Binding Name}/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
Please note that I have set HeaderVisibility to false so that it doesnt look like a datagrid but instead looks like a list

Dynamically set a property in an Item Template

I set an image path of an Image in a StackPanel used in a GroupItem using the following resource (which as is works fine):
<Style x:Key="GroupHeaderStyle" TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type GroupItem}">
<Expander Name="expander" IsExpanded="True" >
<Expander.Header>
<StackPanel Orientation="Horizontal">
<Image Source="pack://application:,,,/Resources/History.ico" Margin="2,0"
Width="18" Height="18" ></Image>
<TextBlock Text="{Binding Name}" Padding="2,0"/>
</StackPanel>
</Expander.Header>
<ItemsPresenter />
</Expander>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Which is used in this DataGrid:
<DataGrid Name="JobHistory" CanUserAddRows="False" AutoGenerateColumns="False" ColumnWidth="*"
CanUserDeleteRows="False" ItemsSource="{Binding}" Grid.Row="2"
Grid.ColumnSpan="5" CanUserResizeRows="False"
Grid.RowSpan="2" IsTextSearchEnabled="True" VerticalScrollBarVisibility="Visible" >
<DataGrid.GroupStyle>
<GroupStyle ContainerStyle="{StaticResource GroupHeaderStyle}">
<GroupStyle.Panel>
<ItemsPanelTemplate>
<DataGridRowsPresenter/>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</DataGrid.GroupStyle>
<DataGrid.Columns>
<DataGridTemplateColumn Header="Status" Width="Auto" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Image Source="{Binding ResultImagePath}" Height="18" Width="18"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTextColumn Header="Job description" Binding="{Binding JobDescription}"/>
</DataGrid.Columns>
</DataGrid>
The DataView is grouped via this code:
ListCollectionView collection = new ListCollectionView(JobData);
collection.GroupDescriptions.Add(new PropertyGroupDescription("Name"));
JobHistory.ItemsSource = collection;
My Question: How can I dynamically set the image Source in the StackPanel?
<StackPanel Orientation="Horizontal">
<Image Source="pack://application:,,,/Resources/History.ico" Margin="2,0"
Width="18" Height="18" ></Image>
<TextBlock Text="{Binding Name}" Padding="2,0"/>
</StackPanel>
Edit 1:
Using:
<UserControl.Resources>
<Image x:Key="image" Source="pack://application:,,,/Resources/History.ico" Height="18" Width="18" Margin="2,0"/>
</UserControl.Resources>
<StackPanel Orientation="Horizontal">
<ContentControl Content="{StaticResource ResourceKey=image}"/>
Width="18" Height="18" ></Image>
<TextBlock Text="{Binding Name}" Padding="2,0"/>
</StackPanel>
as user2760623 suggested works.
My Problem however remains. At any given time I have multiple rows grouped by "Name". There can also be several different Groups. Depending on the Jobs current Status, I would like to Change the Image in the GroupItem Header. So how do I figure out which header is the "right" Header, and how do I manipulate exactly that one single Header?
Put the image source as a dynamic resource, and then you can change it. Just do the following:
Define the namespace - xmlns:clr="clr-namespace:System;assembly=mscorlib".
Add as resource - <clr:String x:Key="imageSource" >the path...</clr:String>.
And the image itself - <Image Source="{DynamicResource ResourceKey=imageSource}".
And when you want to change it - this.Resources["imageSource"] = "another path...".
You can also do the same concept just put the whole image as a resource (instead of just the image path), than you don't need to add the namespace (number 1 above). And put it as a Content of a ContentControl -
<ContentControl Content="{StaticResource ResourceKey=image}"/>.

How to Increase the Height of Silverlight Datagrid Header

I am new to silver Light. How to Increase the Height of Silverlight Datagrid Header
I am using template column
Code as follows :
<sdk:DataGridTemplateColumn Header="Base Receipt">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Grid>
<sdk:Label Margin="5,0,5,0" Height="25" VerticalAlignment="Center"/>
</Grid>
</DataTemplate>
</sdk:DataGridTemplateColumn>
You can use HeaderStyle :
<sdk:DataGridTemplateColumn Header="Base Receipt">
<sdk:DataGridTemplateColumn.HeaderStyle>
<Style TargetType="sdk:DataGridColumnHeader">
<Setter Property="Height" Value="50" />
</Style>
</sdk:DataGridTemplateColumn.HeaderStyle>
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Grid>
<sdk:Label Margin="5,0,5,0" Height="25" VerticalAlignment="Center"/>
</Grid>
</DataTemplate>
</sdk:DataGridTemplateColumn>

Changing ContentTemplate based on ListBox selection

I have a Listbox and a Border in a StackPanel similar to the following:
<StackPanel Orientation="Horizontal">
<ListBox>
<ListBoxItem Content="People"/>
<ListBoxItem Content="Animals"/>
<ListBoxItem Content="Cars"/>
</ListBox>
<Border Width="200>
<ContentPresenter/>
</Border>
</StackPanel>
When selecting an item in the listbox I would like to change the content in the ContentPresenter accordingly e.g. selecting People would change the template to display a series of input fields related to people where as selecting Animals would display a series of fields related to Animals etc. - the behavior of this would be akin to a TabControl.
I think I can achieve this with a DataTrigger which changes the DataTemplate in the Border but I'm not sure how to achieve this.
Any pointers?
Thanks
You can toggle the ContentTemplate using a DataTrigger as follows.
Note, that I am binding an ObservableCollection to a simple object (Thing) with one property called Name, and am I binding the Content of the ContentControl to the SelectedItem in the ListBox using a ViewModel.
<Grid>
<Grid.Resources>
<local:MultiValueConverter x:Key="con" />
<DataTemplate x:Key="PeopleTemplate">
<StackPanel Orientation="Horizontal">
<Label Margin="0,0,5,0" Content="People Name" HorizontalAlignment="Left" Grid.Column="0" />
<TextBox Grid.Column="1" Width="100" Height="25"></TextBox>
<Button Content="OK" Grid.Column="2" />
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="AnimalsTemplate">
<StackPanel Orientation="Horizontal">
<Label Margin="0,0,5,0" Content="Animal Name" HorizontalAlignment="Left" Grid.Column="0" />
<TextBox Grid.Column="1" Width="100" Height="25"></TextBox>
<Button Content="OK" Grid.Column="2" />
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="CarsTemplate">
<StackPanel Orientation="Horizontal">
<Label Margin="0,0,5,0" Content="Car Name" HorizontalAlignment="Left" Grid.Column="0" />
<TextBox Grid.Column="1" Width="100" Height="25"></TextBox>
<Button Content="OK" Grid.Column="2" />
</StackPanel>
</DataTemplate>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal">
<ListBox ItemsSource="{Binding Things}" SelectedItem="{Binding SelectedThing}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0" Orientation="Horizontal">
<TextBlock Padding="5" Text="{Binding Name}" Margin="0"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Border Width="200">
<ContentControl Content="{Binding SelectedThing}">
<ContentControl.ContentTemplate>
<DataTemplate>
<ContentControl Name="cc"
Content="{Binding}"
ContentTemplate="{StaticResource PeopleTemplate}" />
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Path=Name}" Value="People">
<Setter TargetName="cc"
Property="ContentTemplate"
Value="{StaticResource PeopleTemplate}" />
</DataTrigger>
<DataTrigger Binding="{Binding Path=Name}" Value="Animals">
<Setter TargetName="cc"
Property="ContentTemplate"
Value="{StaticResource AnimalsTemplate}" />
</DataTrigger>
<DataTrigger Binding="{Binding Path=Name}" Value="Cars">
<Setter TargetName="cc"
Property="ContentTemplate"
Value="{StaticResource CarsTemplate}" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ContentControl.ContentTemplate>
</ContentControl>
</Border>
</StackPanel>
<Grid>
Here is the Thing class:
public class Thing
{
public Thing(String name)
{
this.Name = name;
}
public String Name { get; set; }
public static ObservableCollection<Thing> GetThingList()
{
return new ObservableCollection<Thing>(new Thing[3] {
new Thing("People"),
new Thing("Animals"),
new Thing("Cars")
});
}
}

Resources