iOS学习征服iOS

UIScrollView - 大图移动

2017-08-28  本文已影响77人  js_huh

效果图

UIScrollView-大图移动.gif
需求:
1.实现大图可以移动
2.点击按钮,实现移动图片
思路:
  1. 拖入UIScrollView控件 --> UIImageView
  2. 设置contentSize,
    2.1 注意: 图片大小>UIScrollView的大小,就可以拖动
  3. 实现点击按钮,移动图片!
    3.1 设置contentOffSet属性就可以实现移动图片!
  4. 实现动画
    4.1 block动画
    4.2 UIScrollView自带动画

代码

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;
@property (weak, nonatomic) IBOutlet UIImageView *imgTest;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // 重点: contentSize属性
    CGSize imgViewSize = self.imgTest.bounds.size;
    self.scrollView.contentSize = imgViewSize;

    //是否有,弹簧效果
    self.scrollView.bounces = NO;
    //是否滚动
    self.scrollView.scrollEnabled = YES;
    //是否显示水平/垂直滚动条
    self.scrollView.showsVerticalScrollIndicator = NO;
    self.scrollView.showsHorizontalScrollIndicator = NO;
}


/*
    重点: contentOffSet属性
    点击按钮,移动图片
 
    重点: 动画方式实现移动
    1. block动画
    2. UIScrollView自带的动画
 */
- (IBAction)didOffSetBtn:(id)sender {
    CGPoint scrollOffset = self.scrollView.contentOffset;
    scrollOffset.x += 50;
    scrollOffset.y += 50;
    //没有动画效果
    //self.scrollView.contentOffset = scrollOffset;
    
    //block动画
    [UIView animateWithDuration:2.0 animations:^{
        self.scrollView.contentOffset = scrollOffset;
    }];
    
    //UIScrollView自带的动画
    //[self.scrollView setContentOffset:scrollOffset animated:YES];
    NSLog(@"scrollOffset = %@",NSStringFromCGPoint(scrollOffset));
}

上一篇 下一篇

猜你喜欢

热点阅读