仅在顶部带有圆角的 UITextField [英] UITextField with rounded corners only on top

问题描述

我想实现一个仅在左上角和右上角有圆角的 UITextField.

我知道setter方法setCornerRadius:这是UITextField的默认选项，但这个选项只允许我把txtfield的四个角都做成圆形，但我只希望顶部的角是圆形的.

我几个小时以来一直在胡闹，我已经阅读了 Apple 的文档十几次，但我仍然无法找出为什么我的代码不起作用:

- (id) init{//初始化元素UITextField *txt_password = [[UITextField alloc] init];UIView *txt_password_paddingVc = [[UIView alloc] initWithFrame:CGRectMake(0,0,10,35)];//配置txt字段[txt_password setSecureTextEntry:YES];[txt_password setDelegate:self];[txt_password setTag:100];[txt_password setPlaceholder:t(@"App Password")];[txt_password setLeftView:txt_password_paddingVc];[txt_password setRightView:txt_password_paddingVc];[txt_password setBackgroundColor:[UIColor whiteColor]];[txt_password setLeftViewMode:UITextFieldViewModeAlways];[txt_password setRightViewMode:UITextFieldViewModeAlways];[txt_password setTranslatesAutoresizingMaskIntoConstraints:NO];[txt_password setAutocapitalizationType:UITextAutocapitalizationTypeNone];[txt_password setAutocorrectionType:UITextAutocorrectionTypeNo];[txt_password.layer setBorderColor:[UIColor colorWithRed:228/255.0 green:228/255.0 blue:228/255.0 alpha:1].CGColor];[txt_password.layer setBorderWidth:1.0f];[txt_password.layer setShadowOpacity:0.0];[txt_password.layer setMasksToBounds:YES];//为 txtfield 制作圆角CAShapeLayer *passwordMaskLayer = [[CAShapeLayer alloc] init];UIBezierPath *passwordMaskPathWithRadiusTop = [UIBezierPath bezierPathWithRoundedRect:txt_password.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight)cornerRadii:CGSizeMake(5.0, 5.0)];passwordMaskLayer.frame = txt_password.bounds;passwordMaskLayer.path = passwordMaskPathWithRadiusTop.CGPath;passwordMaskLayer.fillColor = [UIColor whiteColor].CGColor;[txt_password.layer.mask setMask:passwordMaskLayer];//添加txtfield查看[self.view addSubview:txt_password];回归自我；}

解决方案

行:

[txt_password.layer.mask setMask:passwordMaskLayer];

应该是:

[txt_password.layer setMask:passwordMaskLayer];

I want to implement an UITextField which has rounded corners only at top left and top right corner.

I know about the setter method setCornerRadius: which is a default option of UITextField, but this option only allows me to make all four corners of the txtfield round, but i only want the corners on the top to be round.

I'm now messing around since hours, I have read through Appple's docs a dozen of times, but I'm still unable to find out why my code wont work:

- (id) init
{
    // init elements
    UITextField *txt_password      = [[UITextField alloc] init];
    UIView *txt_password_paddingVc = [[UIView alloc] initWithFrame:CGRectMake(0,0,10,35)];

    // configure  txtfield
    [txt_password setSecureTextEntry:YES];
    [txt_password setDelegate:self];
    [txt_password setTag:100];
    [txt_password setPlaceholder:t(@"App Password")];
    [txt_password setLeftView:txt_password_paddingVc];
    [txt_password setRightView:txt_password_paddingVc];
    [txt_password setBackgroundColor:[UIColor whiteColor]];
    [txt_password setLeftViewMode:UITextFieldViewModeAlways];
    [txt_password setRightViewMode:UITextFieldViewModeAlways];
    [txt_password setTranslatesAutoresizingMaskIntoConstraints:NO];
    [txt_password setAutocapitalizationType:UITextAutocapitalizationTypeNone];
    [txt_password setAutocorrectionType:UITextAutocorrectionTypeNo];
    [txt_password.layer setBorderColor:[UIColor colorWithRed:228/255.0 green:228/255.0 blue:228/255.0 alpha:1].CGColor];
    [txt_password.layer setBorderWidth:1.0f];
    [txt_password.layer setShadowOpacity:0.0];
    [txt_password.layer setMasksToBounds:YES];

    // make round corners for txtfield
    CAShapeLayer *passwordMaskLayer = [[CAShapeLayer alloc] init];
    UIBezierPath *passwordMaskPathWithRadiusTop = [UIBezierPath bezierPathWithRoundedRect:txt_password.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight) cornerRadii:CGSizeMake(5.0, 5.0)];
    passwordMaskLayer.frame     = txt_password.bounds;
    passwordMaskLayer.path      = passwordMaskPathWithRadiusTop.CGPath;
    passwordMaskLayer.fillColor = [UIColor whiteColor].CGColor;
    [txt_password.layer.mask setMask:passwordMaskLayer];

    // add txtfield to view
    [self.view addSubview:txt_password];

return self;
}

解决方案

The line:

[txt_password.layer.mask setMask:passwordMaskLayer];

Should be:

[txt_password.layer setMask:passwordMaskLayer];

这篇关于仅在顶部带有圆角的 UITextField的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！