2012-07-18 3 views
0

MSDN의 예제를 사용하여 dataTemplate에서 WPF의 listBox를 사용하는 방법을 배우고 있는데, ObservableCollection에 바인딩 된 ListBox를 렌더링하고 ToString 메서드를 재정의하여 렌더링 할 수 있습니다.listBox DataTemplate이 값을 선택하지 않습니다.

그러나 모든 항목에 대해 이미지와 일부 문자 블록을 렌더링해야합니다. 여기 내 XAML는 다음과 같습니다

<Grid x:Class="MyAddin.WPFControls" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:c="clr-namespace:MyAddin" 
      mc:Ignorable="d" 
      d:DesignHeight="300" d:DesignWidth="300" 
      Background="Transparent" 
      HorizontalAlignment="Stretch" Width="auto" 
      Height="215" VerticalAlignment="Stretch" ShowGridLines="False"> 
    <Grid.Resources> 
     <c:People x:Key="MyFriends"/> 
    </Grid.Resources> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="*" /> 
    </Grid.RowDefinitions> 
    <TextBlock HorizontalAlignment="Left" 
       IsManipulationEnabled="True" 
       Height="20" Width="300">Activity Feed</TextBlock> 
    <ListBox Grid.Row="1" Name="listBox1" IsSynchronizedWithCurrentItem="True" 
      BorderThickness="0" ScrollViewer.VerticalScrollBarVisibility="Auto" 
      VerticalContentAlignment="Stretch" Margin="0,0,0,5" Background="Transparent"> 
     <ListBox.ItemTemplate> 
      <DataTemplate> 
       <Grid> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="60"/> 
         <ColumnDefinition Width="*"/> 
        </Grid.ColumnDefinitions> 
        <Border Margin="5" BorderBrush="Black" BorderThickness="1"> 
         <Image Source="{Binding Path=Avatar}" Stretch="Fill" Width="50" Height="50" /> 
        </Border> 
        <StackPanel Grid.Column="1" Margin="5"> 
         <StackPanel Orientation="Horizontal" TextBlock.FontWeight="Bold" > 
          <TextBlock Text="{Binding Path=Firstname }" /> 
         </StackPanel> 
         <TextBlock Text="{Binding Path=Comment}" /> 
        </StackPanel> 
       </Grid> 
      </DataTemplate> 
     </ListBox.ItemTemplate> 
    </ListBox> 
</Grid> 

내 컬렉션 클래스는 다음과 같습니다 :

public class People : ObservableCollection<Person> 
{ }   

public class Person 
{ 
    private string firstName; 
    private string comment; 
    private Bitmap avatar; 

    public Person(string first, string comment, Bitmap avatar) 
    { 
     this.firstName = first; 
     this.comment = comment; 
     this.avatar = avatar; 
    } 

    public string FirstName 
    { 
     get { return firstName; } 
     set { firstName = value; } 
    } 

    public string Comment 
    { 
     get { return comment; } 
     set { comment = value; } 
    } 

    public Bitmap Avatar 
    { 
     get { return avatar;} 
     set { avatar = value; } 
    } 

    public override string ToString() 
    { 
     return firstName.ToString(); 
    } 
} 

내 추가 기능이로드되면 내 데이터를 다운로드하고 itemsSource을 설정하고있다.

People p = new People(); 
p.Add(new Person("Willa", "Some Comment", myAvatar)); 
p.Add(new Person("Isak", "Some Comment", myAvatar)); 
p.Add(new Person("Victor", "Some Comment", myAvatar)); 

this.wpfControl.listBox1.ItemsSource = p; 

내가 직면하고 문제는 항목이 내가 DataTemplate을 제거 할 경우 항목이 자신의 firstName을 함께 잘 표현되는 반면 빈 행으로 렌더링되고 있다는 점이다.

+0

당신의 person 클래스가 당신이해야 할 몇 가지 일을해야한다면 : 속성 setter를 제거하고, 필드를'readonly'로 만드십시오. 변경할 수없는 경우에는 ['INPC'] (http://msdn.microsoft.com/en-us/library/system.componentmodel.inotifypropertychanged.aspx)를 구현하여 UI에서 변경 사항을 가져와야합니다. –

답변

0

이 바인딩 스스로 잘못 아무것도 볼 수 없지만, 아바타 타입이 떨어져 보인다, WPF는 (비트 맵 및 ImageSource 사이에 암시 적 convertion이 있다면 내가 알아 binding errors 확인, 모르는) ImageSource를 기대하고있다.

+0

철자 실수였습니다! FirstName 대신 Firstname을 입력했습니다. 아바타가 호환되지 않는 유형에 있다는 것도 옳았습니다. 내 JSON 데이터에는 아바타의 URL이 포함되어 있으므로 간단히 Image의 Source 속성을 설정합니다. :) – Abhi

관련 문제