媒体插件在捕获 MVVM 后不显示图像

Question

我正在使用媒体插件并且一切正常，直到我决定将我的逻辑移至 ViewModel。

这是我的 Xaml

<Frame BackgroundColor="LightGray" HasShadow="True">
                                <Image
                                    x:Name="Photo"
                                    Grid.Row="2"
                                    HeightRequest="100"
                                    Source="{Binding postViewModel.SelectedPhoto}"
                                    VerticalOptions="Start"/>

                            </Frame>

我与 MasterViewModel 的绑定

MasterPostsViewModel ViewModel;

protected override void OnAppearing()
        {
            base.OnAppearing();
        
            BindingContext = ViewModel = new MasterPostsViewModel(Navigation);

        }

我的主人

class MasterPostsViewModel : BaseViewModel
    {
        public PostViewModel postViewModel { get; set; }
        public CategoriesViewModel categoriesViewModel { get; set; }

        public MasterPostsViewModel(INavigation navigation)
        {
            postViewModel = new PostViewModel();

            categoriesViewModel = new CategoriesViewModel();

            postViewModel = new PostViewModel(navigation);
        }

    }

在视图模型中拍照

private MediaFile _selectedPhoto;
   public MediaFile SelectedPhoto { get => _selectedPhoto; set => SetValue(ref 
    _selectedPhoto, value); }
     private async Task TakePicture()
            {
                await Permission();
                var imageSource = await DependencyService.Get<IMessage>().ShowActionSheet(AppResources.AlertPhoto, AppResources.AlertNewPhoto, AppResources.AlertGallery);
                if (imageSource == AppResources.AlertNewPhoto)
                {
                    var imageFileName = await CrossMedia.Current.TakePhotoAsync(new StoreCameraMediaOptions()
                    {
                        Name = $"{DateTime.UtcNow}.jpg",
                        DefaultCamera = Plugin.Media.Abstractions.CameraDevice.Rear,
                        PhotoSize = PhotoSize.Medium,
                        SaveToAlbum = true
                    });
                    if (imageFileName == null) return;
                    else
                    {
                        SelectedPhoto = imageFileName;
    
                    }
                }
    }

我可以看到图片的地址，但是图片没有显示在我的 xaml 中。我试图遵循这个 Bind Plugin.Media fromViewModel

但是还是不行。请对我做错了什么提出一些建议

Answer 1

我用你的代码编写了一个绑定字符串的演示，效果很好。您可以查看代码并从中获得一些想法。

xaml 中的代码：

<StackLayout>
    <!-- Place new controls here -->
    <Label Text="{Binding postViewModel.SelectedPhoto}"               
       HorizontalOptions="Center"
       VerticalOptions="CenterAndExpand" />

    <Button Text="click me" Command ="{Binding postViewModel.NewCommand}"/>
</StackLayout>

后面的代码：

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
    }

    MasterPostsViewModel ViewModel;

    protected override void OnAppearing()
    {
        base.OnAppearing();

        BindingContext = ViewModel = new MasterPostsViewModel(Navigation);

    }
}

class MasterPostsViewModel 
{
    public PostViewModel postViewModel { get; set; }

    public MasterPostsViewModel(INavigation navigation)
    {
        postViewModel = new PostViewModel();
    }

}

class PostViewModel : INotifyPropertyChanged
{
    string _selectedPhoto;

    public ICommand NewCommand { private set; get; }

    public event PropertyChangedEventHandler PropertyChanged;

    public PostViewModel()
    {
        SelectedPhoto = "default text";
        NewCommand = new Command(TakePicture);
    }

    private void TakePicture()
    {
        SelectedPhoto = "test text After click button";
    }

    public string SelectedPhoto
    {
        set
        {
            if (_selectedPhoto != value)
            {
                _selectedPhoto = value;

                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs("SelectedPhoto"));
                }
            }
        }
        get
        {
            return _selectedPhoto;
        }
    }
}

示例项目已上传here。