Re: Making a template for a ListView in WPF ? - WPF Discussion Boards

Making a template for a ListView in WPF ?

25-Apr-09 6:58

You don't need a converter if the property binded to is the right type.

In WPF, "Image" is a UIElement, not the actual image data.
For binding to Image.Source, the bound-to type should be System.Windows.Media.ImageSource
(or derived).

Here's an example, using an imagesource for a JPEG image added to the project
as a resource:

public class WorkTrayItem
{
    public ImageSource WindowImage { get; set; }

    public WorkTrayItem(...)
    {
        WindowImage = new BitmapImage(new Uri(@"pack://application:,,,/Images/someimageresource.jpg", UriKind.RelativeOrAbsolute));
    }
}

Now, in your template, if you bind your Image.Source to WindowImage

<Image Margin="3" Source="{Binding WindowImage}"/>

you should see your image.

Mark Salsbery
Microsoft MVP - Visual C++
Java | [Coffee]

Mohammad Dayyan23-Apr-09 4:55

23-Apr-09 4:55

Hi.
I'm going to create a ListView template. But when I've done it , I can't add items into the ListView !!!
I think , I don't do in correct way.

Could you guide me , how we can create a template for a ListView ?
Thanks.

Mark Salsbery23-Apr-09 7:04

23-Apr-09 7:04

Can you post a simple example of your ListView and template code?

And how are you trying to add items?

Mark

Mark Salsbery
Microsoft MVP - Visual C++
Java | [Coffee]

Mohammad Dayyan23-Apr-09 7:21

23-Apr-09 7:21

Mark Salsbery wrote:
Can you post a simple example of your ListView and template code?

Sure. this is the XAML of my template :

<ControlTemplate x:Key=<span style="color:#A31515;">"ListViewTemplate"</span> TargetType=<span style="color:#A31515;">"{x:Type ListView}"</span>>
    <StackPanel Orientation=<span style="color:#A31515;">"Horizontal"</span>>
        <StackPanel>
            <GridViewColumnHeader Content=<span style="color:#A31515;">"Icon"</span> x:Name=<span style="color:#A31515;">"Icon"</span> MinWidth=<span style="color:#A31515;">"34"</span>/>
            <ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
        </StackPanel>
        <StackPanel>
            <GridViewColumnHeader Content=<span style="color:#A31515;">"Title"</span> x:Name=<span style="color:#A31515;">"Title"</span> MinWidth=<span style="color:#A31515;">"85"</span>/>
            <ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
        </StackPanel>
        <StackPanel>
            <GridViewColumnHeader Content=<span style="color:#A31515;">"Username"</span> x:Name=<span style="color:#A31515;">"Username"</span> MinWidth=<span style="color:#A31515;">"80"</span>/>
            <ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
        </StackPanel>
        <StackPanel>
            <GridViewColumnHeader Content=<span style="color:#A31515;">"Password"</span> x:Name=<span style="color:#A31515;">"Password"</span> MinWidth=<span style="color:#A31515;">"80"</span>/>
            <ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
        </StackPanel>
        <StackPanel>
            <GridViewColumnHeader Content=<span style="color:#A31515;">"URL"</span> x:Name=<span style="color:#A31515;">"url"</span> MinWidth=<span style="color:#A31515;">"160"</span>/>
            <ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
        </StackPanel>
    </StackPanel>
</ControlTemplate>

Mark Salsbery wrote:
And how are you trying to add items?

listview.Items.Add("an item");

Mark Salsbery23-Apr-09 7:55

23-Apr-09 7:55

Your template doesn't have a place to display the added items.

Maybe try something like this:

<ListView Name="listview" >
    <ListView.View>
        <GridView AllowsColumnReorder="False" >
            <GridViewColumn Header="Icon" Width="34" ></GridViewColumn> <!--DisplayMemberBinding="{Binding Path=...}"-->
            <GridViewColumn Header="Title" Width="85" ></GridViewColumn>
            <GridViewColumn Header="Username" Width="80" ></GridViewColumn>
            <GridViewColumn Header="Password" Width="80" ></GridViewColumn>
            <GridViewColumn Header="URL" Width="160" ></GridViewColumn>
        </GridView>
    </ListView.View>
</ListView>

Mark Salsbery
Microsoft MVP - Visual C++
Java | [Coffee]

