Question

我正在处理文档查看器。文档显示在UIScrollView内，以便可以滚动和缩放。我需要在文档周围绘制一个边框，以便在视觉上与UIScrollView的背景分开。边框不得与文档一起缩放 - 无论缩放比例如何，都应保持恒定的厚度。

我当前的设置包含UIScrollView个UIView个孩子 - 一个用于文档，另一个用于边框。我已覆盖viewForZoomingInScrollView：返回文档视图。我还重写layoutSubviews以使文档视图居中（如果它小于UIScrollView），然后调整大小并将边框视图放在它后面，使其看起来像一个框架。当用户手动滚动和缩放时，这可以正常工作。但是当我使用zoomToRect:animated:以编程方式进行缩放时，在动画开始之前调用layoutSubviews，并且我的边框视图会立即调整大小，文档视图稍后会跟进。

澄清：边框需要紧密贴合文档视图，而不是UIScrollView本身。

Answer 1

示例代码：

yourScrollView.layer.cornerRadius=8.0f;
yourScrollView.layer.masksToBounds=YES;
yourScrollView.layer.borderColor=[[UIColor redColor]CGColor];
yourScrollView.layer.borderWidth= 1.0f;

请勿忘记： #Import <QuartzCore/QuartzCore.h>

Answer 2

首先，您需要将QuartzCore框架导入您的应用程序。然后导入.h文件，在哪个类上设置边框。像这样。

#import <QuartzCore/QuartzCore.h>

设置边框。

ScrollView.layer.cornerRadius=5.0f;
ScrollView.layer.masksToBounds=YES;
ScrollView.layer.borderColor=[[UIColor redColor]CGColor];
ScrollView.layer.borderWidth= 4.0f;

检查一下这对你真有帮助。

Answer 3

最后，我能够通过动画缩放解决问题。我的设置与问题中描述的相同。我刚刚在我的layoutSubview实现中添加了一些代码，以便检测任何正在运行的UIScrollView动画，并将其与类似动画相匹配，以便调整边框大小。

以下是代码：

- (void)layoutSubviews
{
  [super layoutSubviews];

  // _pageView displays the document
  // _borderView represents the border around it

  . . .


  // _pageView is now centered -- we have to move/resize _borderView
  // layers backing a view are not implicitly animated
  // the following two lines work just fine if we don't need animation
  _borderView.layer.bounds = CGRectMake(0.0, 0.0, frameToCenter.size.width + 2.0 * 15.0, frameToCenter.size.height + 2.0 * 15.0);
  _borderView.layer.position = _pageView.center;

  if (_pageView.layer.animationKeys.count > 0)
  {
    // UIScrollView is animating its content (_pageView)
    // so we need to setup a matching animation for _borderView

    [CATransaction begin];

    CAAnimation *animation = [_pageView.layer animationForKey:[_pageView.layer.animationKeys lastObject]];
    CFTimeInterval beginTime = animation.beginTime;
    CFTimeInterval duration = animation.duration;

    if (beginTime != 0.0) // 0.0 means the animation starts now
    {
      CFTimeInterval currentTime = [_pageView.layer convertTime:CACurrentMediaTime() fromLayer:nil];
      duration = MAX(beginTime + duration - currentTime, 0.0);
    }

    [CATransaction setAnimationDuration:duration];
    [CATransaction setAnimationTimingFunction:animation.timingFunction];

    // calculate the initial state for _borderView animation from _pageView presentation layer
    CGPoint presentationPos = [_pageView.layer.presentationLayer position];
    CGRect presentationBounds = [_pageView.layer.presentationLayer frame];
    presentationBounds.origin = CGPointZero;
    presentationBounds.size.width += 2.0 * 15.0;
    presentationBounds.size.height += 2.0 * 15.0;

    CABasicAnimation *boundsAnim = [CABasicAnimation animationWithKeyPath:@"bounds"];
    boundsAnim.fromValue = [NSValue valueWithCGRect:presentationBounds];
    boundsAnim.toValue = [NSValue valueWithCGRect:_borderView.layer.bounds];
    [_borderView.layer addAnimation:boundsAnim forKey:@"bounds"];

    CABasicAnimation *posAnim = [CABasicAnimation animationWithKeyPath:@"position"];
    posAnim.fromValue = [NSValue valueWithCGPoint:presentationPos];
    posAnim.toValue = [NSValue valueWithCGPoint:_borderView.layer.position];
    [_borderView.layer addAnimation:posAnim forKey:@"position"];

    [CATransaction commit];
  }

}

看起来很酷但是有效。我希望我没有逆向工程UIScrollView，以便在动画期间使简单的边框看起来很好......

Answer 4

导入QuartzCore框架：

#import <QuartzCore/QuartzCore.h>

现在为其视图添加颜色：

[scrollViewObj.layer setBorderColor:[[UIColor redColor] CGColor]];

[scrollViewObj.layer setBorderWidth:2.0f];

如何围绕UIScrollView的内容绘制边框？

4 个答案: