Как сделать секретную анимацию приложения для iOS
Я пытаюсь продублировать текстовую метку перехода в секретном приложении. Кто-нибудь лучший способ подойти к нему?
Похоже, что каждая буква начинается с чистого текста, а затем анимируется до серого, а затем белого цвета.
Вот несколько скриншотов:
4 ответа
Вот еще одно решение https://github.com/zipme/RQShineLabel
Я использую CADisplayLink вместе с NSAttributedString, так что нам нужен только один UILabel, посмотрите:)
Спасибо всем за помощь. Я смог заставить это работать с некоторой модификацией, чтобы лейбл исчезал снова и снова. Вот мой полный исходный код: https://github.com/NatashaTheRobot/SecretTextAnimationExample
Я только собираюсь подробно рассказать о том, что сказал @matt, с кратким примером того, как это можно сделать. Вы начинаете с двух меток, одна прямо над другой с теми же атрибутами и выравниваниями. После того, как обе метки настроены, и вы готовы к анимации, все, что вам нужно сделать, это затемнить верхнюю метку.
- (void)awakeFromNib
{
[super awakeFromNib];
[self.view setBackgroundColor:[UIColor blackColor]];
NSString *text = @"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
UILabel *label1 = [[UILabel alloc] initWithFrame:CGRectMake(0.0, 100.0, 320.0, 200.0)];
[label1 setNumberOfLines:0];
[label1 setBackgroundColor:[UIColor clearColor]];
[label1 setAttributedText:[self randomlyFadedAttStringFromString:text]];
[self.view addSubview:label1];
UILabel *label2 = [[UILabel alloc] initWithFrame:CGRectMake(0.0, 100.0, 320.0, 200.0)];
[label2 setNumberOfLines:0];
[label2 setBackgroundColor:[UIColor clearColor]];
[label2 setTextColor:[UIColor whiteColor]];
[label2 setAttributedText:[[NSAttributedString alloc] initWithString:text]];
[self.view addSubview:label2];
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
[UIView animateWithDuration:1.0 animations:^{
[label2 setAlpha:0.0];
} completion:^(BOOL finished) {
[label2 removeFromSuperview];
}];
});
}
Затем создайте специальную атрибутивную строку для нижней метки. Эта приписанная строка не должна изменять ни один атрибут, который вы установили на другой метке, кроме NSForegroundColorAttributeName
приписывать. Возможно, вы захотите или не захотите придумать какой-то алгоритм, чтобы определить, какие буквы должны на какой величину исчезать, но приведенный ниже код сгенерирует приписанную строку из входной строки, где каждая буква альфа - это просто случайное значение между 0 и 1.
- (NSAttributedString *)randomlyFadedAttStringFromString:(NSString *)string
{
NSMutableAttributedString *outString = [[NSMutableAttributedString alloc] initWithString:string];
for (NSUInteger i = 0; i < string.length; i ++) {
UIColor *color = [UIColor colorWithWhite:1.0 alpha:arc4random_uniform(100) / 100.0];
[outString addAttribute:NSForegroundColorAttributeName value:(id)color range:NSMakeRange(i, 1)];
}
return [outString copy];
}
Вот возможный способ.
Во-первых, давайте отметим, что UILabel может содержать и отображать NSAttributedString. Используя NSMutableAttributedString, вы можете сделать каждую букву разным цветом.
Итак, начните с двух меток, одна прямо над другой (то есть перед ней, скрывая ее), с тем же текстом, но разными окрасками букв. Теперь постепенно уменьшайте альфу верхнего ноля, таким образом постепенно выявляя тот, что позади него. Таким образом, каждая буква будет постепенно приобретать цвет буквы позади нее.