【问题标题】:How to cut the top corner of UIView with a rect of another UIView如何用另一个 UIView 的矩形切割 UIView 的顶角
【发布时间】:2018-08-18 10:03:02
【问题描述】:

如何在特定点用另一个视图的矩形切割视图?

这是两个视图

  1. UIImageView 正在显示图像。
  2. 具有显示用户状态的背景颜色的 UIView。

注意:两个视图的高度和宽度都是统一的。

一个可行的例子会很有帮助。

谢谢

【问题讨论】:

  • 你只是将其他视图放在图像视图的一侧。
  • 我需要如图所示的右上角的切割效果。
  • 是的,对象应该有您需要的边框类型。
  • 我不需要边框我需要这种切割效果,因为背景可以是任何颜色,并且需要通过该切割可见

标签: ios objective-c iphone


【解决方案1】:

例子:

 -(void) viewDidAppear:(BOOL)animated {
    self.view.backgroundColor = [UIColor blueColor];
    UIImageView* yourView = [[UIImageView alloc] initWithFrame:CGRectMake(200, 200, 200, 200)];
    yourView.center = self.view.center;
    yourView.image = [UIImage imageNamed:@"testImg"];

    yourView.layer.cornerRadius = 100;
    yourView.clipsToBounds = YES;
    [self.view addSubview: yourView];

    NSUInteger radius = 50;
    UIBezierPath *circlePath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0*radius, 2.0*radius) cornerRadius:radius];

    UIBezierPath *path =  [UIBezierPath bezierPathWithRect:yourView];
    [path appendPath:circlePath];

    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.path = path.CGPath;
    maskLayer.fillRule = kCAFillRuleEvenOdd;

    yourView.layer.mask  = maskLayer;

    UIImageView* smallView = [[UIImageView alloc] initWithFrame:CGRectMake(yourView.frame.origin.x + 8 ,
                                                                           yourView.frame.origin.y + 8 , 80, 80)];
    smallView.image = [UIImage imageNamed:@"testImg"];
    smallView.layer.cornerRadius = 40;
    smallView.clipsToBounds = YES;
    [self.view addSubview:smallView];

}

添加蒙版到图层。

【讨论】:

  • 什么是yourView,什么是tView
  • 抱歉,没有 tView。 yourView 是“正在显示图像的 UIImageView”。
  • 它对我有用。添加了扩展代码及其工作结果。
【解决方案2】:

你可以通过两个UIViews来做到这一点

首先将UIView 放在UIImageView 的右上角,并为其赋予与self.view 背景颜色相似的背景颜色。在你的情况下,它是蓝色的。是的,还可以通过设置圆角半径使这个视图变圆。

现在将第二个视图放在第一个视图中,并赋予其背景颜色并设置圆角半径以使其成为圆形。

你也做了一些计算,所以你的视图会出现在需要的地方。并确保您的内部视图必须位于外部视图的中心。你一定会得到想要的结果。

【讨论】:

  • 我不想用背景色来处理它
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-06-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-04-14
  • 1970-01-01
  • 2023-03-18
相关资源
最近更新 更多