Español
Incluye

Animationseffekte (como jQuery Easings)

 

Sven
Bader


Descargar

Desde que solche Effekte häufiger verwende, Yo ellos nun en uno Incluir zusammengefasst y después de el jQuery-Vorbild todavía algunos hinzugefügt.

La idea es, dass el Bewegung uno Sprites (oder auch Menüelements etc.) no linear verläuft, pero al Anfang y/oder Ende geglättet se.

Der Beispielcode es wegen el Visualisierung algo länger geworden, el Verwendung incluso es aber eigentlich una Zweizeiler:
step! = step! + 0.01
xpos! = easeOutCubic(step!)

Man muss lediglich dafür sorgen, dass el Parámetro (hier step!) en konstanten Schritten de 0 a 1 zählt. El Rückgabe son auch otra vez Werte de 0 (Animationsanfang) a 1 (Animationsende) - sólo eben dazwischen no linear.

El Incluir Expediente (ease.inc)
'Basiert en jQuery bajo el MIT Lizenz (https://jquery.org/license/)
'
'XProfan-Versión de Sven Bader 2021 www.svenbader.de
Declarar Pi!, c1!, c2!, c3!, c4!, c5!, c6!
PI! = Pi()
c1! = 1.70158
c2! = c1! * 1.525
c3! = c1! + 1.0
c4! = (2 * PI!) / 3.0
c5! = (2 * PI!) / 4.5
c6! = PI! * 0.5

Proc bounceOut

    parámetros x!
    declarar n1!,d1!
    n1! = 7.5625
    d1! = 2.75

    if (x! < 1.0/d1!)

        volver n1! * x! * x!

    elseif (x! < (2.0/d1!))

        x! = x!-(1.5/d1!)
        volver (n1! * x! * x! + 0.75)

    elseif (x! < 2.5/d1!)

        x! = x!-(2.25/d1!)
        volver (n1! * x! * x! + 0.9375)

    más

        x! = x!-(2.625/d1!)
        volver (n1! * x! * x! + 0.984375)

    endif

ENDPROC

Proc Linear

    parámetros x!
    volver x!

ENDPROC

Proc easeInQuad

    parámetros x!
    volver (x! * x!)

ENDPROC

Proc easeOutQuad

    parámetros x!
    volver (1.0 - (1.0 - x!) * (1.0 - x!))

ENDPROC

Proc easeInOutQuad

    parámetros x!
    volver if(x! < 0.5, (2.0 * x! * x!), (1.0 - (-2.0 * x! + 2.0)^2 * 0.5))

ENDPROC

Proc easeInCubic

    parámetros x!
    volver (x! * x! * x!)

ENDPROC

Proc easeOutCubic

    parámetros x!
    volver (1.0 - (1.0 - x!)^3)

ENDPROC

Proc easeInOutCubic

    parámetros x!
    volver if(x! < 0.5, (4 * x! * x! * x!), (1.0 - (-2.0 * x! + 2.0)^3 * 0.5))

ENDPROC

Proc easeInQuart

    parámetros x!
    volver (x! * x! * x! * x!)

ENDPROC

Proc easeOutQuart

    parámetros x!
    volver (1.0 - (1.0 - x!)^4)

ENDPROC

Proc easeInOutQuart

    parámetros x!
    volver if(x! < 0.5, (8 * x! * x! * x! * x!), (1.0 - (-2.0 * x! + 2.0)^4 * 0.5))

ENDPROC

Proc easeInQuint

    parámetros x!
    volver (x! * x! * x! * x! * x!)

ENDPROC

Proc easeOutQuint

    parámetros x!
    volver (1 - (1 - x!)^5)

ENDPROC

Proc easeInOutQuint

    parámetros x!
    volver if(x! < 0.5, (16.0 * x! * x! * x! * x! * x!), (1.0 - (-2.0 * x! + 2)^5 * 0.5))

ENDPROC

Proc easeInSine

    parámetros x!
    volver 1.0 - cos(x! * c6!)

ENDPROC

Proc easeOutSine

    parámetros x!
    volver sin(x! * c6!)

ENDPROC

Proc easeInOutSine

    parámetros x!
    volver (-(cos(PI! * x!) - 1.0) * 0.5)

ENDPROC

Proc easeInExpo

    parámetros x!
    volver if((x! = 0.0), 0.0, 2^(10.0 * x! - 10.0))

ENDPROC

Proc easeOutExpo

    parámetros x!
    volver if(x! = 1.0, 1.0, (1.0 - 2^(-10.0 * x!)))

ENDPROC

Proc easeInOutExpo

    parámetros x!
    volver if(x! = 0.0, 0.0, if(x! = 1.0, 1.0, if(x! < 0.5, (2^(20 * x! - 10) * 0.5), (2 - 2^(-20.0 * x! + 10.0)) *0.5)))

ENDPROC

Proc easeInCirc

    parámetros x!
    volver 1.0 - sqrt(1.0 - x!^2)

ENDPROC

