UILabel над UIProgressView с несколькими цветами

Так что я еще этого не делал, я пытаюсь понять, как это сделать. Поэтому я создаю UITableView, и каждая ячейка имеет связанный с ней NSTimer. Теперь в каждом пользовательском UITableViewCell у меня есть UIProgressView в качестве фона, растянутого для заполнения ячейки. Теперь я хочу добавить UILabel с оставшимся временем на UIProgressView. Но так как цвет выполнения и цвет фона заливки резко различаются (темно-синий прогресс и белый фон / не заполненная область), мне интересно, как динамически менять цвет текста, когда индикатор выполнения заполняется. Как и часть UILabel, находящаяся на синем заливе, цвет текста должен быть белым. Часть, которая находится на белом фоне, текст должен быть черным. Что-то вроде этого, но в объективе-с.

Просто взломал это для вас 🙂

Результат

Вот результат симулятора ZWProgressView:

введите описание изображения здесь

Файл контроллера View

Вот пример использования:

#import "ViewController.h" #import "ZWProgressView.h" @interface ViewController () @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. ZWProgressView *progressView = [[ZWProgressView alloc] init]; progressView.frame = CGRectMake((self.view.bounds.size.width - 200) / 2.0, self.view.bounds.size.height / 2.0 - 25.0, 200, 50); progressView.progress = 0.47; [self.view addSubview:progressView]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } @end 

Класс ZWProgressView

Примечание: код маскирования, взятый из:

Просто замаскируйте UIView прямоугольником

Файл заголовка

 #import <UIKit/UIKit.h> @interface ZWProgressView : UIView @property (nonatomic, assign) CGFloat progress; @property (nonatomic, strong) UIColor *normalTextColor; @property (nonatomic, strong) UIColor *maskedTextColor; @property (nonatomic, strong) UIView *container; @property (nonatomic, strong) UIView *progressBar; @property (nonatomic, strong) UILabel *progressLabel; @property (nonatomic, strong) UILabel *maskedProgressLabel; @property (nonatomic, strong) UIView *mask; @end 

Файл реализации

 #import "ZWProgressView.h" @interface ZWProgressView() { NSLayoutConstraint *progressBarWidthConstraint; NSLayoutConstraint *progressBarMaskWidthConstraint; } @end @implementation ZWProgressView - (id)initWithFrame:(CGRect)frame { self = [super initWithFrame:frame]; if (self) { // Initialization code self.frame = frame; [self initView]; [self addAllConstraints]; } return self; } -(void)initView { self.layer.cornerRadius = 2.0; self.backgroundColor = [UIColor colorWithRed:0.85 green:0.85 blue:0.85 alpha:1.0]; self.normalTextColor = [UIColor colorWithRed:0.2 green:0.2 blue:0.2 alpha:1.0]; self.maskedTextColor = [UIColor whiteColor]; self.container = [[UIView alloc] init]; self.container.layer.borderWidth = 1.0; self.container.layer.borderColor = [UIColor grayColor].CGColor; self.container.backgroundColor = [UIColor whiteColor]; self.container.layer.cornerRadius = 3.0; self.container.clipsToBounds = YES; self.progressBar = [[UIView alloc] init]; self.progressBar.backgroundColor = [UIColor colorWithRed:0.2 green:0.3 blue:0.8 alpha:1.0]; self.progressLabel = [[UILabel alloc] init]; self.progressLabel.font = [UIFont fontWithName:@"Arial-BoldMT" size:30]; self.progressLabel.textAlignment = NSTextAlignmentCenter; self.progressLabel.textColor = self.normalTextColor; self.progressLabel.clipsToBounds = YES; self.maskedProgressLabel = [[UILabel alloc] init]; self.maskedProgressLabel.font = self.progressLabel.font; self.maskedProgressLabel.textAlignment = self.progressLabel.textAlignment; self.maskedProgressLabel.textColor = self.maskedTextColor; self.maskedProgressLabel.clipsToBounds = YES; self.mask = [[UIView alloc] init]; [self.container addSubview:self.progressBar]; [self.container addSubview:self.progressLabel]; [self.container addSubview:self.maskedProgressLabel]; [self.container addSubview:self.mask]; [self addSubview:self.container]; } -(void)addAllConstraints { self.container.translatesAutoresizingMaskIntoConstraints = NO; self.progressBar.translatesAutoresizingMaskIntoConstraints = NO; self.progressLabel.translatesAutoresizingMaskIntoConstraints = NO; self.maskedProgressLabel.translatesAutoresizingMaskIntoConstraints = NO; self.mask.translatesAutoresizingMaskIntoConstraints = NO; id views = @{@"container": self.container, @"progressBar": self.progressBar, @"progressLabel": self.progressLabel, @"maskedProgressLabel": self.maskedProgressLabel, @"mask": self.mask}; // container constraint [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[container]-5-|" options:0 metrics:nil views:views]]; [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-5-[container]-5-|" options:0 metrics:nil views:views]]; // progressBar constraint [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[progressBar]" options:0 metrics:nil views:views]]; progressBarWidthConstraint = [NSLayoutConstraint constraintWithItem:self.progressBar attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0]; [self.container addConstraint:progressBarWidthConstraint]; [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[progressBar]|" options:0 metrics:nil views:views]]; // progressLabel constraint [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[progressLabel]|" options:0 metrics:nil views:views]]; [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[progressLabel]|" options:0 metrics:nil views:views]]; // maskedProgressLabel constraint [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[maskedProgressLabel]|" options:0 metrics:nil views:views]]; [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[maskedProgressLabel]|" options:0 metrics:nil views:views]]; // mask constraint [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[mask]" options:0 metrics:nil views:views]]; [self.container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[mask]|" options:0 metrics:nil views:views]]; progressBarMaskWidthConstraint = [NSLayoutConstraint constraintWithItem:self.mask attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0]; [self.container addConstraint:progressBarMaskWidthConstraint]; } -(void)setProgress:(CGFloat)progress { int percentage = progress * 100; NSString *strProgress = [[NSString alloc] initWithFormat:@"%d%%", percentage]; self.progressLabel.text = strProgress; self.maskedProgressLabel.text = strProgress; // ------------------------------------------------------------------ // subtracting 10 pixel for the |-5-[progressBar]-5-| padding in // the constraint for the progresBar // ------------------------------------------------------------------ progressBarWidthConstraint.constant = progress * (self.bounds.size.width - 10.0); progressBarMaskWidthConstraint.constant = progressBarWidthConstraint.constant; [self layoutIfNeeded]; [self updateMask]; } -(void)updateMask { // ------------------------------------------------------------------------ // Masking code taken from: // // https://stackoverflow.com/questions/11391058/simply-mask-a-uiview-with-a-rectangle // ------------------------------------------------------------------------ CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init]; CGRect maskRect = CGRectMake(0, 0, progressBarMaskWidthConstraint.constant, self.mask.bounds.size.height); CGPathRef path = CGPathCreateWithRect(maskRect, NULL); maskLayer.path = path; CGPathRelease(path); self.maskedProgressLabel.layer.mask = maskLayer; } @end 

