[英]How To Create A Gallery on iOS
我开始为iOS开发一个简单的应用程序,这个应用程序是一个简单的一些照片库(摘自网站)。 我遇到的第一个问题是如何为图库创建视图。
视图应该是这样的(或照片应用程序):
然而,以这种方式进行视图是有问题的,首先是因为它使用固定维度,我认为有点难以实现(对我来说)。
另一种方法是在tableview中使用自定义单元格,如下所示:
但它仍在使用固定尺寸。
在不使用任何第三方库(如Three20)的情况下,创建图库的最佳方法是什么?
谢谢你的回复:)
PS。 我认为使用固定尺寸是不好的,因为新的iphone 4(具有不同的分辨率),我是对的吗?
您应该查看AQGridView ,它完全符合您的要求。 即使您想编写自己的自定义代码,也要查看AQGridView源代码,因为您可能需要使用UIScrollView作为基础。
如果您想使用第三方课程,下一个教程可以混合使用,它们适合我。 这是一个很好的网格视图:
自定义图像选择器,如uiimagepicker
如果要异步加载它们,请使用: image lazy loading
这两个教程都有很好的描述,并有源代码。
分辨率的差异不应该是一个问题,因为iOS,如果我没记错的话,如果检测到它具有视网膜显示,则将UI组件和图像放大到正确的分辨率。 一边; 如果您打算在不降低质量的情况下支持两种屏幕尺寸,请记得开始制作高/低分辨率版本的图形。
只要您根据点而不是像素(这是在XCode 4中完成的方式)设计事物,iOS将能够透明地为您处理缩放。 在小屏幕上,一个点将是一个像素,而在视网膜显示器上它将是两个像素。 这使它能够在视网膜显示器上呈现更加清晰的外观。 资源
我知道这个问题已经过时了,但我没有看到有人解决固定宽度的问题,所以我认为我会做出一次贡献。
嗯,自ios6问世以来,正确的方法是使用Collection Views:
另外,请参阅两个WWDC 2012会议:
可悲的是,Apple没有包含简单的画廊或封面布局,但制作一个很容易。
我写了一篇关于使用UICollectionView构建媒体库的教程。 它从用户的照片库中填充。 我认为它将完美地适用于你想要做的事情。
希望有所帮助。 干杯!
我在自己的项目中做了一些非常类似的事情。 我只是在这里展示代码的一些部分,但如果你想查看完整的代码,你可以在GitHub GitHub Repo上查看它
首先,我使用ImageView创建了一个自定义的Collection View单元格
在CustomCollectionCell.h中
#import <UIKit/UIKit.h>
@interface CustomCollectionCell : UICollectionViewCell
@property (nonatomic , retain) UIImageView *imageView;
@end
在CustomCollectionCell.m中
#import "CustomCollectionCell.h"
@implementation CustomCollectionCell
- (id)initWithFrame:(CGRect)frame {
self = [super initWithFrame:frame];
if (self) {
[self setupImageView];
}
return self;
}
#pragma mark - Create Subviews
- (void)setupImageView {
self.imageView = [[UIImageView alloc] initWithFrame:self.bounds];
self.imageView.autoresizingMask = UIViewAutoresizingNone;//UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
[self addSubview:self.imageView];
}
@end
然后在您想要缩略图的视图中设置CollectionView
在ThumbNailViewController.m(片段)
UICollectionView *collectionViewThumbnails;
在ThumbNailViewController.m(片段)
UICollectionViewFlowLayout *layout=[[UICollectionViewFlowLayout alloc] init];
collectionViewThumbnails=[[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height - 50) collectionViewLayout:layout];
if (collectionViewThumbnails && layout)
{
[collectionViewThumbnails setDataSource:self];
[collectionViewThumbnails setDelegate:self];
[collectionViewThumbnails registerClass:[CustomCollectionCell class] forCellWithReuseIdentifier:@"cellIdentifier"];
[collectionViewThumbnails setBackgroundColor:[UIColor blackColor]];
[self.view addSubview:collectionViewThumbnails];
}
然后,您具有集合视图所需的方法。 在这里你可以设置你
//Number of items in the collectionview
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return [galleryData count];
}
//Set up what each cell in the collectionview will look like
//Here is where you add the thumbnails and the on define what happens when the cell is clicked
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
//initialize custom cell for the collectionview
CustomCollectionCell *cell=[collectionView dequeueReusableCellWithReuseIdentifier:@"cellIdentifier" forIndexPath:indexPath];
[cell.imageView setClipsToBounds:YES];
cell.imageView.contentMode = UIViewContentModeScaleAspectFill;
//format url to load image from
NSString *url = [NSString stringWithFormat:@"http://andrecphoto.weebly.com/uploads/6/5/5/1/6551078/%@",galleryData[indexPath.item]];
//load thumbnail
[cell.imageView setImageWithURL:[NSURL URLWithString:url]
placeholderImage:[UIImage imageNamed:@"placeholder.png"]];
//Sets up taprecognizer for each cell. (onlcick)
UITapGestureRecognizer *tap=[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleTap:)];
[cell addGestureRecognizer:tap];
//sets cell's background color to black
cell.backgroundColor=[UIColor blackColor];
return cell;
}
//Sets size of cells in the collectionview
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(100, 100);
}
//Sets what happens when a cell in the collectionview is selected (onlclicklistener)
- (void)handleTap:(UITapGestureRecognizer *)recognizer {
//gets the cell thats was clicked
CustomCollectionCell *cell_test = (CustomCollectionCell *)recognizer.view;
//gets indexpath of the cell
NSIndexPath *indexPath = [collectionViewThumbnails indexPathForCell:cell_test];
if (isConnectedGal)
{
//sets the image that will be displayed in the photo browser
[photoGallery setInitialPageIndex:indexPath.row];
//pushed photobrowser
[self.navigationController pushViewController:photoGallery animated:YES];
}
}
希望能回答你的问题。
如果您不想使用第三方库,则应在UITableView行中执行此操作。 由于UITableView缓存单元格的方式,它在内存中相对轻量级。 当然比UIScrollView中可能非常大的UIView更重要。 我已经完成了两个方面,我对UITableView感到非常高兴。
那说,下次我需要这样做? 我计划使用AQGridView。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.