Proc easeOutCirc

    parámetros x!
    volver sqrt(1.0 - (x! - 1.0)^2)

ENDPROC

Proc easeInOutCirc

    parámetros x!
    volver if(x! < 0.5, ((1.0 - sqrt(1.0 - (2.0 * x!)^2)) * 0.5), \
    ((sqrt(1.0 - (-2.0 * x! + 2.0)^2) + 1.0) * 0.5))

ENDPROC

Proc easeInElastic

    parámetros x!
    volver if(x! = 0.0, 0.0, if(x! = 1.0, 1.0, -(2^(10.0 * x! - 10.0) * sin((x! * 10.0 - 10.75) * c4!))))

ENDPROC

Proc easeOutElastic

    parámetros x!
    volver if(x! = 0, 0, if(x! = 1.0, 1.0, (2^(-10.0 * x!) * sin((x! * 10 - 0.75) * c4!) + 1.0)))

ENDPROC

Proc easeInOutElastic

    parámetros x!
    volver if(x! = 0, 0, if(x! = 1.0, 1.0, if(x! < 0.5, (-(2^(20 * x! - 10) * sin((20 * x! - 11.125) * c5!))  * 0.5), \
    (2^(-20.0 * x! + 10.0) * sin((20.0 * x! - 11.125) * c5!) * 0.5 + 1.0))))

ENDPROC

Proc easeInBack

    parámetros x!
    volver c3! * x! * x! * x! - c1! * x! * x!

ENDPROC

Proc easeOutBack

    parámetros x!
    volver 1 + c3! * (x! - 1)^3 + c1! * (x! - 1)^2

ENDPROC

Proc easeInOutBack

    parámetros x!
    volver if(x! < 0.5, (((2 * x!)^2 * ((c2! + 1.0) * 2.0 * x! - c2!))  * 0.5), \
    (((2.0 * x! - 2.0)^2 *((c2! + 1) * (x! * 2.0 - 2.0) + c2!) + 2) * 0.5))

ENDPROC

Proc easeInBounce

    parámetros x!
    volver 1.0 - bounceOut(1.0 - x!)

ENDPROC

Proc easeInOutBounce

    parámetros x!
    volver if(x! < 0.5, ((1.0 - bounceOut(1.0 - 2.0 * x!)) * 0.5), ((1.0 + bounceOut(2.0 * x! - 1.0)) * 0.5))

ENDPROC


Ein Ejemplo-Listing (ease.prf)
'XProfan-Versión de Sven Bader 2021 www.svenbader.de
 $I ease.inc
declarar xpos!, ypos!, zpos!
declarar font&, fontHandle&, names$, step!, effect&, step&, steps![29,200],loop&,cache&

proc DrawGLScene

    oGL("Clear")
    'Ball
    oGL("Origin", -2+xpos!*4, 1.0, -5)
    oGL("Color", 1.0,0.0,0.0,1)
    oGL("Sphere", 0.15,20,20)
    'Großer Graph
    oGL("Origin", -2, -0.7, -5)
    oGL("Color", 1.0,1.0,1.0,1)
    oGL("glLineWidth", 6.0)

    whileloop 0, step&-2,2

        oGL("glBegin", ~GL_LINES)
        oGL("glVertex2f",&bucle*0.02,steps![effect&,&bucle])
        oGL("glVertex2f",(&bucle+2)*0.02,steps![effect&,&bucle+2])
        oGL("glEnd")

    endwhile

    'Kleine Graphen (+Cachen)

    ifnot cache&

        cache& = ogl("Startlist")
        oGL("glLineWidth", 3.0)

        whileloop 0, 29

            loop& = &bucle
            oGL("Origin", -2.5+(if(loop&>14,&bucle-15,&bucle)*0.33), -1.4+if(loop&>14,-0.4,0), -5)

            whileloop 0, 180,20

                oGL("glBegin", ~GL_LINES)
                oGL("glVertex2f",&bucle*0.0012,steps![loop&,&bucle]*0.2)
                oGL("glVertex2f",(&bucle+20)*0.0012,steps![loop&,&bucle+20]*0.2)
                oGL("glEnd")

            endwhile

        endwhile

        ogl("Endlist")

    endif

    ogl("DrawList", cache&)
    'Texto:
    oGL("Origin", -5*(%maxx/%maxy),5 ,-15)
    oGL("color", 1.0,1.0,1.0,1.0)
    oGL("Print",font&,"Effekt "+str$(effect&)+": "+substr$(names$,effect&+1,","))
    oGL("Show")

ENDPROC

