как изменить альфа-значение половины UIImage или UIImageView

Question

Я пытаюсь создать эффект анимации, когда изображение с альфа-значением 0,5 (приблизительно) при запуске постепенно меняется на 1, но не так, как обычный эффект. Вот что я ищу.

Исходное изображение.

через некоторое время

через некоторое время

и в конце

Так что, в принципе, если альфа-значение части изображения можно уменьшить, я могу показать анимацию наполнения стакана или чего-то похожего на него.
Я не знаю, можно ли это сделать вообще или возможно с помощью базовой графики или основной анимации.

P.S. Они сделаны в фотошопе.
У кого-нибудь есть мысли о том, что нужно сделать, чтобы добиться такой анимации?

Answer 1

Я бы предложил следующее:

1. Создайте UIImageView, который показывает изображение в представлении.

2. Создание нового UIView с цветом фона и прозрачностью:

   UIView *transpView = [UIView new];
   tranpsView.alpha = 0.4;
   transpView.frame = self.view.frame;
   [self.view addSubview:transpView];
   

3. Анимация прозрачного вида для перемещения вверх:

   [UIView animateWithDuration:1.0 animations:^{
       transpView.frame = CGRectOffset(transpView.frame, 0, -tranpsView.frame.size.height);
   }];
   

Не забудьте отпустить tranpsView после того, как закончите. Возможно с блоком completed.

Чтобы получить анимацию типа «заполнение стекла», просто измените frame из tranpsView соответственно. tranpsView может быть любым подклассом UIView (например, текстура жидкости или что-то в этом роде).

Надеюсь, это поможет.!

Answer 2

Вы можете добавить вид выше и изменить его кадр. Лучший способ.

Если вы используете изображения, тогда создайте солнцезащитный класс UIView и внедрите

-(void) drawRect:(CGRect) rect {
//if you want to clip the image, the frame for the view must be smaller then rect 
    [image drawInRect: rect];
}

Answer 3

Вот еще одна идея.

Установите фон UIView *view на image.png, который вы хотите, с альфа = 0,5.Пусть

w = view.bounds.size.width;
h = view.bounds.size.height;

Создайте еще один UIView *glassView также с альфа = 0,5 и добавьте его в качестве подпредставления:

[view addSubview:glassView];
glassView.frame = CGRectMake(0.0, h, w, 0.0); 

Создайте UIImageView *glassImageView и установите для image значение image.png, и добавьте его как подпредставление glassView:

[glassView addSubview:glassImageView];
glassImageView.frame = CGRectMake(0.0, -h, w, h); 

Теперь настройте анимацию, чтобы увеличить высоту и альфа на glassView при сохранении размера imageGlassView, что-токак это:

[UIView beginAnimations:nil context:NULL]; {
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:1.0];
        [UIView setAnimationDelegate:self];
        glassView.alpha = 1.0;
        glassView.frame = CGRectMake(0.0, 0.0, w, h); 
        glassImageView.frame = CGRectMake(0.0, 0.0, w, h);
} [UIView commitAnimations];        

Если честно, я не проверял это, но что-то в этом роде кажется, что это может работать.С другой стороны, возможно нет.Если вы нашли идеальное решение, пожалуйста, отправьте его обратно.Я хотел бы знать, как это сделать!

Answer 4

Посмотрите, поможет ли это

http://www.iphonedevsdk.com/forum/iphone-sdk-development-advanced-discussion/32481-animating-uiimage-mask-fill.html

Answer 5

Ну, я знаю, что этот вопрос довольно старый, и я тот, кто его задал, но сегодня я экспериментировал с чем-то похожим и нашел это простое решение для моего собственного вопроса, который был задан 10 месяцев назад.

Я работал над проектом, в котором требуется, чтобы изображение выглядело как его загрузка из полностью белого цвета, с прогрессом 0%, до полностью красного изображения, которое имеет прогресс 100%.

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

Таким образом, решение этого вопроса будет состоять в том, что если вы добавите 2 imageViews друг на друга, а затем уменьшите альфа-значение, которое находится позади, и уменьшите высоту до нуля, а затем постепенно увеличите высоту и измените координату y изображение, которое имеет альфа-значение 1, будет загружаться, как задано в этом вопросе.

Я использовал эти две функции, чтобы создать иллюзию загрузки изображения.

- (void)startAnimation
{
    CGRect rect = loadedImageView.frame;
    rect.origin.y = unloadedImageView.frame.origin.y;
    rect.size.height = unloadedImageView.frame.size.height;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDelegate:self];
    [UIView setAnimationDuration:2.0f];
    [UIView setAnimationDidStopSelector:@selector(stopAnimation)];
    loadedImageView.frame = rect;
    [UIView commitAnimations];
}

- (void)stopAnimation
{
    CGRect rect = loadedImageView.frame;
    rect.origin.y = unloadedImageView.frame.size.height + unloadedImageView.frame.origin.y;
    rect.size.height = 0;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDelegate:self];
    [UIView setAnimationDuration:2.0f];
    [UIView setAnimationDidStopSelector:@selector(startAnimation)];
    loadedImageView.frame = rect;
    [UIView commitAnimations];
}