FAV-ZCU/KIV UPG/03. Interaktivní 2D vektorová grafika.md

Interaktivní 2D vektorová grafika

Animace vektorové grafiky

• obraz měnící se v čase
• význam:
  • snadnější vysvětlení dynamických jevů
  • upoutání pozornosti
  • oživení prezentace
  • jednoduché hry

• probíhá v čase t = 0 až T sekund
• libovolný parametr vektorového elementu může být časově závislý
• funkce času může mít fyzikální podstatu

• často je místo složité funkce vhodnější ji pro účel animace aproximovat
  • vybereme uzlové body, ve kterých spočítáme přesnou hodntu

Tvorba animace

1. řešení - nechci nic programovat

• nejjednodušší přístup
• tvorba ve WYSIWYG vektorovém editoru, zobrazení v běžné aplikaci
• problémy
  • kreslítka animace běžně nepodporují
  • ukládací formáty (kromě SVG a XAML) animace nepodporují
  • zobrazovací aplikace mohou mít s animacemi problém
  • mimimální kontrola nad kvalitou animace (trvání 5 sekund, ale FPS neovlivním)

2. řešení - animace řídí grafická knihovna

• tvorba ve WYSIWYG vektorovém editoru
• ve své aplikaci načteme a objekty rozhýbáme pomocí grafické knihovny
• problémy
  • může být obtížné získat objekty oddělené
  • grafické knihovny animace běžně nativně nepodporují

3. řešení - kompletně vše si řídím sám

• univerzální způsob
• animaci si kompletně zařídíme sami včetně interpolací
• objekty mohou být načteny ze souborů
• problémy
  • není až tak jednoduché
  • animace nepřenosná bez aplikace

Interpolace mezi klíčovími snímky

• lze použít libovolnou interpolaci
  • v praxi diskrétní, lineární nebo kubickou

Lineární interpolace

• pro stanovení hodnoty t \in \, <t_{i}, t_{i+1}> vyžadujeme pouze znalost hodnot v časech t_{i}, t_{i+1}
• h(t) = (1-t) \cdot h_{i} + t \cdot h_{i+1} pro t \in \, <0, 1>
• lze použít jen u jednoduchých animací
  • nelze dobře použít např. pro pohyb na kružnici

Kubická interpolace

• pro stanovení hodnoty t \in \, <t_{i}, t_{i+1}> je vyžadována znalost rychlosti růstu hodnot v čase t_{i}, t_{i+1}, tedy derivace h'(t_{i}), h'(t_{i+1})
• h(t) = a \cdot t^3 + b \cdot t^2 + c \cdot t + d pro t = \, <0, 1>
• konstanty z požadavků na interpolaci
• rychlost lze také odvodit z dat

Událostní programování

• moderní OS
  • umožňuje běh více aplikací
  • zajišťují správný chod systému
• aplikace
  • nepřebírá kontrolu nad hardwarem
  • svou čiností se vzájemně neovlivňují
  • řízena událostmi

Aplikace přijímá události od OS ve smyčce - program neodpovídá, když aplikace nezvládá reagovat na události.

Práce s myší a klávesnicí

• manipulace s nimi vede k systémovým událostem
• součástí událostí jsou často i parametry
  • např. pozice myši, označení stisknuté klávesy, ...
• jednoduchá událost vede často k několika událostem

Práce s dotykovou obrazovkou

• dotyk (perem či prstem) převeden systémem na stisk tlačítka myši
• stejně fungují i základní gesta (zoom, pan)
• podpora multi-touch je složitější
  • používají se speciální události, které nemusí knihovna implementovat

Interakce s grafickými objekty

• je potřeba zjistit, zda na objekt uživatel klikl (tzv. hit-test)
• je-li objektem standardní komponentou, postará se o zjištění komponenta
  • programátor řeší pouze obsluhu události komponenty

Hit-test

• je potřeba rozlišovat
  • původ události - program, myš, pero, prst
  • účet hit-testu - efekt po najetí, výběr objektu
• je potřeba brát ohled na velikost objektů
• přesný hit-test pro kružnici
  • porovnání kvardátu vzdálenosti od středu kružnice a kvadrátu jejího poloměru
• přesný hit-test pro konvexní polygon
  • použije se zjištění vzdálenosti bodu od přímek
• hit-test s tolerancí pro přímku
  • zjištění vzdálenosti bodu od přímky
• hit-test s tolerancí obecně
  • průsečík objektu s kružnicí/čtvercem se středem v bodě zjišťování
  • stačí detekovat pouze průnik