2014-04-08 21 views
5

Obecnie pracuję nad aplikacją C# WPF, w której próbuję dodać obraz, a następnie tekst w każdym elemencie listy.Dodawanie obrazu do elementu ListBox

Mam powiązanie działające dla tekstu, ale obraz nie jest wyświetlany.

Poniżej jest mój XAML:

<Window x:Class="ServerAdministrator.FtpDirectoryListing" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="clr-namespace:ServerAdministrator" 
     Title="FTP Directory Listing" Height="391" Width="599"> 
    <Grid> 
     <StatusBar Height="30" Margin="0,322,0,0" Name="statusBar1" VerticalAlignment="Top" /> 
     <ToolBar Height="26" Name="toolBar1" VerticalAlignment="Top" /> 
     <TextBox Height="23" HorizontalAlignment="Left" Margin="12,32,0,0" Name="textBox1" VerticalAlignment="Top" Width="517" /> 
     <ListBox x:Name="lstDirecotryListing" Height="233" HorizontalAlignment="Left" Margin="12,61,0,0" VerticalAlignment="Top" Width="553"> 
      <ListBox.ItemTemplate> 
       <DataTemplate DataType="{x:Type local:DirectoryListing}"> 
        <StackPanel> 
         <TextBlock Margin="3" Text="{Binding path}" /> 
         <ContentControl Margin="3" Content="{Binding image}" /> 
        </StackPanel> 
       </DataTemplate> 
      </ListBox.ItemTemplate> 
     </ListBox> 
    </Grid> 
</Window> 

Poniżej jest moja klasa directoryListing

class DirectoryListing 
    { 
     public string path {get; set;} 
     public Image image{get; set;} 
     public DirectoryListing(Image imgage, String path) 
     { 
      this.image = image; 
      this.path = path; 
     } 
    } 

Poniżej jest jak dodaję elementy do listbox

Image image = new Image(); 
      BitmapImage bi = new BitmapImage(new Uri(@"C:\Users\Chris\Documents\Visual Studio 2010\Projects\ServerAdministrator\ServerAdministrator\bin\Debug\images\directory.png")); 
      image.Source = bi; 
      lstDirecotryListing.Items.Add(new DirectoryListing(image, "hello")); 

Tekst jest uzyskiwanie dodanej dobrze, ale nie obraz.

Nie jestem pewien, czy jest to związane, ale pojawia się następujący w wyjścia konsoli w VS2010

System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.ItemsControl', AncestorLevel='1''. BindingExpression:Path=HorizontalContentAlignment; DataItem=null; target element is 'ComboBoxItem' (Name=''); target property is 'HorizontalContentAlignment' (type 'HorizontalAlignment') System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.ItemsControl', AncestorLevel='1''. BindingExpression:Path=VerticalContentAlignment; DataItem=null; target element is 'ComboBoxItem' (Name=''); target property is 'VerticalContentAlignment' (type 'VerticalAlignment')

Dzięki za wszelką pomoc można zapewnić

UPDATE

I Działa to dzięki odpowiedzi Clemensa, wciąż używając tych samych dwóch zmiennych, ponieważ ścieżka nie jest ścieżką do obrazu, ale w każdym razie wyświetla teraz obraz i tekst.

Problem polega na tym, że wyświetla tekst, a obraz jest pod spodem. Muszę pokazać obraz i tekst obok siebie, jak mogę to zrobić?

+0

Wyjątek dotyczy HorizontalContentAlignment w polu kombi, prawdopodobnie nie ma związku z tym problemem. Twój kod wygląda dobrze, będę wyglądać więcej i mam nadzieję, że dostaniesz odpowiedź! – BradleyDotNET

+0

Czy możesz opublikować "XAML", gdzie zdefiniowano "ComboBoxItem" –

+0

I've looked again. ta wiadomość o polu kombi służy do wcześniejszego dialogu, a nie do wydania – Boardy

Odpowiedz

7

Zmniejszenie widoku modelu to:

public class DirectoryListing 
{ 
    public string Name { get; set; } 
    public string Path { get; set; } 
} 

i zmienić DataTemplate do tego:

<ListBox.ItemTemplate> 
    <DataTemplate> 
     <StackPanel Orientation="Horizontal"> 
      <TextBlock Margin="3" Text="{Binding Name}"/> 
      <Image Margin="3" Source="{Binding Path}"/> 
     </StackPanel> 
    </DataTemplate> 
</ListBox.ItemTemplate> 

wbudowany typ konwersji automatycznie utworzy ImageSource z łańcucha ścieżki pliku.

+0

Dzięki temu zadziałało, jest drugi problem, zaktualizowałem moje pytanie – Boardy

+0

Ustaw "Orientacja =" Poziomo "" na StackPanel. – Clemens

+0

Dzięki tak proste, jak to. Dziękuję za twoją pomoc bardzo docenioną – Boardy