数据绑定到从webclient下载的图像 [英] Data binding to image downloaded from webclient
本文介绍了数据绑定到从webclient下载的图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要助手将从web客户端下载的图像(下面的代码)绑定到longlistselector的datatemplate中的图像控件。
private Image GetImage(String ImageLink)
{
Image img = new Image();
WebClient客户端=新WebClient();
client.OpenReadCompleted + = async(obj,args)=>
{
Stream stream = new MemoryStream();
await args.Result.CopyToAsync(stream);
BitmapImage b = new BitmapImage();
b.SetSource(stream);
img.Source = b;
img.Width = 250;
img.Height = 250;
};
client.OpenReadAsync(new Uri(ImageLink));
返回img;
}
非常感谢。
解决方案
您应该返回BitmapImage而不是Image。您应该在代码隐藏中创建一个名为ImageSource的公共属性,并将其绑定在DataTemplate中
< phone:PhoneApplicationPage
x:Class =" PhoneApp2.MainPage" x:Name =" mainPage"
xmlns =" http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x =" http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone =" clr-namespace:Microsoft.Phone.Controls; assembly = Microsoft.Phone"
xmlns:shell =" clr-namespace:Microsoft.Phone.Shell; assembly = Microsoft.Phone"
xmlns:d =" http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc =" http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable =" d" d:DesignWidth = QUOT; 480" d:DesignHeight = QUOT; 768"
FontFamily =" {StaticResource PhoneFontFamilyNormal}"
FontSize =" {StaticResource PhoneFontSizeNormal}"
Foreground =" {StaticResource PhoneForegroundBrush}"
SupportedOrientations =" Portrait"取向= QUOT;肖像"
shell:SystemTray.IsVisible =" True">
<! - LayoutRoot是放置所有页面内容的根网格 - >
<! - LayoutRoot是放置所有页面内容的根网格 - >
< Grid x:Name =" LayoutRoot"背景= QUOT;透明">
< Grid.RowDefinitions>
< RowDefinition Height =" *" />
< RowDefinition Height =" Auto" />
< /Grid.RowDefinitions>
< ListBox Name =" MyListBox">
< ListBox.ItemTemplate>
< DataTemplate>
< StackPanel Orientation =" Horizontal">
< Image Source =" {Binding ElementName = mainPage,Path = ImageSource,Mode = OneWay}" />
< TextBlock Text =" {Binding}" />
< / StackPanel>
< / DataTemplate>
< /ListBox.ItemTemplate>
< / ListBox>
< Button Content =" Set Image"名称= QUOT; btnSetImage" Grid.Row = QUOT 1 QUOT;的HorizontalAlignment = QUOT;中心"点击= QUOT; btnSetImage_Click" />
< / Grid>
< / phone:PhoneApplicationPage>
代码背后
public partial class MainPage:PhoneApplicationPage
{
//构造函数
public MainPage()
{
InitializeComponent();
//本地化ApplicationBar的示例代码
// BuildLocalizedApplicationBar();
BindList();
}
private void BindList()
{
Collection< string> items = new Collection< string>();
items.Add(" Item 1");
items.Add(" Item 2");
MyListBox.ItemsSource = items;
}
public BitmapImage ImageSource
{
get {return(BitmapImage)GetValue(ImageSourceProperty); }
set {SetValue(ImageSourceProperty,value); }
}
public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.Register(" ImageSource",typeof(BitmapImage),typeof(MainPage),new PropertyMetadata(null));
private void btnSetImage_Click(object sender,RoutedEventArgs e)
{
//将以下代码替换为您的代码以从WebClient读取
Image img = new Image() ;
BitmapImage b = new BitmapImage();
b.UriSource = new Uri(" Back.png",UriKind.Relative);
ImageSource = b;
}
}
I need assistant to bind an image downloaded asnynhronous from web client (code below) to an image control inside a datatemplate of a longlistselector.
private Image GetImage(String ImageLink) { Image img = new Image(); WebClient client = new WebClient(); client.OpenReadCompleted += async (obj, args) => { Stream stream = new MemoryStream(); await args.Result.CopyToAsync(stream); BitmapImage b = new BitmapImage(); b.SetSource(stream); img.Source = b; img.Width = 250; img.Height = 250; }; client.OpenReadAsync(new Uri(ImageLink)); return img; }
Thanks a lot.
解决方案
Instead of Image you should return BitmapImage. You should create a public property called ImageSource in codebehind and bind it in DataTemplate
<phone:PhoneApplicationPage x:Class="PhoneApp2.MainPage" x:Name="mainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" shell:SystemTray.IsVisible="True"> <!--LayoutRoot is the root grid where all page content is placed--> <!--LayoutRoot is the root grid where all page content is placed--> <Grid x:Name="LayoutRoot" Background="Transparent"> <Grid.RowDefinitions> <RowDefinition Height="*"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <ListBox Name="MyListBox"> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <Image Source="{Binding ElementName=mainPage, Path=ImageSource, Mode=OneWay}" /> <TextBlock Text="{Binding}"/> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> <Button Content="Set Image" Name="btnSetImage" Grid.Row="1" HorizontalAlignment="Center" Click="btnSetImage_Click" /> </Grid> </phone:PhoneApplicationPage>Code Behind
public partial class MainPage : PhoneApplicationPage { // Constructor public MainPage() { InitializeComponent(); // Sample code to localize the ApplicationBar //BuildLocalizedApplicationBar(); BindList(); } private void BindList() { Collection<string> items = new Collection<string>(); items.Add("Item 1"); items.Add("Item 2"); MyListBox.ItemsSource = items; } public BitmapImage ImageSource { get { return (BitmapImage)GetValue(ImageSourceProperty); } set { SetValue(ImageSourceProperty, value); } } public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.Register("ImageSource", typeof(BitmapImage), typeof(MainPage), new PropertyMetadata(null)); private void btnSetImage_Click(object sender, RoutedEventArgs e) { //Replace below code with your code to read from WebClient Image img = new Image(); BitmapImage b = new BitmapImage(); b.UriSource = new Uri("Back.png", UriKind.Relative); ImageSource = b; } }
这篇关于数据绑定到从webclient下载的图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文