iOS中的自定义形状（倒T）边框Uiview答案

【问题标题】：Custom shaped (inverted T) bordered Uiview in iOSiOS中的自定义形状（倒T）边框Uiview
【发布时间】：2012-08-21 15:40:09
【问题描述】：

我必须在 iOS 上创建一个自定义形状（倒 T）边框的 Uiview。我附上下面的屏幕截图。我进行了很多研究，并找到了一种使用 here 的 UIBezierPath 的方法。

但我不知道将我的视图塑造成倒 T 形。

【问题讨论】：

我认为您可能以错误的方式处理此问题。为什么要 T 形UIView？如果您想防止视图遮挡其下方的某些内容，为什么不直接在该视图之上添加底层视图？
主要问题是，我必须显示边界..

标签： iphone objective-c ios uiview customization

【解决方案1】：

UIViews 总是矩形的。来自文档：

UIView 类定义了屏幕上的一个矩形区域以及用于管理该区域内容的接口。

即使视图仅限于矩形，您也可以以任何您喜欢的方式塑造您的活动区域。通过将其与透明背景相结合，您可以模仿可以绘制的任何形状的视图。

当您的矩形视图接收到触摸和其他事件时，您的事件处理程序应首先检查活动是否发生在倒 T 形区域中。如果活动在外面，则应忽略该事件。

【讨论】：

@Ramshad 这是一个link 答案，它显示了如何在三角形视图中进行命中测试。
主要问题是，我必须显示边界
@Ramshad 这应该不是什么大问题。您是在drawRect 中绘制您的视图吗？

【解决方案2】：

呼……终于我做到了。我使用了两个 UiViews 子类（顶部和底部）。

我面临的主要挑战是关于边框，因为如果我将边框设置为我的两个视图（顶部和底部），它将不会显示为单个容器项。 :)

我完成的步骤：

创建了两个 UiView 子类。让我们调用 topView 和 bottomView。

    TopView *topView = [[TopView alloc] initWithFrame:CGRectMake(220, 60, 200, 200)];
    [topView setBackgroundColor:[UIColor yellowColor]]; 
    [self.view addSubview:topView]; 

    BottomView *bottomView = [[BottomView alloc] initWithFrame:CGRectMake(130, 260, 380, 200)];
    [bottomView setBackgroundColor:[UIColor yellowColor]];
    bottomView.customShape = topView; //Set the custom shape as TopView to frame to draw the border.    
    [self.view addSubview:topView];

我为 TopView 和 两个完整的边框（下、右）绘制了 三个边框（上、右、左），通过覆盖 drawRect 方法为 BottomView 设置两个部分边框（左上角、右上角）。

查看我的 TopView 课程here。

查看我的 BottomView 课程here。

谢谢大家。

输出：

【讨论】：

@Ramsad 干得好！ .... :/ 但这是两种不同的观点。我在想你想在 T 形中制作一个 UIView。然后我在想，怎么可能改变它的暗淡，因为 UIView 是 2D 的……但是你的工作真的很棒！！！
@VakulSaini：我们可以通过 UIBezierPath 使用一个视图来做到这一点，但问题是，该视图将在 T 形顶视图的左右两侧带有白色背景.. 请参阅此处的示例@ 987654323@

【解决方案3】：

应该可以创建一个以 CAShapeLayer 作为图层的视图。

创建 UIView 的子类并覆盖 layerClass 方法：

+ (Class)layerClass {
    return [CAShapeLayer class];
}

然后在viewDidLoad中你可以指定bezierPath到shapeLayer：

- (void)viewDidLoad {
     [(CAShapeLayer *)self.layer setPath:someBezierPath.CGPath];
     [self.layer setBackgroundColor:[UIColor redColor].CGColor];
}

【讨论】：