Вы можете сделать это легко, используя два UILabels, один с цветом текста до, и один с цветом текста после. Они должны быть точно друг на друга. Затем вы можете уменьшить ширину метки сверху, соответствующей таймеру, и начнет отображаться метка внизу. Это должно дать вам эффект, который вы ищете.

  • Цвет текста UITableViewCell не меняется
  • iOS UITableView: какая разница между «cellForRowAtIndexPath» и «willDisplayCell: forRowAtIndexPath:»
  • Вопросы по перезагрузке UITableView важны?
  • Как обнаружить событие swipe в UITableViewCell с помощью UISwipeGestureRecognizer
  • Как создать сгруппированный TableView без использования TableViewController
  • Увеличить высоту таблицыCell динамически
  • Отменить NSTimers, связанные с UITableViewCells, когда они выходят на экран
  • Переключение UITableView на различные пользовательские устройства во время выполнения
  • Иерархия вложенных представлений iOS для поддержки функции перетаскивания, позволяющая конечным пользователям настраивать формы
  • Проблемы с объективом C и обновлениями графического интерфейса пользователя
  • iOS Как получить текущую выбранную строку индексного пути в методе cellForRowAtIndexPath?
  • Interesting Posts

    UICollectionView удаляет пробел / заголовок iOS11

    Как получить .ipa-файл с PhoneGap для iOS?

    Могу ли я удалить дубликаты 6.0 iOS DeviceSupport?

    Альтернативы типу casting при форматировании NS (U) Integer на 32 и 64-разрядных архитектурах?

    Изменение размера UIView

    Быстрая отправка данных из дочернего представления в родительский контроллер представления

    Кнопка в UITableViewCell не отвечает в соответствии с ios 7

    Firebase query – поиск элемента с дочерним элементом, содержащим строку

    Узнайте, какой пользователь регистрируется в приложении в зависимости от touchid в iOS

    Ловушки при написании приложения iOS, поддерживающего iOS 3.1.3 и iOS 4.x

    iOS Создать уникальный идентификатор для изображений

    Утилита UITableViewCell изменяет размер с автозагрузкой

    Интерфейс Builder не разрешает подключения к пользовательскому классу UIView?

    Преобразование AnyObject в Int

    Как сделать Progressbar (UISlider) динамически работать в моем приложении?

    Давайте будем гением компьютера.