Math – Victor Laskin's Blog https://vitiy.info Programming, architecture and design (С++, QT, .Net/WPF, Android, iOS, NoSQL, distributed systems, mobile development, image processing, etc...) Thu, 27 Nov 2014 17:04:15 +0000 en-US hourly 1 https://wordpress.org/?v=5.4.2 Easing functions for your animations https://vitiy.info/easing-functions-for-your-animations/ https://vitiy.info/easing-functions-for-your-animations/#respond Thu, 27 Nov 2014 17:04:15 +0000 http://vitiy.info/?p=401 Today’s design guidelines state that all animated movement inside your application should contain so called easing. You can read this section from google material design. If your UI-framework does not contain implementations for standard set of easings you can create your own.

Easing functions

Easing functions

Here is place where you can check out animated plottings for basic easing functions. And here you can find source code for them in several languages (JS,Java,Lua,C#,C++,C).

C++ code for elastic easing (from here):

float Elastic::easeIn (float t,float b , float c, float d) {
	if (t==0) return b;  if ((t/=d)==1) return b+c;  
	float p=d*.3f;
	float a=c; 
	float s=p/4;
	float postFix =a*pow(2,10*(t-=1)); // this is a fix, again, with post-increment operators
	return -(postFix * sin((t*d-s)*(2*PI)/p )) + b;
}

float Elastic::easeOut(float t,float b , float c, float d) {
	if (t==0) return b;  if ((t/=d)==1) return b+c;  
	float p=d*.3f;
	float a=c; 
	float s=p/4;
	return (a*pow(2,-10*t) * sin( (t*d-s)*(2*PI)/p ) + c + b);	
}

float Elastic::easeInOut(float t,float b , float c, float d) {
	if (t==0) return b;  if ((t/=d/2)==2) return b+c; 
	float p=d*(.3f*1.5f);
	float a=c; 
	float s=p/4;
	 
	if (t < 1) {
		float postFix =a*pow(2,10*(t-=1)); // postIncrement is evil
		return -.5f*(postFix* sin( (t*d-s)*(2*PI)/p )) + b;
	} 
	float postFix =  a*pow(2,-10*(t-=1)); // postIncrement is evil
	return postFix * sin( (t*d-s)*(2*PI)/p )*.5f + c + b;
}

Input parameters here:

  • t – time elapsed from start of animation
  • b – start value
  • c – value change
  • d – duration of animation

There is nice online tool – Easing function generator. It generates polynomial functions as approximation. For example, elastic easing can be approximated:

function(t:Number, b:Number, c:Number, d:Number):Number {
	var ts:Number=(t/=d)*t;
	var tc:Number=ts*t;
	return b+c*(33*tc*ts + -106*ts*ts + 126*tc + -67*ts + 15*t);
}

In my framework i use easing formulas in more simple way. Instead of four parameters i use one! Easing can be described as time transformation f(t) -> t, which can be applied to multiple values at the same time. Also this gives a bit more clean formulas. Input time is in range [0.0..1.0], but output can exceed these values.

Here is an example for CircOut easing:

class MVAnimationEasing_CircOut : public MVAnimationEasing {
public:
    inline virtual double ease(double t) final { t -= 1; return sqrt(1 - t*t); };
};

And base animation class could contain something like this:

double getProgress()
{
    double progress = (currentTime - startTime)/(endTime - startTime);
        
    if (currentTime < startTime) progress = 0.0; 
    if (currentTime > endTime) progress = 1.0; 
        
    if (isInverted)
         progress = 1.0 - progress;
        
    progress = easing.ease(progress);
        
    return progress;
}

So the point is that easing is pretty easy.

ps. Don’t make your animations too long to annoy your users. Don’t make too many animations everywhere to defocus your users. Make animations so your users can better understand your UI.

]]>
https://vitiy.info/easing-functions-for-your-animations/feed/ 0
Beal prize – first approach https://vitiy.info/beal-prize-first-approach/ https://vitiy.info/beal-prize-first-approach/#respond Fri, 14 Jun 2013 20:09:58 +0000 http://vitiy.info/?p=54 May be you already heard that so called Beal Prize was increased to 1.000.000$ (http://ns3.ams.org/bealprize.html). So if you can find positive integers A^x+B^y=C^z where x,y,z > 2 and A,B,C dont have common factor, you can get a lot of cash. As you can see its not a complication to write a piece of code to check some range of numbers, or generator to generate some lucky numbers. Its officially checked only in range where all numbers are less than 1000.

So i decided to try my luck.

As first approach i decided to generate a lot of prime numbers (15.000.000 for start). This is C++ code for relatively fast generation of prime numbers:

// Primes

int MAXPRIME = 15000000;

unsigned long * primeNumbers = new unsigned long[MAXPRIME];

LOG << “Computing “ << MAXPRIME << ” prime numbers…” << NL;

LOG.startProfile();

{

primeNumbers[0] = 2;

primeNumbers[1] = 3;

long x = 3;

long sqrtIndex = 0;

for (int i = 2; i < MAXPRIME; i++)

{

bool ok = false;

while (!ok)

{

x += 2;

if ((x % 6 == 1) || (x % 6 == 5))

{

ok = true;

while (primeNumbers[sqrtIndex] * primeNumbers[sqrtIndex] < x)

sqrtIndex++;

 

for (int j = 0; j <= sqrtIndex; j++)

if (x % primeNumbers[j] == 0)

{ ok = false; break; }

}

}

primeNumbers[i] = x;

if (i % 100000 == 0)

LOG << i << ” [ “ << primeNumbers[i] << ” ] “ << NL;

}

}

LOG.profile(“Computing “ + SS::toString(MAXPRIME) + ” prime numbers was completed”);

To check Beal conjecture we need support of very long integers for C++. I have my own implementation, but you can use any decent library.As first straight-forward approach i decided to do in endless cycle the following (until i get lucky numbers):

  • Get two random prime numbers from pregenerated array.
  • Generate random x,y,z within reasonable range.
  • Compute S=A^x+B^Y
  • Compute the most close C – which gives (2*C)^z ~ S (i have used simple method of bisection).
  • If (2*C)^z == S break and report success.

I got yet no success, and some mathematicians tell that conjecture is probably true. But still why not to try to search if it is so easy.

]]>
https://vitiy.info/beal-prize-first-approach/feed/ 0