Нарисуйте линию в UILabel до и после текста

Я хочу нарисовать линию до и после строки в UILabel точно так же, как на следующем изображении:

PS: текст не статичен, поэтому я не могу сказать, какова точная ширина текста, иначе я бы поставил две статические строки до и после текста.

PS: Также я не могу поместить метку над линией и задать цвет фона метки так же, как и фон представления, потому что у меня есть градиентный цвет в нижнем представлении.

UILabel с линией вокруг текста


person Mutawe    schedule 04.12.2014    source источник
comment
Я считаю, что это легко (только с однострочным текстом)... не могли бы вы сообщить нам, что вы пробовали?   -  person Fahim Parkar    schedule 04.12.2014
comment
Я попробовал PS, который я разместил, также пробовал DrawRect, но я не очень хорош с ним.   -  person Mutawe    schedule 04.12.2014
comment
дайте мне 5-10 минут... я отправлю ответ...   -  person Fahim Parkar    schedule 04.12.2014
comment
проверьте мой ответ .. Я отправил свой ответ .. вам нужно будет поиграть с 320 для вашего iphone 6 и других размеров ... но этот код даст вам представление ...   -  person Fahim Parkar    schedule 04.12.2014


Ответы (2)


Надеюсь, ниже вы найдете то, что искали...

#import "ViewController.h"

@interface ViewController () {
    UILabel *textLabel;
    UILabel *fakeTextLabel;
    UILabel *lineLabel1;
    UILabel *lineLabel2;
}
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    self.view.backgroundColor = [UIColor lightGrayColor];
    NSString *labelText = @"  MOBILE INTERNET  ";
    fakeTextLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 320, 100)];
    fakeTextLabel.backgroundColor = [UIColor blackColor];
    fakeTextLabel.textColor = [UIColor whiteColor];
    fakeTextLabel.text = labelText;
    [fakeTextLabel sizeToFit]; // this is very important...
    fakeTextLabel.hidden = YES;
    [self.view addSubview:fakeTextLabel];

    int lineWidth = (320-fakeTextLabel.frame.size.width);
    lineWidth = lineWidth / 2.00;
    textLabel = [[UILabel alloc] initWithFrame:CGRectMake(320-lineWidth-fakeTextLabel.frame.size.width, 200, fakeTextLabel.frame.size.width, 100)];
    textLabel.text = labelText;
    textLabel.textColor = [UIColor greenColor];
    [self.view addSubview:textLabel];


    lineLabel1 = [[UILabel alloc] initWithFrame:CGRectMake(0, 249, lineWidth, 2)];
    lineLabel1.text = @"";
    lineLabel1.backgroundColor = [UIColor redColor];

    lineLabel2 = [[UILabel alloc] initWithFrame:CGRectMake(lineWidth+fakeTextLabel.frame.size.width, 249, lineWidth, 2)];
    lineLabel2.text = @"";
    lineLabel2.backgroundColor = [UIColor redColor];

    [self.view addSubview:lineLabel1];
    [self.view addSubview:lineLabel2];
}
person Fahim Parkar    schedule 04.12.2014
comment
Спасибо, это не совсем то, что я ожидал от DrawRect, но это работает - person Mutawe; 04.12.2014
comment
Я никогда не использую drawRect, потому что я не доверяю Apple... они могут изменить способ написания позже... поэтому UILabel с фоновым цветом лучше всего подходит для всех айфонов... - person Fahim Parkar; 04.12.2014

Вы можете сделать это несколькими способами.

Способ 1. С просмотрами.

UIView *containerView = [[UIView alloc] initWithFrame:...];// The view that holds background, your label and lines
containerView.backgroundColor = [UIColor clearColor];
[containerView addSubView:bgImageView];
[containerView addSubView:label];
[label sizeToFit];
label.center = CGPointMake(containerView.frame.size.width/2, someY);

CGFloar margin = 5;
UIView *leftLineView = [UIView new];
leftLineView.backgroundColor = [UIColor whiteColor];
leftLineView.frame = CGRectMake(0, 0, containerView.frame.size.width - label.frame.size.width - margin, 0.5f); 
leftLineView.center = CGPointMake(leftLineView.center.x, label.center.y);

UIView *rightLineView = [UIView new];
rightLineView.backgroundColor = [UIColor whiteColor];
rightLineView.frame = CGRectMake(label.frame.origin.x + label.frame.size.width + margin, 0, containerView.frame.size.width - label.frame.size.width - margin, 0.5f); 
rightLineView.center = CGPointMake(rightLineView.center.x, label.center.y);

[containerView addSubiew:leftLineView];
[containerView addSubiew:rightLineView];

Способ 2. С помощью CoreGraphics.

Создайте собственный UIView и в методе -drawRect: нарисуйте свои линии.

- (void)drawRect:(CGRect)rect
{
    CGContextRef currentContext = UIGraphicsGetCurrentContext();
    CGContextSetLineWidth(currentContext, 0.5f);
    CGContextMoveToPoint(currentContext, 0.0f, self.label.center.y);
    CGContextAddLineToPoint(currentContext, self.label.origin.x - margin , self.label.center.y);
    CGContextMoveToPoint(currentContext, self.label.origin.x + self.label.frame.size.width + margin, self.label.center.y);    
    CGContextAddLineToPoint(currentContext, self.frame.size.width, self.label.center.y);    
}

Что-то вроде этого :)

Обратите внимание, что я написал этот код непосредственно в редакторе SO, а не в Xcode, поэтому возможны некоторые синтаксические ошибки.

person arturdev    schedule 04.12.2014