가속화 된 이미지 회전 - LiveCode

Question

저는 며칠 동안 LiveCode로 작업 해 왔지만 문제가 발견되어 하루 종일 걸렸습니다.

내 프로젝트는 순환 이미지가 임의의 각도로 회전하고 중앙/북쪽의 정적 바늘이 그 아래의 현재 섹션을 표시하는 Roulette/Wheel of Fortune 게임입니다. 문제는

on mouseUp 
    put random(360) into i 
    repeat with x=0 to i 
    set the angle of image "ruleta.png" to the angle of image "ruleta.png" + 1 
    wait for 10 milliseconds 
    end repeat 
end mouseUp 

, 내가하지만 일정 속도까지, 이미지 회전을 할 수 있습니다, 그리고에서 부드러운 외모 않습니다

이미지 회전을하기 위해, 나는 버튼이 코드를 사용 모든. 초당 프레임을 늘릴 수있는 방법이 있습니까? 나는 그것이 자연 스핀 가속/감속을 가질 수 있다면 좋을 것입니다.

각 프레임에서 회전하는 각도가 커질수록 속도가 빨라지지만 화면이 고르지 않게됩니다.

또한 RunDev 포럼에서는 Chrome, Firefox 및 Safari에 리디렉션 루프와 404를 제공하여 대부분의 정보를 Google에 제공합니다. 이것은 모두에게 일어나는가?

Answer 1

Benjamin Beaumont가 제공 한 코드를 사용하여 (다시 한 번 감사드립니다!) 원하는대로 실행하고 있습니다.그것을 부드러운 움직임과 감속을 제공하기 위해, 나는 다음과 같은 코드를 사용 :

on mouseUp 
    put randomInRange(15,45) into i 
    set the resizeQuality of image 1 to "normal" 
    put 0 into mi 
    repeat with x=0 to i 
    set the angle of image 1 to the angle of image 1 + (i - mi) 
    put mi+1 into mi 
    wait for 10 milliseconds 
    end repeat 
    lock screen 
    set the resizeQuality of image 1 to "best" 
    set the angle of image 1 to the angle of image 1 + 1 
    set the angle of image 1 to the angle of image 1 - 1 
    unlock screen 
end mouseUp 

감속이 완전히 직계이지만, randomInRange 사람이 그것을 원한다면, 여기있다하는 LiveCode 함수가 아닙니다, 잘 보이는 :

function randomInRange lowerLimit,upperLimit 
    return random(upperLimit - lowerLimit + 1) + lowerLimit - 1 
end randomInRange 

Answer 2

내 Mac에서 이미지에이 코드를 사용하면 멋지고 부드럽습니다. 모바일 앱을 사용하고 있다고 가정합니다.

먼저 이미지 회전이 즉시 계산된다는 것입니다. 즉, 이미지의 가능 여부를 설정할 때마다 LiveCode는 이미지의 모든 픽셀을 매우 비싸게 다시 계산합니다. 데스크톱에서는 꽤 강력한 CPU를 사용하므로 이미지를 회전시키는 것이 매우 쉽고 원활 해 보이지만 모바일 장치의 CPU 사용량은 적어서이 작업에 어려움을 겪습니다.

가능한 해결책 1 - LiveCode는 이미지의 "resizeQuality"속성을 고려합니다. 이것을 "보통", "좋은"및 "최고"로 설정할 수 있습니다. 가장 빠른 것은 "보통"이며 덩어리 모양의 이미지를 생성하고 가장 느린 것은 "최고"로 훨씬 더 높은 품질을 만듭니다. 더 높은 품질의 설정으로 작업하는 경우 회전이 진행되는 동안 품질을 일시적으로 줄임으로써 성능을 향상시킬 수 있습니다.

on mouseUp 
    put random(360) into i 
    set the resizeQuality of image 1 to "normal" 
    repeat with x=0 to i 
     set the angle of image 1 to the angle of image 1 + 1 
     wait for 10 milliseconds 
    end repeat 

    lock screen 
    set the resizeQuality of image 1 to "best" 
    set the angle of image 1 to the angle of image 1 + 1 
    set the angle of image 1 to the angle of image 1 - 1 
    unlock screen 
end mouseUp 

고화질로 이미지를 다시 그리려면 다시 각도를 변경했음을 유의하십시오.

가능한 해결책 2 - 충분한 성능을 얻지 못한다면 가장 좋은 방법은 360 개의 모든 위치에서 휠을위한 이미지를 생성하는 것입니다. 그런 다음 이미지의 파일 이름을 올바른 파일 이름으로 설정할 수 있습니다.

local tImagesPath 
set the itemdel to "/" 
put item 1 to -2 of the filename of this stack & slash & "wheel_images" & slash into tImagesPath 

set the resizeQuality of image 1 to "best" 

repeat with x=0 to 359 
    set the angle of image 1 to x 
    export snapshot from image 1 to file tImagesPath & x & ".png" as png 
    wait 1 millisecond with messages 
end repeat 

이 스크립트는 359 위치에서 휠의 고품질 이미지를 생성합니다. LiveCode의 원인이됩니다

prepare image 

그것을 만드는 메모리에 이미지를 미리로드 :

당신이 응용 프로그램을 열 때, 359 개 위치에있는 휠의 모든 이미지를 반복하고 전화, 모바일에 좋은 성능을 얻으려면 정말 부드러운 애니메이션을 렌더링 할 수 있습니다.