Pull to refresh

Comments 19

В демо-версии черный квадрат иногда лагает. Когда долетает до позиции с оранжевым квадратом — внезапно телепортируется в исходную позицию и опять летит по той же траектории.
Firefox 46.0.1 x32
Win 8.1 x64

В Chrome 50.0.2661.102 (Win 10 x64) так же.

У меня такое изредка воспроизводится, если быстро водить мышкой. Я не стал полировать демо-код, извините :)

У меня вообще почти всегда лагает. Firefox 45.0.1 x64, Win7 x64.
телепортируется при остановке оранжевого квадратика
UFO landed and left these words here

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

Ага, особенно cos(sin(t)*tan(t*PI)*PI/8) — такая естественная анимация :)
Можно выкрутиться проще, без использования синусов

Берем функцию:

float func(float x)
{
	return -2*x*x*x + 3*x*x;
}


Она растет от 0 до 1 в диапазоне x от 0 до 1, производные в 0 и в 1 равны 0. Если выходные значения нужны
отличные от диапазона [0;1], то масштабируем и смещаем значения функции.
UFO landed and left these words here
Спасибо за статью, для новичков — это самое то.
Единственный вопрос, как описать эффект «залипания» для интерфейсов, т.е. эффект при котором что-то сдвинуть на экране можно только с некой инерцией и усилием (как будто иконка прилипла)?

Зависит от задачи.


В простейшем случае вы можете изменить положение точки остановки. Например, если координата блока из демонстрации должна лежать между 0 и 200, а мышка уходит, например, в 400, то вычислить итоговое положение можно так: x = 200 + (400 — 200) * 0.1 = 220. Коэффициент 0.1 отвечает за силу залипания: чем меньше коэффициент, тем больше залипание. Вот доработанный пример.


В более сложных случаях придется вводить силы и честно решать дифференциальные уравнения.

Мне кажется он имел в виду поведение, когда для начала движения объекта требуется некое минимальное усилие, а не ограничение области передвижения.
UFO landed and left these words here
Усилие не на физическом, а на интерфейсном уровне.

Более живые примеры:
— перетягиваемый объект начинает движение только когда указатель сдвинется дальше чем на X относительно точки клика/тапа. Это drag threshold называется.
— скрываемая скользящая панель выскакивает только если достаточно резко потянуть за ее край/язычок.
Да, перетаскивание может осуществляться не мышкой а через сенсор экрана.
Only those users with full accounts are able to leave comments. Log in, please.