[英]How to change an image source dynamically in XAML using MVVM with Xamarin
I'm trying to change an image source property on a ContentPage
. 我正在尝试更改ContentPage
上的图像源属性。 I´m using a binding context to do this. 我正在使用绑定上下文来执行此操作。 But, even if I change the source in my model view, this don't update the image in my view. 但是,即使我在模型视图中更改了源,也不会更新视图中的图像。
UpdateMethod()
{
imageSource1 = imageSource[1];
}
public string ImageSource1
{
get
{
return imageSource1;
}
set
{
imageSource1 = value;
this.Notify("ImageSource1");
}
}
The XAML: XAML:
<ContentView HorizontalOptions="Center" Grid.Row="0" >
<Image ClassId = "1" Source="{Binding ImageSource1}" BindingContextChanged="Handle_BindingContextChanged">
<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding OnTapGestureRecognizerTappedCommand1}" NumberOfTapsRequired="1" />
</Image.GestureRecognizers>
</Image>
</ContentView>
Image
component accepts ImageSource
( FileImageSource
, StreamImageSource
etc). Image
组件接受ImageSource
( FileImageSource
, StreamImageSource
等)。 Luckily ImageSource class have implicit operator against string which creates itself from string regarding format(url or path). 幸运的是,ImageSource类具有针对字符串的隐式运算符,该运算符从有关格式(URL或路径)的字符串创建自己。 Check below Example: 检查以下示例:
Xaml XAML
<Image Source="{Binding ImagePath}">
<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding ImageTapCommand}" />
</Image.GestureRecognizers>
</Image>
ViewModel.cs: ViewModel.cs:
public class SomeViewModel : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public ICommand ImageTapCommand { get; set; }
private string imagePath;
public string ImagePath
{
get { return imagePath; }
set
{
imagePath = value;
PropertyChanged(this, new PropertyChangedEventArgs("ImagePath"));
}
}
public SomeViewModel()
{
ImageTapCommand = new Command(CmdTapImage);
}
private void CmdTapImage()
{
ImagePath = YourNewImagePath;
}
}
When you are Binding the ImageSource
use the Xamarin.Forms.ImageSource
as the return type of your property. 绑定ImageSource
使用Xamarin.Forms.ImageSource
作为属性的返回类型。 Or you can use it's derived classes like FileImageSource
if you are specifying a filepath. 或者,如果您指定文件路径,则可以使用它的派生类,例如FileImageSource
。 Also make sure that the path is present in the native projects. 还要确保该路径存在于本机项目中。
First add de ImageSource in your view model, don´t forget to include Xamarin.Forms dependencys... 首先在视图模型中添加de ImageSource,不要忘记包括Xamarin.Forms依赖项...
private ImageSource _imageSource;
public ImageSource ImageSource
{
get { return _imageSource; }
set
{
_imageSource= value;
PropertyChanged(this, new PropertyChangedEventArgs("ImageSource"));
}
}
after this, include de source binding in you xaml file: 之后,在您的xaml文件中包含源绑定:
<Image Source="{Binding ImageSource}">
<!--<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding ImageTapCommand}" />
</Image.GestureRecognizers>-->
</Image>
Here is a "prism example" 这是一个“棱镜示例”
private ImageSource _imageSource;
public ImageSource ImageSource
{
get { return _imageSource; }
set { SetProperty(ref _imageSource, value); }
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.