2014-03-25 58 views
0

我想簡單地滾動從集合中獲取的圖像。我有這樣的代碼:Wpf:如何綁定圖像?

public class RadioStation 
{ 
    private int id; 
    public BitmapImage bitmap; 
    private Uri link; 


    public RadioStation(int id, BitmapImage bitmap, Uri link) 
    { 
     this.id = id; 
     this.bitmap = bitmap; 
     this.link = link; 
    } 

    public int getId() 
    { 
     return this.id; 
    } 

    public Uri getLink() 
    { 
     return this.link; 
    } 


    public BitmapImage getBitmap() 
    { 
     return this.bitmap; 
    } 

} 

public class RadioStations : ObservableCollection<RadioStation> 
{ 
    public RadioStations() : base() 
    { 
     for (int i = 1; i <= 5; i++) 
     { 
      BitmapImage bitmap = new BitmapImage(); 
      bitmap.BeginInit(); 
      bitmap.UriSource = new Uri(@"Resources\RadioStations\Images\" + i + ".jpg", UriKind.Relative); 
      bitmap.EndInit(); 
      Add(new RadioStation(i, bitmap, null)); 
     } 
    } 
} 

<Window x:Class="DataTemplatingSample.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="clr-namespace:DataTemplatingSample" 
     SizeToContent="WidthAndHeight" 
     Title="Introduction to Data Templating Sample"> 

<Window.Resources> 
<local:RadioStations x:Key="radioStationsList"/> 

<ObjectDataProvider ObjectType="{x:Type local:RadioStation}" x:Key="MyClass" /> 
<ObjectDataProvider ObjectInstance="{StaticResource MyClass}" MethodName="getBitmap" x:Key="MyImage" /> 

<DataTemplate x:Key="radioStationTemplate"> 
    <Border Name="border" BorderBrush="Aqua" BorderThickness="1" Padding="5" Margin="5"> 
     <Image Source="{Binding Source={StaticResource MyImage}}" Width="60" Height="60" VerticalAlignment="Center" HorizontalAlignment="Center"/> 
    </Border> 

</DataTemplate> 

</Window.Resources> 


<StackPanel Orientation="Horizontal" CanHorizontallyScroll="True" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Visible" ScrollViewer.CanContentScroll="True"> 
<ListBox x:Name="list" Width="400" Margin="10" 
     ItemsSource="{StaticResource radioStationsList}" 
     ItemTemplate="{StaticResource radioStationTemplate}"> 
    <ListBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <VirtualizingStackPanel IsItemsHost="True" Orientation="Horizontal" ScrollViewer.CanContentScroll="True"/> 
     </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 
</ListBox> 

    </StackPanel> 
</Window> 

從某些原因,圖像不會出現,只有邊界。我究竟做錯了什麼? (一個簡單的圖像控件與位圖一起使用)

謝謝!!

回答

0

MAKET BitmapImage的財產

public BitmapImage Image 
{ 
    get 
    { 
     return this.bitmap; 
    } 
} 

,並更改綁定到

<Image Source="{Binding Image}" .../> 
+0

著作概述實施例。謝謝! – Idan

0

試試這個

RaisePropertyChanged當u更新圖像,這樣UI得到通知,所以UI理解的變化

更改爲public BitmapImage bitmap

這樣 private BitmapImage _bitmap; public BitmapImage Bitmap { get { return _bitmap; } set { _bitmap= value; RaisePropertyChanged("Bitmap");} }

圖片Bindiing

XAML

<Grid> 
<Image Stretch="UniformToFill" Source="{Binding Photo}" Margin="0,0,10,10" /> 
</Grid> 

視圖模型

private Uri _photo; 
    public Uri Photo 
    { 
     get { return _photo; } 
     set 
     { 
      _photo = value; 
      RaisePropertyChanged("Photo"); 
     } 
    }