blue<\/CODE> variable\nbecause I wanted to make as few changes as possible.\n<\/P>\n\nRun this program, and click to make the circle move.\nObserve that when the circle moves, it starts slowly,\nthen accelerates, and then decelerates as it gets closer\nto its final location.\nWhat’s more, if you click while the circle is still moving,\nthe circle demonstrates inertia<\/I> as it turns to\nhead toward its new target location.\n<\/P>\n
\nI bet you never noticed the acceleration, deceleration, or\ninertia\nin the original background-color version.\n<\/P>\n
\nWith a little bit of work, you can make the sample even more\ninteresting by making the circle go to where you clicked<\/I>.\nIt looks like a lot of work when I spell it out below,\nbut most of it consists of deleting<\/I> code.\n<\/P>\n
\nFirst, do a search\/replace and rename\nm_pAnimationVariableRed<\/CODE> to\nm_pAnimationVariableX<\/CODE>,\nand rename\nm_pAnimationVariableGreen<\/CODE> to\nm_pAnimationVariableY<\/CODE>.\nDelete\nm_pAnimationVariableBlue<\/CODE> entirely,\nas well as any references to it.\nI decided to just bite the bullet and deal with the\nconsequences of renaming\/deleting variables.\n<\/P>\n\nNow we can simplify the\nCMainWindow::CreateAnimationVariables<\/CODE>\nmethod so all it does is create the two coordinate variables.\n\nHRESULT CMainWindow::CreateAnimationVariables()\n{\n HRESULT hr = m_pAnimationManager->CreateAnimationVariable(\n 0,\n &m_pAnimationVariableX\n );\n if (SUCCEEDED(hr))\n {\n hr = m_pAnimationManager->CreateAnimationVariable(\n 0,\n &m_pAnimationVariableY\n );\n }<\/FONT><\/p>\n return hr;\n}\n<\/PRE>\n
\nWe want the circle to move when you click the mouse,\nso let’s do that.\nDelete CMainWindow::OnLButtonDown<\/CODE>\nand change the window procedure so that clicks move the circle.\n<\/P>\n\nLRESULT CALLBACK CMainWindow::WndProc(\n HWND hwnd,\n UINT uMsg,\n WPARAM wParam,\n LPARAM lParam\n )\n{\n …\n case WM_LBUTTONDOWN:\n {\n pMainWindow->ChangePos(\n (SHORT)LOWORD(lParam),\n (SHORT)HIWORD(lParam)\n <\/FONT>);\n }\n return MESSAGE_PROCESSED;\n …\n}\n<\/PRE>\n\nAnd rename the member function\nChangeColor<\/CODE> to\nChangePos<\/CODE>,\nand instead of taking red and green,\nhave it take x and y.\n<\/P>\n\nHRESULT CMainWindow::ChangePos(\n INT x,\n INT y<\/FONT>\n )\n{\n const UI_ANIMATION_SECONDS DURATION = 0.5;\n const DOUBLE ACCELERATION_RATIO = 0.5;\n const DOUBLE DECELERATION_RATIO = 0.5;<\/p>\n \/\/ Create a storyboard<\/p>\n
IUIAnimationStoryboard *pStoryboard = NULL;\n HRESULT hr = m_pAnimationManager->CreateStoryboard(\n &pStoryboard\n );\n if (SUCCEEDED(hr))\n {\n \/\/ Create transitions for the position<\/FONT> animation variables<\/p>\n IUIAnimationTransition *pTransitionX<\/FONT>;\n hr = m_pTransitionLibrary->CreateAccelerateDecelerateTransition(\n DURATION,\n x<\/FONT>,\n ACCELERATION_RATIO,\n DECELERATION_RATIO,\n &pTransitionX<\/FONT>\n );\n if (SUCCEEDED(hr))\n {\n IUIAnimationTransition *pTransitionY<\/FONT>;\n hr = m_pTransitionLibrary->CreateAccelerateDecelerateTransition(\n DURATION,\n y<\/FONT>,\n ACCELERATION_RATIO,\n DECELERATION_RATIO,\n &pTransitionY<\/FONT>\n );\n \/\/ delete former “blue” transition<\/FONT>\n if (SUCCEEDED(hr))\n {\n \/\/ Add transitions to the storyboard<\/p>\n hr = pStoryboard->AddTransition(\n m_pAnimationVariableX<\/FONT>,\n pTransitionX<\/FONT>\n );\n if (SUCCEEDED(hr))\n {\n hr = pStoryboard->AddTransition(\n m_pAnimationVariableY<\/FONT>,\n pTransitionY<\/FONT>\n );\n \/\/ delete former “blue” transition<\/FONT>\n if (SUCCEEDED(hr))\n {\n \/\/ Get the current time and schedule the storyboard for play\n UI_ANIMATION_SECONDS secondsNow;\n hr = m_pAnimationTimer->GetTime(\n &secondsNow\n );\n if (SUCCEEDED(hr))\n {\n hr = pStoryboard->Schedule(\n secondsNow\n );\n }\n }\n }<\/p>\n \/\/ delete former “blue” transition<\/FONT><\/p>\n pTransitionY<\/FONT>->Release();\n }<\/p>\n pTransitionX<\/FONT>->Release();\n }<\/p>\n pStoryboard->Release();\n }<\/p>\n
return hr;\n}\n<\/PRE>\n
\nNow you can click the mouse on the client area,\nand the dot will chase it like a puppy.\n<\/P>\n
\nThe basic idea behind the Windows Animation Library\nis that for each property you want to animate,\nyou associate an animation variable,\nand when you want to perform the animation,\nyou create a transition for each variable describing\nhow you want the animation to proceed,\nput all the transitions into a storyboard,\nand then schedule the storyboard.\n<\/P>\n
\nOf course, you can build optimizations on top of the basic idea.\nFor example, you might not create the animation variable until\nthe first time you need to animate the property.\nAnother optimization is invalidating only the parts of the window\nthat need repainting,\nrather than invalidating the entire client area.\nYou can do this by registering a change handler on your variables:\nWhen the change handler notifies you that a value changed,\ninvalidate the old position and the new position.\nThis will erase the old location and draw at the new location.\n<\/P>\n
\n\nNext time<\/A>, I’ll build a program that animates a hundred objects,\njust for fun.\n<\/P><\/p>\n","protected":false},"excerpt":{"rendered":"Windows 7 provides a component known as the Windows Animation Manager, known to some people by its acronym WAM, pronounced “wham”. There are some nice sample programs for WAM on MSDN, but for some reason, the authors of the samples decided to animate the three color components of a resultant color. Because apparently the authors of […]<\/p>\n","protected":false},"author":1069,"featured_media":111744,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[25],"class_list":["post-4953","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-oldnewthing","tag-code"],"acf":[],"blog_post_summary":"
Windows 7 provides a component known as the Windows Animation Manager, known to some people by its acronym WAM, pronounced “wham”. There are some nice sample programs for WAM on MSDN, but for some reason, the authors of the samples decided to animate the three color components of a resultant color. Because apparently the authors of […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/posts\/4953","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/users\/1069"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/comments?post=4953"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/posts\/4953\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/media\/111744"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/media?parent=4953"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/categories?post=4953"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/oldnewthing\/wp-json\/wp\/v2\/tags?post=4953"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}