windowstyle 1+2+4+8+16
windowtitle "Easing (Leertaste para Überspringen) www.svenbader.de"
window 100,100 - 800,600;0
oGL("Init", %hWnd, 0, 0, 0.4, 0)
oGL("Posmode",1)
fontHandle&=create("Font","Ink Free",12,0,1,0,0)
font&=oGL("OutlineFont",fontHandle&,0)
Deleteobject fontHandle&
names$ = "Linear,easeInQuad,easeOutQuad,easeInOutQuad,easeInCubic,easeOutCubic,easeInOutCubic (Swing),easeInQuart,easeOutQuart,easeInOutQuart,easeInQuint,easeOutQuint,easeInOutQuint,easeInSine,easeOutSine,easeInOutSine,easeInExpo,easeOutExpo,easeInOutExpo,easeInCirc,easeOutCirc,easeInOutCirc,easeInElastic,easeOutElastic,easeInOutElastic,easeInBack,easeOutBack,easeInOutBack,easeInBounce,easeInOutBounce"

Sinestar encargado iskey(27)

    sleep 2

    SELECT effect&

        CASEOF 0 :  xpos! = Linear(step!)

        CASEOF 1 :  xpos! = easeInQuad(step!)

        CASEOF 2 :  xpos! = easeOutQuad(step!)

        CASEOF 3 :  xpos! = easeInOutQuad(step!)

        CASEOF 4 :  xpos! = easeInCubic(step!)

        CASEOF 5 :  xpos! = easeOutCubic(step!)

        CASEOF 6 :  xpos! = easeInOutCubic(step!)

        CASEOF 7 :  xpos! = easeInQuart(step!)

        CASEOF 8 :  xpos! = easeOutQuart(step!)

        CASEOF 9 :  xpos! = easeInOutQuart(step!)

        CASEOF 10 : xpos! = easeInQuint(step!)

        CASEOF 11 : xpos! = easeOutQuint(step!)

        CASEOF 12 : xpos! = easeInOutQuint(step!)

        CASEOF 13 : xpos! = easeInSine(step!)

        CASEOF 14 : xpos! = easeOutSine(step!)

        CASEOF 15 : xpos! = easeInOutSine(step!)

        CASEOF 16 : xpos! = easeInExpo(step!)

        CASEOF 17 : xpos! = easeOutExpo(step!)

        CASEOF 18 : xpos! = easeInOutExpo(step!)

        CASEOF 19 : xpos! = easeInCirc(step!)

        CASEOF 20 : xpos! = easeOutCirc(step!)

        CASEOF 21 : xpos! = easeInOutCirc(step!)

        CASEOF 22 : xpos! = easeInElastic(step!)

        CASEOF 23 : xpos! = easeOutElastic(step!)

        CASEOF 24 : xpos! = easeInOutElastic(step!)

        CASEOF 25 : xpos! = easeInBack(step!)

        CASEOF 26 : xpos! = easeOutBack(step!)

        CASEOF 27 : xpos! = easeInOutBack(step!)

        CASEOF 28 : xpos! = easeInBounce(step!)

        CASEOF 29 : xpos! = easeInOutBounce(step!)

    ENDSELECT

    inc step&
    step! = step! + 0.005
    steps![effect&,step&] = xpos!

    if (step! >= 1.0) O Iskey(32)

        sleep if(Iskey(32), 200, 500)
        inc effect&
        caso cache& : ogl("DeleteList",cache&)
        clear step!, step&, xpos!, cache&
        caso effect& = 30 : effect& = 0

    endif

    DrawGLScene()

EndWhile


18 kB
Hochgeladen:15.10.2021
Ladeanzahl63
Descargar
137 kB
Hochgeladen:15.10.2021
Ladeanzahl64
Descargar
 
15.10.2021  
 



Respuesta


Título del Tema, max. 100 Signo.
 

Systemprofile:

Kein Systemprofil creado. [anlegen]

XProfan:

 Contribución  Font  Smilies  ▼ 

Bitte registro en una Contribución a verfassen.
 

Tema opciones

1.412 Views

Untitledvor 0 min.
Sven Bader06.05.2024
Axel Berse08.11.2023
Walter23.07.2023
Normann Strübli30.01.2023
Más...

Themeninformationen

Dieses Thema ha 1 subscriber:

Sven Bader (1x)


Admins  |  AGB  |  Applications  |  Autores  |  Chat  |  Política de Privacidad  |  Descargar  |  Entrance  |  Ayuda  |  Merchantportal  |  Pie de imprenta  |  Mart  |  Interfaces  |  SDK  |  Services  |  Juegos  |  Búsqueda  |  Support

Ein Projekt aller XProfan, el lo son!


Mi XProfan
Privado Noticias
Eigenes Ablageforum
Temas-Merkliste
Eigene Beiträge
Eigene Temas
Zwischenablage
Cancelar
 Deutsch English Français Español Italia
Traducciones

Política de Privacidad


Wir uso Cookies sólo como Session-Cookies wegen el technischen Notwendigkeit y en uns hay no Cookies de Drittanbietern.

Wenn du hier en unsere Webseite klickst oder navigierst, stimmst du unserer Erfassung de Informationen en unseren Cookies en XProfan.Net a.

Weitere Informationen a unseren Cookies y dazu, como du el Kontrolle darüber behältst, findest du en unserer nachfolgenden Datenschutzerklärung.


einverstandenDatenschutzerklärung
Yo möchte no Cookie