Ios 可调整大小的中心圆形视图

我正在寻找一种方法来创建一个圆形的

UIView

，它可以调整大小并保持居中（见图）。本例中的圆形视图是

UIView

子类

WCSDailyGoal

ContainerView.m WCSDailyGoal.m

---

我通过自定义视图实现了这一效果（以下代码为swift格式）：

class resizeblecircleview:UIView{
变量maxSize:CGFloat=100
var minSize:CGFloat=10
私人var DragRecogener:UIPangestureRecogener！
专用var currentScale:CGFloat=1
私有变量defaultSize:CGFloat{return frame.width/currentScale}
覆盖func布局子视图（）{
super.layoutSubviews（）
如果dragRecognizer==nil{
dragRecognizer=UIPanGestureRecognizer（目标：self，动作：“handleDrag:”）
addGestureRecognizer（dragRecognizer）
}
backgroundColor=UIColor.blackColor（）
layer.cornerRadius=frame.width/2
clipsToBounds=true
}
func handleDrag（识别器：UIPangestureRecognitor）{
让inTopArea=识别器.locationInView（self）.y

---

您可以通过将所需值设置为

maxSize

和

minSize

来调整最大和最小尺寸。希望这会有所帮助。

我通过自定义视图实现了这一效果（以下代码在swift中）：

class resizeblecircleview:UIView{
变量maxSize:CGFloat=100
var minSize:CGFloat=10
私人var DragRecogener:UIPangestureRecogener！
专用var currentScale:CGFloat=1
私有变量defaultSize:CGFloat{return frame.width/currentScale}
覆盖func布局子视图（）{
super.layoutSubviews（）
如果dragRecognizer==nil{
dragRecognizer=UIPanGestureRecognizer（目标：self，动作：“handleDrag:”）
addGestureRecognizer（dragRecognizer）
}
backgroundColor=UIColor.blackColor（）
layer.cornerRadius=frame.width/2
clipsToBounds=true
}
func handleDrag（识别器：UIPangestureRecognitor）{
让inTopArea=识别器.locationInView（self）.y

---

您可以通过将所需值设置为

maxSize

和

minSize

来调整最大和最小尺寸。希望这能有所帮助。

从你的问题来看，你到底想要什么，也不清楚你的问题是什么，但我会根据我对你的意思的假设来回答

首先，视图不应该管理自己的位置。视图控制器或父视图最好位于

viewdlayoutsubviews

或

layoutSubviews

中（视情况而定）

self.center=…

始终是错误的做法，因为视图中心的确切位置取决于其父视图的大小和形状，而子视图不必知道有关其父视图的此类事情

第二，没有“圆”视图。您可以制作一个正方形

ui视图

并通过使用一个圆形路径的

CAShapeLayer

制作一个圆形来遮罩其层，使其看起来是圆形的，然后使用

myView.layer.mask=circleShapeLayer

应用遮罩

要处理交互，请在父视图上使用

pangestrerecognizer

。在

手势识别器应开始

中，确定触摸是否位于开始交互的正确位置（圆圈内？圆圈半径上？圆圈顶部半径上？），然后根据需要返回

是

或

否

。在手势识别器动作功能中，计算圆的新大小，并使用

myView.bounds=CGRectMake（0,0,2*圈，2*圈）设置圆视图的大小

这应该可以满足您的需要。
从您的问题来看，不清楚您到底想要什么，也不清楚您的问题是什么，但我会尝试根据我对您的意思的假设来回答

首先，视图不应该管理自己的位置。视图控制器或父视图最好位于
viewdlayoutsubviews
或
layoutSubviews
中（视情况而定）
self.center=…
始终是错误的做法，因为视图中心的确切位置取决于其父视图的大小和形状，而子视图不必知道有关其父视图的此类事情

第二，没有“圆”视图。您可以制作一个正方形
ui视图
并通过使用一个圆形路径的
CAShapeLayer
制作一个圆形来遮罩其层，使其看起来是圆形的，然后使用
myView.layer.mask=circleShapeLayer
应用遮罩

要处理交互，请在父视图上使用
pangestrerecognizer
。在
手势识别器应开始
中，确定触摸是否位于开始交互的正确位置（圆圈内？圆圈半径上？圆圈顶部半径上？），然后根据需要返回
是
或
否
。在手势识别器动作功能中，计算圆的新大小，并使用
myView.bounds=CGRectMake（0,0,2*圈，2*圈）设置圆视图的大小

这应该可以满足您的需要。
哇，
- (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];
}

- (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;
}

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)
   }
}