带有图像的UITableView非常慢地滚动Xamarin.iOS

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (26)

我正在使用Xamarin.Ios和Visual Studio for Mac开发课程列表应用程序。

我的主应用程序屏幕是ExploreTableView,我目前正在列出通过适用的Azure移动服务简易表插入的所有课程。在我的TableView中,我有一个复杂的自定义单元格,需要显示“Lesson Subject”,“TeacherName”,“Lesson Rating”,“Lesson cost”和其他变量。我几乎已经成功完成所有工作,并且它有效。这里的细胞结构:

细胞预览

我是一名高中IT学生,在xamarin.ios编程方面不是很专业,但今天,在Youtube微软指南之后,我还设法实现了Blob存储,我在其中存储了课程内容,我可以检索它们以显示它们在CustomCell的左侧。

问题是,从现在开始,TableView滚动变得非常慢,单元格正确显示存储在我的Blob Azure存储上的图像,但似乎我在TableView加载单元格的方式上做错了。

我尝试阅读Stack Overflow和Microsoft Developer Documentation上的一些指南,但老实说,我无法理解缓存系统的工作原理以及如何实现它,所以我在这里询问是否有人可以帮助我修复我的代码性能问题,或建议我一些易于遵循的在线指南。

这是我的ExploreViewController:

using Foundation;
using System;
using System.Collections.Generic;
using UIKit;
using LessonApp.Model;using System.Threading;
using System.Threading.Tasks;

namespace LessonApp.iOS
{
public partial class ExploreViewController : UITableViewController
{
    List<LessonsServices> lessonsServices;

    public LessonsServices lessonService;


    public ExploreViewController(IntPtr handle) : base(handle)
    {
        lessonsServices = new List<LessonsServices>();
    }

    public override async void ViewDidLoad()
    {
        base.ViewDidLoad();

        lessonsServices = await LessonsServices.GetLessonsServices();
        //lessonsServices = await 
        TableView.ReloadData();
    }

    //LISTING ZONE

    public override nint RowsInSection(UITableView tableView, nint section)
    {
        return lessonsServices.Count;
    }


    public override UITableViewCell GetCell(UITableView tableView, NSIndexPath indexPath)
    {
        var cell = tableView.DequeueReusableCell("servicePreviewCell") as LessonsServicesViewCell;

        var lessonService = lessonsServices[indexPath.Row]; 

 //LESSON TITLE
        cell.titleLabel.Text = lessonService.Subject + " Lesson"; //e.g. "Math Lesson"

        //TEACHER NAME AND LOCATION

        cell.teacherNameLocationLabel.Text = lessonService.Teacher + " • " + lessonService.Location;

        // PRO TEACHER BADGE

        switch (lessonService.IsPro)
        {
            case true:
                cell.proLabel.Hidden = false;
                break;

            case false:
                cell.proLabel.Hidden = true;
                break;

            default:
                cell.proLabel.Hidden = true;
                break;

        }

        cell.startingFromPriceLabel.Text = "Starting from " + lessonService.LowestPrice.ToString() + " €/h";

        //Showing Up the Lesson Cover Image in the cell

        var bytes = Task.Run(() => ImagesManager.GetImage(lessonService.Id+".jpeg")).Result; //Here I call the GetImage method, which connects to the Blob Storage Container and retrieve the image that has the same ID of the Lesson Service
        var data = NSData.FromArray(bytes);
        var uiimage = UIImage.LoadFromData(data);
        cell.teacherProfileImageView.Image = uiimage;

        return cell; 

    }


    //I need this Method to force the cell height
    public override nfloat GetHeightForRow(UITableView tableView, NSIndexPath indexPath)
    {
        return 120;
    }

    //A Segue for another screen, that will copy some information from this page to another  
    public override void PrepareForSegue(UIStoryboardSegue segue, NSObject sender)
    {
        if (segue.Identifier == "ServiceDescriptionPageSegue")
        {
            var selectedRow = TableView.IndexPathForSelectedRow;
            var destinationViewController = segue.DestinationViewController as ServiceDescriptionView;
            destinationViewController.lessonService = lessonsServices[selectedRow.Row];


        }

        base.PrepareForSegue(segue, sender);
    }
  }
}

感谢您的关注!

提问于
用户回答回答于

对于屏幕上可见的每一行,都会调用一次GetCell,并且在滚动期间新行进入视图时会调用额外的时间。

您正在使用以下方法调用GetCell中的GetImage:

Task.Run(() => ImagesManager.GetImage(lessonService.Id+".jpeg")).Result;

所以GetCell正在等待GetImage返回导致慢滚动。

快速解决方案是使您的GetImage方法异步并在异步中在GetCell中调用它,然后在完成后在mainthread上调用Image Update。

Task.Run(async () => {
    var bytes = await ImagesManager.GetImage(lessonService.Id + ".jpeg");
    var data = NSData.FromArray(bytes);
    var uiimage = UIImage.LoadFromData(data);
    InvokeOnMainThread(() => {
      cell.teacherProfileImageView.Image = uiimage;
    });
});

所属标签

可能回答问题的人

  • 天使的炫翼

    17 粉丝531 提问5 回答
  • 找虫虫

    0 粉丝0 提问5 回答
  • 人生的旅途

    10 粉丝484 提问4 回答
  • 骑牛看晨曦

    4 粉丝522 提问4 回答

扫码关注云+社区

领取腾讯云代金券