滚动时,图像在滑块视图和列表视图中消失

本文关键字:视图 列表 消失 图像 滚动 | 更新日期: 2023-09-27 17:57:05

我有一个SliderView(AppStudio.Uwp.Controls)。图像在我加载页面后立即出现,但在滚动列表时消失。我也用列表视图对此进行了测试。同样的事情也在那里发生。

        <controls:SliderView x:Name="sliderView" ItemsSource="{x:Bind listForOtherPicturesThumbnails}" ItemTemplate="{StaticResource Hero}"
                     RelativePanel.Below="mainImage"
                     RelativePanel.AlignLeftWithPanel="True"
                     RelativePanel.AlignRightWithPanel="True"
                     ArrowsVisibility="Visible"
                     />

使用的项模板如下-

    <DataTemplate x:Key="Hero" x:DataType="local:StorageItemThumbnailClass">
        <Grid Margin="6" Padding="12" Background="White" BorderThickness="1" BorderBrush="LightGray">
            <Image Source="{x:Bind Thumbnail, Converter={StaticResource ThumbnailtoImageConverter}}" Stretch="UniformToFill" HorizontalAlignment="Center" VerticalAlignment="Center" />
        </Grid>
    </DataTemplate>

缩略图在OnNavigated函数中生成如下-

    protected async override void OnNavigatedTo(NavigationEventArgs e)
    {
        otherPicturesPathList = ((PictureWithList)e.Parameter).pathList;
        await PopulateListOfOtherPicturesThumbnailsAsync();
        Bindings.Update();
    }
    private async Task PopulateListOfOtherPicturesThumbnailsAsync()
    {
        if (otherPicturesPathList != null)
        {
            List<Task<StorageItemThumbnail>> thumbnailOperations = new List<Task<StorageItemThumbnail>>();
            foreach (var path in otherPicturesPathList)
            {
                var storageFile = await StorageFile.GetFileFromPathAsync(path);
                thumbnailOperations.Add(storageFile.GetThumbnailAsync(Windows.Storage.FileProperties.ThumbnailMode.PicturesView, 100).AsTask());
            }
            await Task.WhenAll(thumbnailOperations);
            for (int k = 0; k < thumbnailOperations.Count; k++)
            {
                var task = thumbnailOperations[k];
                listForOtherPicturesThumbnails.Add(new StorageItemThumbnailClass { Thumbnail = task.Result });
            }
        }
    }

缩略图到图像转换器-

 public object Convert(object value, Type targetType, object parameter, string language)
    {
        BitmapImage image = null;
        if (value != null)
        {
            if (value.GetType() != typeof(StorageItemThumbnail))
            {
                throw new ArgumentException("Expected a thumbnail");
            }
            StorageItemThumbnail thumbnail = (StorageItemThumbnail)value;
            image = new BitmapImage();
            image.SetSource(thumbnail);
        }
        return (image);
    }

存储项缩略图类-

public class StorageItemThumbnailClass : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
    private StorageItemThumbnail _thumbnail;
    private string _name;
    public StorageItemThumbnail Thumbnail
    {
        get { return _thumbnail; }
        set
        {
            _thumbnail = value;
            // Call OnPropertyChanged whenever the property is updated
            OnPropertyChanged("Thumbnail");
        }
    }
    // Create the OnPropertyChanged method to raise the event
    protected void OnPropertyChanged(string name)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
    }
    public String Name
    {
        get { return _name; }
        set
        {
            _name = value;
            // Call OnPropertyChanged whenever the property is updated
            OnPropertyChanged("Name");
        }
    }
}

如何解决此问题,以便图像保持首次加载页面时看到的样子?

滚动时,图像在滑块视图和列表视图中消失

我偶然发现了完全相同的问题。
解决方案是在ThumbnailtoImageConverter中添加thumbnail.Seek(0);

//...
StorageItemThumbnail thumbnail = (StorageItemThumbnail)value;
thumbnail.Seek(0);
image = new BitmapImage();
image.SetSource(thumbnail);

引用链接:滚动时图像在滑块视图和列表视图中消失

我无法测试您的代码,但有两个建议:

  • 您是否尝试过在转换器中设置断点?
  • 看看Visual Studio的"输出"面板,也许你可以得到一些关于你的问题的信息
  • 将您的代码替换为以下内容:

thumbnailOperations.Add(await storageFile.GetThumbnailAsync(Windows.Storage.FileProperties.ThumbnailMode.PicturesView, 100));

恕我直言,异步/等待模式有问题。