Maket BitmapImage as property
public BitmapImage Image
{
get
{
return this.bitmap;
}
}
And change Binding to
<Image Source="{Binding Image}" .../>
Pregunta
I want to simply scroll images that taken from a collection. I have this code:
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));
}
}
}
and
<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>
From some reason the images won't appear, only the borders. What am I doing wrong? (A simple Image control works with the bitmap)
Thanks!!
Solución
Maket BitmapImage as property
public BitmapImage Image
{
get
{
return this.bitmap;
}
}
And change Binding to
<Image Source="{Binding Image}" .../>
Otros consejos
try this
RaisePropertyChanged When u Update the Image so UI get Notified , So UI understands the change
Change this to public BitmapImage bitmap
like this
private BitmapImage _bitmap;
public BitmapImage Bitmap
{
get { return _bitmap; }
set { _bitmap= value;
RaisePropertyChanged("Bitmap");}
}
Brief Example of Image Bindiing
XAML
<Grid>
<Image Stretch="UniformToFill" Source="{Binding Photo}" Margin="0,0,10,10" />
</Grid>
ViewModel
private Uri _photo;
public Uri Photo
{
get { return _photo; }
set
{
_photo = value;
RaisePropertyChanged("Photo");
}
}