user1445685
user1445685

Reputation: 883

Caching images in a tableViewCell

wish someone can help me with this:

I have an app displaying remote data. The data consists of a json response containing a list of artitsts performing at some event.

Each artist has a picture I want to display in a tableView.

I'm looking for a optimized way to do this caching the images and creating the cells asynchronously

Here is what I have done so far:

My tableView

class LineupTableViewController < UITableViewController
  attr_accessor :artists
  #attr_accessor :table
  def init
    super
    self.title = 'Line-up'
    self.initWithNibName(nil, bundle:nil)
    self.view.styleId = 'lineUpView'
    self.tabBarItem = UITabBarItem.alloc.initWithTitle("LineUp", image: UIImage.imageNamed("112-group.png"), tag:2)    
    self
  end
  def viewWillAppear(animated)
    view.dataSource = view.delegate = self
    @artists = []
    App::Persistence['event']['artists'].each do |artist|
      @artists.push(Artist.new(artist)) unless artist["dj"]
    end

  end

  def viewDidLoad
    super

    view.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight
  end

def tableView(tableView, cellForRowAtIndexPath: indexPath)
  artist = @artists[indexPath.row]
  ArtistCell.cellForArtist(artist, indexPath:indexPath, inTableView:tableView)      
end
def tableView(tableView, numberOfRowsInSection: section)
  @artists.length
end
def tableView(tableView, didSelectRowAtIndexPath:indexPath)
  detailViewController = ArtistsdetailViewController.alloc.initWithArtist(@artists[indexPath.row])   
  self.navigationController.pushViewController(detailViewController, animated:true)   
end

def tableView(tableView, heightForRowAtIndexPath:indexPath)
     80
end  
#def reloadRowForIndexPath(indexPath)
#  puts "indexPath.section #{indexPath.section}"
#  self.view.reloadRowsAtIndexPaths([NSIndexPath.indexPathForRow(indexPath.row, inSection:indexPath.section)], withRowAnimation:false)
#end



end

My custom cell

class ArtistCell < UITableViewCell
  attr_accessor :index_path
  CellId = "ArtistCellIdentifier"  
  def setSelected(selected, animated:animated)
    super
    # Configure the view for the selected state
  end

  def self.cellForArtist(artist, indexPath:indexPath, inTableView:tableView)
    cell = tableView.dequeueReusableCellWithIdentifier(ArtistCell::CellId) || ArtistCell.alloc.initWithStyle(UITableViewCellStyleSubtitle, reuseIdentifier:CellId)
      #puts "indexPath #{}"
      cell.index_path = indexPath
      cell.fillArtist(artist, inTableView:tableView)    
    cell
  end

  def fillArtist(artist, inTableView:tableView)
    #Dispatch::Queue.concurrent.async do      
     #  Dispatch::Queue.main.sync do
        self.textLabel.text = artist.name
        self.detailTextLabel.text = artist.country

        JMImageCache.sharedCache.imageForURL(NSURL.URLWithString(artist.picture), completionBlock:proc {
          |downloaded_image|      
            self.imageView.image = downloaded_image

        })

      # end
    #end     

  end
end

What I get now is:

Any help solving this would be much appreciated FF

Upvotes: 0

Views: 288

Answers (1)

Adrian Spinei
Adrian Spinei

Reputation: 550

Try this:

def fillArtist(artist, inTableView:tableView)

    self.textLabel.text = artist.name
    self.detailTextLabel.text = artist.country
    self.imageView.setImage(nil)

    JMImageCache.sharedCache.imageForURL(NSURL.URLWithString(artist.picture), completionBlock:proc { |downloaded_image|      
        self.imageView.image = downloaded_image
        self.setNeedsLayout
    })
  end
end

Explanation: setting NIL in the cell makes sure the new image is loaded. setNeedsLayout forces relayout thus displaying the image without the need to tap.

Upvotes: 2

Related Questions