Mohammad Dayyan23-Apr-09 8:13

23-Apr-09 8:13

Thanks Mark, but we can't use ListView tag within ControlTemplate tag !!!
Isn't it ?

Mark Salsbery23-Apr-09 8:29

23-Apr-09 8:29

Sure - you can re template the control, but you need to provide
the items presenter to show the items.

Here's a default template for a ListView you can use as a starting place:

<SolidColorBrush x:Key="ListBorder" Color="#828790"/>
<Style x:Key="ListViewStyle1" TargetType="{x:Type ListView}">
    <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
    <Setter Property="BorderBrush" Value="{StaticResource ListBorder}"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ListView}">
                <Border x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="1">
                    <ScrollViewer Padding="{TemplateBinding Padding}" Focusable="false">
                        <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                    </ScrollViewer>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
                    </Trigger>
                    <Trigger Property="IsGrouping" Value="true">
                        <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Mark Salsbery
Microsoft MVP - Visual C++
Java | [Coffee]

Mohammad Dayyan23-Apr-09 8:45

23-Apr-09 8:45

The link wasn't helpful .
I've used ItemsPresenter

binding problem

spurnd22-Apr-09 21:48

spurnd

22-Apr-09 21:48

i have a problem with binden 2 controls. one is in the headertemplate and the other one is in the celltemplate. as you can see i have a checkbox(x:Name="chboCheckAll") in my headertemplate and the other checkbox is in the celltemplate(x:Name="chboCheckOld"). what i want is that when i check the checkbox in my headertemplate the checkbox in my celltemplate gets update with the value in the headertemplate. how can i achieve this?? thank you for the help

<my:DataGridTemplateColumn>
<my:DataGridTemplateColumn.HeaderTemplate >
<DataTemplate>
<Border x:Name="border">
<Grid x:Name="grid">
<CheckBox x:Name="chboCheckAll" Grid.Column="1" IsChecked="True"></CheckBox>
</Grid>
</Border>
</DataTemplate>
</my:DataGridTemplateColumn.HeaderTemplate>
<my:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<CheckBox x:Name="chboCheckOld" Content="{Binding Path=Old}" IsChecked="{Binding ElementName=chboCheckAll, Path=IsChecked}></CheckBox>
</StackPanel>
</DataTemplate>
</my:DataGridTemplateColumn.CellTemplate>
</my:DataGridTemplateColumn>

Re: binding problem

Pete O'Hanlon23-Apr-09 0:28

23-Apr-09 0:28

If I was doing this, I'd normally update the model behind this, and let binding update the checkboxes rather than specifically update the checkboxes.

"WPF has many lovers. It's a veritable porn star!" - Josh Smith

As Braveheart once said, "You can take our freedom but you'll never take our Hobnobs!" - Martin Hughes.

Re: binding problem

User 171649223-Apr-09 1:25

User 1716492

23-Apr-09 1:25

Congrats Pete. Saw your article in yesterday's "UK MSDN Flash". Thumbs Up | :thumbsup:

modified 1-Aug-19 21:02pm.

Re: binding problem

Pete O'Hanlon23-Apr-09 1:42

23-Apr-09 1:42

Thanks for that. It was a real problem keeping an article I'm passionate about down to 500 words. There was a severe amount of pruning involved.

"WPF has many lovers. It's a veritable porn star!" - Josh Smith

As Braveheart once said, "You can take our freedom but you'll never take our Hobnobs!" - Martin Hughes.

Print Datatable

Prajeesh22-Apr-09 19:06

Prajeesh

22-Apr-09 19:06

Hi,

I have a datatable as

DataTable dt = new DataTable( "Table1" );
dt.Columns.Add( "c1" );
dt.Columns.Add( "c2" );
dt.Columns.Add( "c3" );
DataRow dr = dt.NewRow();
dr["c1"] = "100";
dr["c2"] = "100";
dr["c3"] = "100";
dt.Rows.Add( dr );
dt.AcceptChanges();
printListView.DataContext = dt;

I have also a listview for showing the table.
<ListView
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
SelectionMode="Single"
ItemsSource="{Binding}"
Name="printListView"
Margin="10">
<ListView.View>
<GridView>
<GridViewColumn Header="c1" DisplayMemberBinding="{Binding c1}"/>
<GridViewColumn Header="c2" DisplayMemberBinding="{Binding c2}"/>
<GridViewColumn Header="c3" DisplayMemberBinding="{Binding c3}"/>
</GridView>
</ListView.View>
</ListView>

