如何使用带有删除选项的带边框文本来实现UItextview或UItextfield?

时间:2016-07-12 17:28:56

标签: ios objective-c uitextfield uitextview

我正在开展一个项目,我必须为UITextViewUITextField实现类似网络的功能,并在文本上添加删除选项。它应该看起来完全显示在我附加的图像中。请帮助实现这一目标。 enter image description here

这是我到目前为止所尝试的内容:

 NSMutableAttributedString * string = [[NSMutableAttributedString alloc]initWithString:txtString];
            NSArray *words=[txtString componentsSeparatedByString:@","];
     for (NSString *word in words) {
            [txtString stringByReplacingOccurrencesOfString:@"," withString:@" "]; //if ([word hasSuffix:@","]) {
            self.m_interestsTxtView.font = [UIFont boldSystemFontOfSize:17];
            self.m_interestsTxtView.textColor = [UIColor whiteColor];
            NSRange range=[txtString rangeOfString:word];
            [string addAttribute:NSBackgroundColorAttributeName value:[UIColor blackColor] range:range];
            [string addAttribute:NSForegroundColorAttributeName value:  [UIColor whiteColor] range:range];
            [self.m_interestsTxtView setAttributedText:string];
    }

1 个答案:

答案 0 :(得分:0)

最简单的方法是使用xib创建带有按钮和标签的UIView。另一种方法是创建一个自定义视图,作为您的需求的模板,并将UILabel添加到模板。我是为了学习而做的。我希望你能按照你的要求定制它。

自定义UIView类:

  - (void)drawRect:(CGRect)frame {

    CGContextRef context = UIGraphicsGetCurrentContext();
    UIColor* color = [UIColor colorWithRed: 1 green: 1 blue: 1 alpha: 1];

    UIBezierPath* rectanglePath = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(CGRectGetMinX(frame), CGRectGetMinY(frame), 82, 36) cornerRadius: 11];
    [color setFill];
    [rectanglePath fill];
    [UIColor.darkGrayColor setStroke];
    rectanglePath.lineWidth = 1;
    [rectanglePath stroke];


    UIBezierPath* ovalPath = [UIBezierPath bezierPathWithOvalInRect: CGRectMake(CGRectGetMinX(frame) + 67, CGRectGetMinY(frame) + 3, 11, 11)];
    [UIColor.redColor setFill];
    [ovalPath fill];

    CGContextSaveGState(context);
    CGContextTranslateCTM(context, CGRectGetMinX(frame) + 71.5, CGRectGetMinY(frame) + 8.5);

    UIBezierPath* bezierPath = UIBezierPath.bezierPath;
    [bezierPath moveToPoint: CGPointMake(-4, 0)];
    [bezierPath addCurveToPoint: CGPointMake(5, 0) controlPoint1: CGPointMake(5, 0) controlPoint2: CGPointMake(5, 0)];
    [UIColor.whiteColor setStroke];
    bezierPath.lineWidth = 1;
    [bezierPath stroke];

    CGContextRestoreGState(context);
}

我添加了一个UILabel' Egg'到自定义视图。

这会给你:

enter image description here

将这些customViews(我称之为buttonLabel)添加到数组buttonLabelsArray

如果您想使用UIButton来显示X标记,您不必管理触摸,但如果您不想使用UIButton,那么您应该查明触摸。

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {

    for (UIView *but in buttonLabelsArray) {
        CGPoint locationPoint = [[touches anyObject] locationInView:but];
        if (CGRectContainsPoint(but.bounds, [touches.anyObject  locationInView:but])==YES){
            if ( (locationPoint.x>=64 && locationPoint.x<=80)
                &&  (locationPoint.y>=3  && locationPoint.y<=12) ) {

                NSLog(@"pressed close button");
                [but removeFromSuperview]; 

                    //Do something else
            }
        }
    }

}

您可能需要更改if

( (locationPoint.x>=64 && locationPoint.x<=80)
                    &&  (locationPoint.y>=3  && locationPoint.y<=12) )

基于自定义视图框架的条件。