【问题标题】:Resizable Centered Circular UIView可调整大小的居中圆形 UIView
【发布时间】:2015-03-17 18:47:54
【问题描述】:

我正在寻找一种方法来创建可调整大小并保持居中的 CIRCULAR UIView参见图片)。此示例中的 CIRCULAR 视图是 UIView 子类 WCSDailyGoal

ContainerView.m

- (void)createDailyGoalView
{
    _dailyGoalView = [[WCSDailyGoalView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
    _dailyGoalView.delegate = self;
    _dailyGoalView.goal = 200;
    _dailyGoalView.center = self.view.center;
    [self.view addSubview:_dailyGoalView];
}

WCSDailyGoal.m

- (void)setGoal:(CGFloat)goal
{
    CGPoint saveCenter = self.center;
    CGRect newFrame = CGRectMake(self.frame.origin.x, self.frame.origin.y, goal, goal);
    self.frame = newFrame;
    self.layer.cornerRadius = goal / 2.0;
    self.center = saveCenter;
}

【问题讨论】:

    标签: ios objective-c uiview touchesbegan touchesended


    【解决方案1】:

    我可以通过制作自定义视图来实现这个效果(下面的代码在swift中):

    class ResizableCircleView: UIView {
    
       var maxSize: CGFloat = 100
       var minSize: CGFloat = 10
    
       private var dragRecognizer: UIPanGestureRecognizer!
       private var currentScale: CGFloat = 1
    
       private var defaultSize: CGFloat { return frame.width / currentScale }
    
       override func layoutSubviews() {
          super.layoutSubviews()
          if dragRecognizer == nil{
             dragRecognizer = UIPanGestureRecognizer(target: self, action: "handleDrag:")
             addGestureRecognizer(dragRecognizer)
          }
          backgroundColor = UIColor.blackColor()
          layer.cornerRadius = frame.width / 2
          clipsToBounds = true
       }
    
       func handleDrag(recognizer: UIPanGestureRecognizer){
          let inTopArea = recognizer.locationInView(self).y < frame.height / 2
          let dy = recognizer.translationInView(self).y
    
          var newSize = frame.height + (inTopArea ? -1 : 1) * dy
          newSize = min(maxSize, newSize)
          newSize = max(minSize, newSize)
          currentScale = newSize/defaultSize
          transform = CGAffineTransformMakeScale(currentScale, currentScale)
    
          recognizer.setTranslation(CGPointZero, inView: self)
       }
    }
    

    您可以通过将所需值设置为maxSizeminSize 来调整最大和最小尺寸。希望这会有所帮助。

    【讨论】:

    • 哇,太好了!你拯救了我的一天,@Nikita!
    【解决方案2】:

    从您的问题来看,您并不清楚您想要什么,也不清楚您的问题是什么,但我会根据我对您的意思的假设来尝试回答。

    首先 - 视图不应该管理自己的位置。视图控制器或父视图最好在viewDidLayoutSubviewslayoutSubviews 中视情况而定。 self.center = ...总是是错误的,因为视图的中心应该在哪里取决于其父视图的大小和形状,而子视图不应该知道这些事情它的父级。

    其次,没有所谓的“圆形”UIView。您可以制作一个正方形 UIView 并遮盖其图层,使其显示为圆形,方法是使用 CAShapeLayer 制作一个圆形,并使用圆形作为其路径,然后使用 myView.layer.mask = circleShapeLayer 应用遮罩。

    要处理交互,请在父视图上使用PanGestureRecognizer。在gestureRecognizerShouldBegin 中,确定触摸是否在大约正确的位置开始交互(在圆圈内?在圆圈半径上?在顶部的圆圈半径上?),并根据需要返回YESNO。在您的手势识别器操作函数中,计算新的圆圈大小并使用 myView.bounds = CGRectMake(0, 0, 2*circleRadius, 2*circleRadius); 设置圆形视图的大小。

    这应该可以满足您的需求。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多