需要以下三个控件:
@property (nonatomic, weak) UIScrollView *scrollView;
@property (nonatomic, weak) UIImageView *image_View;
@property (nonatomic, weak) UIView *containerView;
通过懒加载或其他方式创建3个控件:
- 先创建scrollView，将其添加到控制器view中，
- 再创建containerView添加到scrollView中，作为scrollView的容器视图，用于通过约束设置scrollView的滚动范围的(contentSize)
- 将要添加的图层(比如image_View)加入到containerView 中，当视图高度或宽度大于屏幕的时候可以滚动
创建3个子控件
- (UIView *)containerView {
if (_containerView == nil) {
UIView *containerView = [UIView new];
[self.scrollView addSubview:containerView];
_containerView = containerView;
}
return _containerView;
}
- (UIScrollView *)scrollView {
if (_scrollView == nil) {
UIScrollView *scrollView = [UIScrollView new];
[self.contentView addSubview:scrollView];
_scrollView = scrollView;
}
return _scrollView;
}
- (UIImageView *)image_View {
if (_image_View == nil) {
UIImageView *imageView = [UIImageView new];
[self.containerView addSubview:imageView];
_image_View = imageView;
}
return _image_View;
}
给三个子控件设置约束
// 设置scrollView的约束
[self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.mas_equalTo(self.view);
}];
// 设置scrollView的容器视图的约束
[self.containerView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.mas_equalTo(self.scrollView);
make.width.mas_equalTo(self.scrollView);
}];
// 1.从沙盒中取出缓存的图片
UIImage *image = [[SDWebImageManager sharedManager].imageCache imageFromDiskCacheForKey:picURL.absoluteString];
// 2.根据图片的真实尺寸，计算等比例尺寸
CGFloat width = kScreenW;
CGFloat height = width / image.size.width * image.size.height;
// 根据长图和短图两种情况设置imageView的约束
[self.image_View mas_remakeConstraints:^(MASConstraintMaker *make) {
if (height > kScreenH) { // 长图，顶部和屏幕对其
make.top.mas_equalTo(self.containerView);
} else { // 短图，居中显示
make.top.mas_equalTo((kScreenH - height) * 0.5);
}
make.left.right.mas_equalTo(self.containerView);
make.height.mas_equalTo(height);
}];
//当视图高度大于屏幕的时候scrollView就可以滚动，设置宽度的方法相同
[self.containerView mas_makeConstraints:^(MASConstraintMaker *make) {
// 设置容器视图的底部与要显示的子控件的底部相同，不然scrollView不能滚动
make.bottom.mas_equalTo(self.image_View);
}];
// 下载图片
[self.image_View sd_setImageWithURL:[self getBigImageURL:picURL] placeholderImage:[UIImage imageNamed:@"avatar_default_big"]];
在XIB或storyboard中设置scrollView的约束
scrollView水平滚动约束
1.在控制器上添加scrollView控件，先设置scrollView的约束为上下左右间距为0,
2.给scrollView添加子控件之前，要给scrollView添加一个UIView作为scrollView的容器视图来确定scrollView的滚动范围
3.设置容器视图上下左右的约束相对父控件scrollView的间距为0
4.当需要水平滚动时，设置容器视图的高度和宽度的约束:高度为scrollView的高度相同，宽度根据滚动的范围去确定，但是宽度和高度必须固定哦
scrollView垂直滚动约束
也需要先添加一个容器视图，并设置约束
当需要垂直滚动时，设置容器视图的高度和宽度的约束:宽度为scrollView的宽度相同，高度根据滚动的范围去确定，当视图高度大于屏幕的时候可以滚动，
注意: 把需要在scrollView上的控件添加到容器视图上即可
