Images in listview WPF

Question

3.00/5 (3 votes)

See more:

I want to show all files from a given path, including the icon images or better yet, how can I arrange when should be shown which image ?
As you can see in the list below, there is a word icon for every item in the list (.pdf, .doc, .zip)

Link to image file (this is where i stopped)

Posted 1-Aug-12 6:01am

ArminA88

Updated 1-Aug-12 6:03am

v3

Add a Solution

4 solutions

Solution 1

Ive answerd a simular question yesterday, and you can see it here:
WPF ObservableCollection problem[^]

That was however just for the Image (Icon in your case), MAke one more property in the ImageDAta Class were the name of the file is displayed and you should have a working sample.

Happy coding :)

Posted 1-Aug-12 6:12am

Kenneth Haugland

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Clifford Nelson · Accepted Answer · 2012-08-01T06:34:00

This is a very open ended question. You will want to use a ListView a DataTemplate. Bind to a collection in the ViewModel. The collection could be string, and then use a Converter to use the correct template, or you can have a collection that is a class that contains the name of the file and the image (or path to the image.

Here is possible XAML:

XML

<ListBox  ItemsSource="{Binding Path=FileNames}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal" >
                <Image Source="{Binding ImagePath}" />
                <TextBlock Text="{Binding FileName}" />
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>

There is still a lot of work to do since you have to create the ViewModel, and fill it.

ArminA88 · Accepted Answer · 2012-08-01T22:07:00

Solution 4

I found another solution... I replaced the listview with the webbrowser control, it shows direcotry browsing and also the icons od the files, basically thats it, now I just have to do some more tweaking :)

Posted 1-Aug-12 22:07pm

ArminA88

ArminA88 · Accepted Answer · 2012-08-01T06:32:00

Here is a preview of the way I did it (regarding the question)

C#

<listview x:name="listView" selectionmode="Single" scrollviewer.cancontentscroll="True" scrollviewer.verticalscrollbarvisibility="Auto" cursor="Arrow" verticalcontentalignment="Top" mousedoubleclick="listView_MouseDoubleClick" xmlns:x="#unknown">
                    <listview.view>
                        <gridview allowscolumnreorder="False">
                            <gridview.columnheadercontainerstyle>
                                <style>
                                    <!--<Setter Property="FrameworkElement.Visibility" Value="Collapsed"/>-->
                                </style>
                            </gridview.columnheadercontainerstyle>
                            <gridviewcolumn>
                                <gridviewcolumnheader>
                                </gridviewcolumnheader>
                                <gridviewcolumn.celltemplate>
                                    <datatemplate>
                                        <stackpanel orientation="Horizontal">
                                            <image height="40" source="/Slike/word.png" />
                                        </stackpanel>
                                    </datatemplate>
                                </gridviewcolumn.celltemplate>
                            </gridviewcolumn>
                            <gridviewcolumn />
                        </gridview>
                    </listview.view>
                </listview>

Images in listview WPF

4 solutions

Solution 3

Solution 4

Solution 2

Solution 1

Add your solution here

Preview 0