태그 보관물: graphics

graphics

완벽한 크로스 페이드 발생하고 있습니다. 비디오 편집, 플래시 애니메이션

이 문제를 말로 표현하기가 어렵 기 때문에이를 설명하기 위해 비디오 (45 초)를 만들었습니다. 다음은 질문에 대한 미리보기입니다. Vimeo에서 확인하십시오 : http://vimeo.com/epologee/perfect-crossfade

선형 크로스 페이드를 사용하면 결과 이미지의 투명도가 '딥'됩니다.  이 문제를 어떻게 방지 할 수 있습니까?

완벽한 크로스 페이드 (crossfade)를 만들거나 두 이미지 또는 모양의 디졸브 (dissolve) 문제는 지난 10 년 동안 여러 분야에서 반복적으로 발생하고 있습니다. 비디오 편집, 플래시 애니메이션 및 iOS 프로그래밍에서 처음입니다. 인터넷 검색을 시작하면 많은 해결 방법이 있지만 이번에는 해킹 없이이 문제를 해결하고 싶습니다.

요약 :
결과 투명도가 어느 하나의 원본과 일치하도록하려면 두 개의 반투명 한 동일한 색상의 비트 맵을 크로스 페이딩 할 때 적용 할 기술 또는 곡선의 이름은 무엇입니까?

페이드 중에 필요한 부분 투명도 / 알파 값을 계산하는 (수학적) 함수가 있습니까?

받는 유사한 사전 설정으로이 기능이 언어가 프로그래밍하고 ease in, ease out또는 ease in out액션 또는 코코아에서 발견 된 기능을?

업데이트 : 비디오 외에도 샘플 프로젝트 (Xcode 및 iOS SDK 필요)를 만들어 github에 게시했습니다. 비디오와 동일한 애니메이션을 표시하지만 이번에는 사각형으로 표시됩니다. https://github.com/epologee/StackOverflow-Example-Code



답변

나는 그것이 불가능하다는 것을 두려워합니다. 이것은 두 객체가 오버레이 될 때 투명도가 계산되는 방식입니다.
http://en.wikipedia.org/wiki/Alpha_compositing

오버레이 영역을 보지 않으려면 객체 중 하나의 불투명도가 1이어야합니다.


답변

비디오 편집 영역에서 이름이 무엇인지 모르지만 곡선을 S- 곡선 또는 S 자 곡선이라고 합니다. Core Animation의 kCAMediaTimingFunctionEaseInEaseOut 타이밍 기능을 사용하여 iOS에서 찾고있는 크로스 페이드를 생성하는 것은 매우 간단해야합니다 . alpha해당 타이밍 함수를 사용하여 반대 방향 (하나는 0-> 1, 하나는 1-> 0)으로 두 뷰 의 속성에 애니메이션을 적용하십시오 .

[UIView beginAnimations:@"crossfade" context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
view1.alpha = 0.0;
view2.alpha = 1.0;
[UIView commitAnimations];

참고 : UIView의 편리한 방법 대신 블록 기반 애니메이션 방법을 사용해야합니다. 이해하기 쉽고 메모리에서 입력하기 쉽기 때문에 위의 UIView 메소드를 사용했습니다. 블록을 사용하는 것은 그리 어렵지 않습니다.

부록 : UIViewAnimationEaseInOut이 마음에 들지 않으면 Timing, Timespaces 및 CAAnimation에 설명 된대로 고유 한 타이밍 함수를 만들 수 있습니다 . 그것은 위에서 설명한 간단한 애니메이션보다 약간 고급이지만 원하는 모든 컨트롤을 제공합니다.


답변

컴퓨터 그래픽에서 이러한 종류의 기능을 부드러운 단계 라고 합니다. . 크로스 페이드로 사용될 때 컴포지션의 글로벌 알파 값을 결정합니다.

입력 이미지에 알파 채널이있는 경우 먼저 알파에 미리 곱 해야합니다 . 그런 다음 alpha각 채널 [ X = A*alpha + B*(1-alpha)] 의 부드러운 단계 를 사용하여 크로스 페이드 구성을 간단하게 수행 할 수 있으며 합리적인 결과를 기대할 수 있습니다.


답변

지수 감쇠 기능을 사용할 수 있습니다.

Alpha1(time) = 1 - exp(-time / (0.2 * transitionTime)); // fade in
Alpha2(time) = 1 - Alpha1(time); // fade out

그래프는 다음과 같습니다.

Alpha1(time) = sin(time * 0.5 * pi / transitionTime); // fade in
Alpha2(time) = cos(time * 0.5 * pi / transitionTime); // fade out

답변