2013-08-30 33 views
5

SUPER EDIT:Cuộn mượt với hơn 500 hình ảnh

Được rồi, sau một vài sửa đổi khác nhau, tôi có một câu hỏi rõ ràng hơn. Về cơ bản tôi đang đấu tranh với việc sử dụng NSCache. Tôi có một chế độ xem bộ sưu tập như bạn có thể thấy bên dưới và tôi muốn có thể thu nhỏ độ trễ cuộn với hình ảnh mà tôi đang thực hiện cho hầu hết các phần. Phần khó khăn đang chuyển sang hình ảnh fullsize. Đó là trong một cái nhìn khác và tôi muốn chuyển đổi sang hình ảnh kích thước đầy đủ cũng như Apple không với ứng dụng hình ảnh của họ.

Dường như Apple đang lưu vào bộ nhớ cache hình ảnh và truy cập chúng khác nhau. Tôi đã tìm thấy rằng tôi cần phải tải hình thu nhỏ ban đầu sau đó khi hình ảnh fullsize được tải về, tôi có thể thay thế nó. Nhưng tôi không chắc chắn làm thế nào để làm điều này.

Cho đến nay những gì tôi có là:

UICollectionview

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 
    // Do any additional setup after loading the view. 

    self.myCache = [[NSCache alloc] init]; 

} 

//Reusable cell structure 
- (UICollectionViewCell *)collectionView:(UICollectionView *)cv cellForItemAtIndexPath:(NSIndexPath *)indexPath { 

    //cell 
    CoverPhotoCell *cell = [cv dequeueReusableCellWithReuseIdentifier:@"CoverImgCell" forIndexPath:indexPath]; 
    cell.backgroundColor = [UIColor blackColor]; 
    cell.clipsToBounds = YES; 
    cell.opaque = YES; 
    cell.layer.shouldRasterize = YES; 
    cell.layer.rasterizationScale = [UIScreen mainScreen].scale; 

    Media *object = [[Media alloc] init]; 
    object = [self.photoListArray objectAtIndex:indexPath.item]; 

    //Remove old cell 
    for (UIView *subview in [cell subviews]){ 
     if (subview.tag != 0) 
     { 
      [subview removeFromSuperview]; 
     } 
    } 

    //UIImage 
    UIImage *thumbImg = [_myCache objectForKey:object.url]; 

    if (thumbImg) { 

     cell.imageView.image = thumbImg; 
    } 
    else { 

     cell.imageView.image = nil; 

     UIImage *thumbImg = [[UIImage alloc] initWithCGImage:[object.asset aspectRatioThumbnail]]; 

     dispatch_async(dispatch_get_main_queue(), ^{ 
      cell.imageView.image = thumbImg; 
     }); 

     [_myCache setObject:thumbImg forKey:object.url]; 

    } 

    //thumbnail 
    cell.imageView.tag = indexPath.row + 1; 

    cell.imageView.layer.borderWidth = 5; 
    cell.imageView.layer.borderColor = [UIColor whiteColor].CGColor; 
    cell.imageView.contentMode = UIViewContentModeScaleAspectFit; 

    cell.imageView.frame = CGRectMake(0, 0, 125, 125); 

    return cell; 
} 

//User taps image 
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender 
{ 
    if ([segue.identifier isEqualToString:@"PhotoSegue"]) { 
     DetailPageController *controller = segue.destinationViewController; 

     NSIndexPath *selectedIndex = [self.collectionView indexPathsForSelectedItems][0]; 

     controller.initialIndex = (NSUInteger)selectedIndex.item; 

     controller.photos = self.photoListArray; 

    } 
} 

Vì vậy, đó là mã NSCache tôi, sau đó tôi sử dụng một segue với bộ điều khiển cái nhìn đầy đủ mà hiển thị các hình ảnh độ phân giải đầy đủ. Làm cách nào để tải hình thu nhỏ trước và sau đó là hình ảnh có kích thước đầy đủ.

Ngoài ra có bất kỳ suy nghĩ về cách táo tải hình ảnh của mình một cách nhanh chóng? Họ đang sử dụng một cách khác để cache? Hay tôi đang làm điều gì đó không chính xác.

Sửa Refined:


Có thể ai đó đường bưu điện hoặc ít nhất là điểm tôi hướng tới một số mẫu mã mà tôi cho thấy một hình ảnh thu nhỏ khi người dùng cuộn nhanh và tải các hình ảnh thực tế khi họ chậm lại, tương tự như tôi đoán ứng dụng đoạn phim quảng cáo táo.

+0

* "Phần khó khăn đang chuyển sang hình ảnh fullsize Đó là theo quan điểm khác và tôi muốn chuyển đổi sang ảnh fullsize cũng như Apple đã làm với ứng dụng hình ảnh của họ." * - làm bạn có một số liệu cụ thể trong tâm trí? * "Có vẻ như Apple đang lưu vào bộ nhớ đệm hình ảnh và truy cập chúng một cách khác nhau. Tôi đã tìm thấy rằng tôi cần tải hình thu nhỏ ban đầu, sau đó khi hình ảnh đầy đủ được tải xuống, tôi có thể thay thế. Nhưng tôi không chắc chắn cách làm điều này. "* Bạn có thể làm rõ điều đó không? Làm cách nào họ truy cập nó 'khác'? Bạn không chắc chắn về điều gì? –