How can I print this table?

Thanks
Prajeesh Prabhakar

Re: Print Datatable

Pete O'Hanlon23-Apr-09 22:17

23-Apr-09 22:17

What I would do is create a FixedDocument which contains a Table that uses the datasource that you are using here, rather than using a ListView. Then, you use a DocumentPaginator and use this with PrintDialog.PrintDocument.

"WPF has many lovers. It's a veritable porn star!" - Josh Smith

As Braveheart once said, "You can take our freedom but you'll never take our Hobnobs!" - Martin Hughes.

WPF UserControl Library - I'm at a loss [modified]

#realJSOP22-Apr-09 3:58

#realJSOP

22-Apr-09 3:58

How do you change the protection level of a control within a usercontrol when said usercontrol is in a WPF usercontrol library?

In my solution, I have a a WPF UserControl library project that contains several UserControl objects.

Ive got a WPF Application project that contains a window object that uses two user controls - one is a toolbar (in the library project), and the other is a general content control in the application project.

I'm trying to add a button handler for a toolbar button. Because the controls inside a user control are all marked as "internal", I can't add a button handler in the "code behind" (what a stupid f*ckin way to have to say "real goddamn code", but I gigress).

So how do I accomplish what I want if all the frakking controls are internal?

modified on Wednesday, April 22, 2009 10:20 AM

barker77022-Apr-09 6:06

barker770

22-Apr-09 6:06

You probably want your toolbar button to be bound to a command:

Open...

If it is a standard command, such as file open, use the commands provided by the ApplicationCommands class as shown above. If not, create and register your own new command (must be static).

In your app code, bind a method to that command. That method will get called when the command "is raised". It's just like registering for an event, with one level of decoupling.

This "decoupling" between the UI and the rest of the app is a key idea of WPF. In WPF, you should not be directly linking to event handlers of a specific button. By using a command, the UI can be changed from a button to some other control type, and the command is still the same. If you wiered up directly to the event handler, then if you change the button to another type, you would have to find all places that event was being handled, and then change the event handler signature.

I've only been using WPF for about 2 months, and I share your frustration. You must see the WPF light Wink | ;-)

resistance is futile...

Mitch

led mike23-Apr-09 10:00

led mike

23-Apr-09 10:00

barker770 wrote:
This "decoupling" between the UI and the rest of the app is a key idea of WPF

Are you sure? We've been doing that for years before WPF came along. I thought there was more to it than that.

barker770 wrote:
You must see the WPF light

You could have used a CP Holy Grail Smiley right about then eh? Wink | ;)

Pete O'Hanlon23-Apr-09 0:16

23-Apr-09 0:16

John - you can change the visibility of controls by specifying a FieldModifier, e.g. x:FieldModifier="public".

"WPF has many lovers. It's a veritable porn star!" - Josh Smith

As Braveheart once said, "You can take our freedom but you'll never take our Hobnobs!" - Martin Hughes.

#realJSOP23-Apr-09 2:45

#realJSOP

23-Apr-09 2:45

Yeah, I found that out, but somehow it didn't seem to be the "WPF way". The guy before you posted what I think might be the "WPF way". Have I mentioned how badly WPF sucks yet today?

Michael Bookatz23-Apr-09 4:34

Michael Bookatz

23-Apr-09 4:34

John Simmons / outlaw programmer wrote:
Have I mentioned how badly WPF sucks yet today

I don't think you have at least not enough. I think you're starting to get into a love\ hate relationship with it. Just ask it out on a date already!!!

#realJSOP23-Apr-09 4:56

#realJSOP

23-Apr-09 4:56

I actually do love hating it because in my own way, I'm justified in hating it.

led mike23-Apr-09 10:05

led mike

23-Apr-09 10:05

John Simmons / outlaw programmer wrote:
Have I mentioned how badly WPF sucks yet today?

I'm still standing on the sidelines watching. Sort of like the jury is still out, you know? I mean the historical perspective on WPF could end up being, "The best implementation of a bad idea ever". Of course there can be no doubt that my perspective will be proved wrong one day when computers just do what we want them to do without us having to tell them what to do. $Shucks | :-\$ Jig | [Dance]