Trả lời

6

Câu trả lời hoàn chỉnh với mã sẽ là quá nhiều đối với SO. Vì vậy, tôi cố gắng mô tả thông tin cơ bản:

Bạn nên tạo bộ nhớ cache hình ảnh của riêng mình. Với chế độ xem trang cuộn, có tối đa hai hình ảnh hiển thị. Xem ảnh trong chế độ xem cuộn được bật phân trang, bộ nhớ cache hình ảnh phải ít nhất giữ ba hình ảnh có kích thước đầy đủ.

Cache hoạt động như sau:

Giả sử bạn có một danh sách các hình ảnh, có thể được truy cập bởi một chỉ số tương ứng với các vị trí trong tầm nhìn cuộn của "Album Viewer".

Từ chỉ mục hiện tại, (không đồng bộ) tải hình ảnh vào bộ nhớ cache cho chỉ mục-1, chỉ mục và chỉ mục + 1, trừ khi hình ảnh này đã có trong bộ nhớ cache hoặc chỉ mục nằm ngoài phạm vi.

Khi người dùng bắt đầu cuộn hình ảnh tiếp theo sẽ hiển thị.

Khi người dùng cuộn về phía trước và đã cuộn nửa trang, chỉ số hiện tại hiện tại sẽ tăng một. Tại thời điểm này, hai hình ảnh có thể nhìn thấy - mỗi nửa hình ảnh. Bây giờ, khi chỉ mục thay đổi, bạn ném hình ảnh ở chỉ mục hiện tại-2 và tải hình ảnh tiếp theo tại chỉ mục hiện tại + 1.

Khi người dùng cuộn lùi, chỉ mục sẽ giảm một. Bạn ném vào chỉ mục + 2 và tải hình ảnh tương ứng cho chỉ mục hiện tại-1.

Bạn có thể cải thiện lược đồ đó bằng cách thêm bộ nhớ cache chế độ xem ngón tay cái hoạt động chính xác như ở trên, nhưng sử dụng phạm vi rộng hơn, hãy tải trước 20 hình ảnh. Sử dụng hình ảnh ngón tay cái làm "trình giữ chỗ" khi hình ảnh có kích thước đầy đủ chưa được tải (lưu ý: mọi thứ sẽ không đồng bộ).

Nếu người dùng cuộn "nhanh", không tải hình ảnh có kích thước đầy đủ, chỉ cần đợi cho đến khi vận tốc giảm xuống mức nhất định. Bạn có thể xác định tốc độ di chuyển với một số nỗ lực.

Nếu người dùng cuộn rất nhanh, thì ngay cả hình ảnh ngón tay cái cũng không khả dụng khi nó được hiển thị. Sau đó, sử dụng hình ảnh giữ chỗ tĩnh. (Cũng cẩn thận không ghi đè hình ảnh có kích thước đầy đủ bằng hình ảnh ngón tay cái).

+0

Có lẽ tôi đã mô tả nó kém, tôi đã có phiên bản toàn màn hình hoạt động tốt, hình thu nhỏ của nó khiến tôi gặp khó khăn. – lostAstronaut

+0

Ví dụ: ứng dụng ảnh cuộn các bộ sưu tập lớn rất tốt. – lostAstronaut

+1

Bạn nên đọc kỹ hơn. Những gì bạn không nên làm là tải hình ảnh khi các tế bào có thể nhìn thấy - sau đó nó đã quá muộn rồi. Thay vào đó, bạn chỉ cần hiển thị hình ảnh đã chuẩn bị và tải không đồng bộ chế độ xem _next_ vào bộ nhớ cache. Cách tiếp cận của bạn không thể mở rộng được và có khả năng nói lắp. – CouchDeveloper

1

Tôi sẽ tải hình ảnh với AFNetworking.

Bạn có thể sử dụng sau đây

[imageView setImageWithURL:[NSURL URLWithString:@"http://i.imgur.com/r4uwx.jpg"] placeholderImage:[UIImage imageNamed:@"placeholder-avatar"]]; 

Bạn có thể tải các placeholder như hình thu nhỏ và nó sẽ được thay thế bằng hình ảnh khác một lần nạp.

http://cocoadocs.org/docsets/AFNetworking/1.3.1/Categories/UIImageView+AFNetworking.html

+0

Tôi thích ý tưởng của bạn, nhưng tôi nhận được hình ảnh của tôi từ thư viện tài sản. – lostAstronaut

+0

Ok, vì vậy tôi sẽ sử dụng cách tiếp cận tương tự như cách họ thực hiện việc này. Trước tiên, hãy tải chế độ xem hình ảnh có liên quan bằng hình ảnh của trình giữ chỗ. Sau đó kích hoạt chủ đề nền của bạn (nếu cần) với khối hoàn thành chuyển ảnh trở lại và cập nhật hình ảnh lượt xem hình ảnh với ảnh mới đã nhận được – StuartM

Các vấn đề liên quan