1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US"> 3<head> 4<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5<meta http-equiv="Content-Style-Type" content="text/css" /> 6<link href="../../../../html/common/main.css" rel="stylesheet" type="text/css" /> 7<title>Animation</title> 8</head> 9<body> 10<h1>Animation</h1> 11<p>Animations can be created and edited using Curve Editor features.</p> 12<p>The setting items (nodes) displayed vary depending on the type of animation.</p> 13<p class="image"><img class="thumb" src="images/animation_edit.png" alt="Animation properties" /></p> 14<ol class="ui"> 15 <!-- =================================================== --> 16 <li>Animation properties are displayed.</li> 17 <!-- =================================================== --> 18 <li><a href="#graph_tree_view">Curve Tree View</a><br />Displays the nodes that can be selected for the animation being created. </li> 19 <!-- =================================================== --> 20 <li>The <a href="#tool_bar">Toolbar</a> is used to edit curves and keys.<BR> For details, see the description given in Toolbar. </li> 21 <li><a href="#graph_view">Curve View</a><br />Displays the animation curve for the node selected in the Curve Tree View.<br /> The curve can be edited in this view.</li> 22</ol> 23<h2>List of Curve Editor Operations</h2> 24<p>This is a list of Curve Editor operations.</p> 25<table class="toolbar"> 26 <thead> 27 <tr> 28 <th>Operation</th> 29 <th>Feature</th> 30 </tr> 31 </thead> 32 <tbody> 33 <tr> 34 <td>[S]</td> 35 <td>Add key</td> 36 </tr> 37 <tr> 38 <td>[Delete]<br /> [BackSpace]</td> 39 <td>Delete key</td> 40 </tr> 41 <tr> 42 <td>CTRL+C</td> 43 <td>Copy key</td> 44 </tr> 45 <tr> 46 <td>CTRL+V</td> 47 <td>Paste key</td> 48 </tr> 49 <tr> 50 <td>CTRL+X</td> 51 <td>Cut key</td> 52 </tr> 53 <tr> 54 <td>[A]</td> 55 <td>Fit all to view</td> 56 </tr> 57 <tr> 58 <td>[F]</td> 59 <td>Fit selection to view</td> 60 </tr> 61 <tr> 62 <td>[R]</td> 63 <td>Fit frame range to view</td> 64 </tr> 65 <tr> 66 <td>[Ctrl] + [+]</td> 67 <td>Enlarge view</td> 68 </tr> 69 <tr> 70 <td>[Ctrl] + [-]</td> 71 <td>Reduce view</td> 72 </tr> 73 <tr> 74 <td>[N]</td> 75 <td>Select previous curve</td> 76 </tr> 77 <tr> 78 <td>[M]</td> 79 <td>Select next curve</td> 80 </tr> 81 <tr> 82 <td>[,]</td> 83 <td>Select previous key</td> 84 </tr> 85 <tr> 86 <td>[.]</td> 87 <td>Select next key</td> 88 </tr> 89 <tr> 90 <td>[↑] [↓]</td> 91 <td>Edit value of selected key</td> 92 </tr> 93 <tr> 94 <td>[←] [→]</td> 95 <td>Edit selected key frame</td> 96 </tr> 97 <tr> 98 <td>[ I ]</td> 99 <td>Set key mode to "Insert Keys."</td> 100 </tr> 101 </tbody> 102</table> 103<p><a name="graph_tree_view" id="graph_tree_view"></a></p> 104<h2>Curve Tree View</h2> 105<p>Displays a tree view of the curves included in animations.<br /> You can select and edit curves. </p> 106<p class="image"><img src="images/animation_edit01.png" alt="Animation properties" /></p> 107<ol class="ui"> 108 <!-- =================================================== --> 109 <li>This group of icons is used to change the display status of the Curve Tree View. 110 <table class="toolbar_list"> 111 <thead> 112 <tr> 113 <th>Icon</th> 114 <th>Description</th> 115 </tr> 116 </thead> 117 <tbody> 118 <tr> 119 <td align="center"><img class="list" src="images/node_curve_icon.png" alt="Show nodes that have curves" /></td> 120 <td>This is a filter button. Only nodes that have curves are shown if selected.</td> 121 </tr> 122 <tr> 123 <td align="center"><img class="list" src="images/tree_reset_icon.png" alt="Reset tree status" /></td> 124 <td>Resets the tree status.</td> 125 </tr> 126 <tr> 127 <td align="center"><img class="list" src="images/tree_open_icon.png" alt="Open all trees" /></td> 128 <td>Expands the tree to show lower branches.</td> 129 </tr> 130 <tr> 131 <td align="center"><img class="list" src="images/node_show_icon.png" alt="Show all nodes" /></td> 132 <td>Puts all nodes in show status.<BR> The show/hide checkboxes for nodes are all selected.</td> 133 </tr> 134 <tr> 135 <td align="center"><img class="list" src="images/node_hide_icon.png" alt="Hide all nodes" /></td> 136 <td>Puts all nodes in hide status.<BR> The show/hide checkboxes for nodes are all unselected.</td> 137 </tr> 138 </tbody> 139 </table> 140 </li> 141 <!-- =================================================== --> 142 <li>Curve Tree View<BR>Displays selectable nodes.<BR> When a node that has a curve is selected, the curve is displayed in the Curve View.<BR> Show/hide can be switched for curves using the checkbox included for each node.<BR> 143 <table class="toolbar_list"> 144 <caption> 145 Curve State 146 </caption> 147 <thead> 148 <tr> 149 <th>Icon</th> 150 <th>Description</th> 151 </tr> 152 </thead> 153 <tbody> 154 <tr> 155 <td align="center"><img class="list" src="images/curve_icon.png" alt="Show nodes that have curves" /></td> 156 <td>A curve that does not have configured keys.</td> 157 </tr> 158 <tr> 159 <td align="center"><img class="list" src="images/curve_icon01.png" alt="Show nodes that have curves" /></td> 160 <td>A curve that does not have configured keys and has not been selected.</td> 161 </tr> 162 <tr> 163 <td align="center"><img class="list" src="images/curve_icon02.png" alt="Show nodes that have curves" /></td> 164 <td>A curve that has configured keys and has been selected.</td> 165 </tr> 166 </tbody> 167 </table> 168 </li> 169 <!-- =================================================== --> 170</ol> 171<p><a name="graph_view" id="graph_view"></a></p> 172<h2>Curve View</h2> 173<p>In Curve View, you can create and edit animation curves.</p> 174<ul class="sub_page"> 175 <li><a href="#curve_mousing">Mouse Operations in Curve View</a></li> 176 <li><a href="#curve_key_selection">Selecting Curves and Keys</a></li> 177 <li><a href="#add_key">Add key</a></li> 178 <li><a href="#copy_and_paste">Copy and Paste</a></li> 179</ul> 180<p class="image"><img src="images/animation_chart_view.png" alt="Animation Graph View" /></p> 181<ol class="ui"> 182 <li>This is the Curve View.<br /> It is used to select and edit curves and keys.</li> 183 <!-- =================================================== --> 184 <li>Indicates the range of animation frames.<BR> The area outside the range of frames is displayed with a darkened background.</li> 185 <!-- =================================================== --> 186 <li>This is an animation curve.<BR> The color of lines is determined based on the attribute type.</li> 187 <!-- =================================================== --> 188 <li>This is the time slider area.</li> 189 <li>This icon is for switching the display of key information.<BR> If information display is enabled, the following key information is displayed when a key is selected in the Curve View.<BR> 190 <table class="toolbar_list"> 191 <caption> 192 Displayed Key Information 193 </caption> 194 <thead> 195 <tr> 196 <th>Icon</th> 197 <th>View Display</th> 198 <th>Displayed Information</th> 199 </tr> 200 </thead> 201 <tbody> 202 <tr> 203 <td align="center"><img class="list" src="images/curve_key_info.png" alt="Frame and Value Display Icon" /></td> 204 <td><img src="images/curve_key_info01.png" alt="Frame and Value Display" /></td> 205 <td>Displays the number of frames and values for the selected key.</td> 206 </tr> 207 <tr> 208 <td align="center"><img class="list" src="images/curve_key_info02.png" alt="Slope Information Display Icon" /></td> 209 <td><img src="images/curve_key_info03.png" alt="Display slope information" /></td> 210 <td>Displays slope information for the selected key.</td> 211 </tr> 212 <tr> 213 <td align="center"><img class="list" src="images/curve_key_info04.png" alt="Displays the maximum and minimum values set for the curve. " /></td> 214 <td><img src="images/curve_key_info05.png" alt="Display maximum and minimum values" /></td> 215 <td>Displays the maximum and minimum values for keys adjacent to the selected key.</td> 216 </tr> 217 </tbody> 218 </table> 219 </li> 220</ol> 221<p><a name="curve_mousing" id="curve_mousing"></a></p> 222<h3>Mouse Operations in Curve View</h3> 223<p>Mouse operations in Curve View are given below.</p> 224<table class="toolbar"> 225 <thead> 226 <tr> 227 <th>Operation</th> 228 <th>Description</th> 229 </tr> 230 </thead> 231 <tbody> 232 <tr> 233 <td>Left button click</td> 234 <td>Selects keys.</td> 235 </tr> 236 <tr> 237 <td>Left button range selection</td> 238 <td>Selects keys and curves inside the selected range.</td> 239 </tr> 240 <tr> 241 <td>Center button drag</td> 242 <td>Moves a key when the key mode is "move closest key" or "move multiple keys".<BR> Move closest key moves the closest key from the location where the center button is dragged.<BR> Move multiple keys moves keys that are in selected status. </td> 243 </tr> 244 <tr> 245 <td>Center button click</td> 246 <td>If the key mode is "insert keys," keys are inserted based on the value and slope evaluated for the curve in the frame where the center button was pressed.<BR> If the key mode is "add keys," keys are added in the location where the center button was pressed. </td> 247 </tr> 248 <tr> 249 <td>SHIFT + Center button drag</td> 250 <td>This operation is enabled when the key mode is "move closest key" or "move multiple keys".<BR> This limits the movement of keys to vertical or horizontal motion.</td> 251 </tr> 252 <tr> 253 <td>Alt + Center button drag</td> 254 <td>Slides the view. </td> 255 </tr> 256 <tr> 257 <td>Alt+Right or left button drag</td> 258 <td>Changes the view scale to uniform.</td> 259 </tr> 260 <tr> 261 <td>Alt+Shift+Right button Left/right drag start</td> 262 <td>Changes the scale of the view in the frame direction.</td> 263 </tr> 264 <tr> 265 <td>Alt+Shift+Right button Up/down drag start</td> 266 <td>Changes the scale of the view in the value direction.</td> 267 </tr> 268 </tbody> 269</table> 270<p><a name="curve_key_selection" id="curve_key_selection"></a></p> 271<h3>Selecting Curves and Keys</h3> 272<p>The curve view can be used to select (multiple) curves, keys, and slopes.</p> 273<table class="toolbar"> 274 <thead> 275 <tr> 276 <th>State</th> 277 <th>View Display</th> 278 <th>Selection Method</th> 279 </tr> 280 </thead> 281 <tbody> 282 <tr> 283 <td>Unselected</td> 284 <td><img src="images/curve_view01.png" alt="Show nodes that have curves" /></td> 285 <td>Selects the area containing nothing in the curve display region.</td> 286 </tr> 287 <tr> 288 <td>Curve selected</td> 289 <td><img src="images/curve_view02.png" alt="Show nodes that have curves" /></td> 290 <td>Select the corresponding items in the Curve Tree View or range select a curve using the left mouse button.</td> 291 </tr> 292 <tr> 293 <td>Key selected</td> 294 <td><img src="images/curve_view03.png" alt="Show nodes that have curves" /></td> 295 <td>Left click the key you want to select included in the curve or range select using the left mouse button.<BR> When a key is selected, it is highlighted and the slope handle is displayed.</td> 296 </tr> 297 <tr> 298 <td>Slope selected</td> 299 <td><img src="images/curve_view04.png" alt="Show nodes that have curves" /></td> 300 <td>Either left click the leading edge of the slope handle while a key is selected or range select using the left mouse button. </td> 301 </tr> 302 </tbody> 303</table> 304<p><a name="add_key" id="add_key"></a></p> 305<h3>Add key</h3> 306<p>This section describes the procedure for adding a key to any frame of an existing curve. </p> 307<ol> 308 <li><a href="#curve_key_selection">Select the curve</a> to which the key is to be added.</li> 309 <li>Place the mouse cursor in the location where you want to add the key and press [S].</li> 310 <li>The key will be added to the selected location.</li> 311 <li>Select the added key and enter numeric values for "frame" and "value" on the <a href="#tool_bar">Toolbar</a>.</li> 312</ol> 313<p><a name="copy_and_paste" id="copy_and_paste"></a></p> 314<h3>Copy and Paste</h3> 315<p>Curves and keys selected in the Curve View can be copied and pasted using Ctrl+C and Ctrl+V. </p> 316<p>There are two types of copying.</p> 317<ul> 318 <li>Copy a curve (multiple curves cannot be copied simultaneously)</li> 319 <li>Copy a key (multiple keys can be copied simultaneously)</li 320> 321</ul> 322<p>It is possible to paste to the selected curve.</p> 323<p>Operations during pasting are set using <a href="#curve_paste">paste items on the Toolbar</a>.</p> 324<p><a name="tool_bar" id="tool_bar"></a></p> 325<h2>Toolbar</h2> 326<p class="image"><img src="images/curve_tool_bar.png" alt="Curve Editor Toolbar" /></p> 327<ol class="ui"> 328 <li>Key mode, key type, key frame, and value clamping can be selected using icons.<BR> Hovering the cursor over any icon gives a description of its function. </li> 329 <!-- =================================================== --> 330 <li>Snap<BR>The snap unit for the value and frame of the key to be added can be selected from a pull-down menu.</li> 331 <!-- =================================================== --> 332 <li><a href="#curve_paste">Paste</a><br /> The position and method to use for pasting a copied key can be selected from a pull-down menu.</li> 333 <!-- =================================================== --> 334 <li>Use numeric input to set the number of frames and values for keys selected in the Curve View.</li> 335 <li>Use numeric input to set the slope for the selected key.</li> 336</ol> 337<p><a name="curve_paste" id="curve_paste"></a></p> 338<h3>Paste</h3> 339<p>This section describes the position and method of selecting from the pull-down menu for pasting. </p> 340<table class="toolbar"> 341 <caption> 342 Position 343 </caption> 344 <thead> 345 <tr> 346 <th>Pull-down Menu Items</th> 347 <th>Description</th> 348 </tr> 349 </thead> 350 <tbody> 351 <tr> 352 <td>Cursor Position</td> 353 <td>Pastes the key to the cursor position.</td> 354 </tr> 355 <tr> 356 <td>The copy destination</td> 357 <td>The frame (horizontal axis) is located at the cursor position. The value of the copy destination is used for value (vertical axis).</td> 358 </tr> 359 <tr> 360 <td>Copy</td> 361 <td>The value of the copy destination is used for both the frame (horizontal axis) and value (vertical axis).</td> 362 </tr> 363 </tbody> 364</table> 365<table class="toolbar"> 366 <caption> 367 Method 368 </caption> 369 <thead> 370 <tr> 371 <th>Pull-down Menu Items</th> 372 <th>Description</th> 373 </tr> 374 </thead> 375 <tbody> 376 <tr> 377 <td>Insert</td> 378 <td>Inserts and pasts the copied key.<BR> The frames of keys located after the paste position are increased by the number of curve frames that have been pasted. </td> 379 </tr> 380 <tr> 381 <td>Replace</td> 382 <td>Replaces and pastes the copied key.<BR> Keys that already exist are replaced by the pasted key (curve).</td> 383 </tr> 384 <tr> 385 <td>Merge</td> 386 <td>Merges and pastes the copied key.<BR> The copied key is pasted while leaving already existing keys in place.<br /> The result is a where the already existing key is merged with the pasted key.</td> 387 </tr> 388 </tbody> 389</table> 390<hr><p>CONFIDENTIAL</p></body> 391</html> 392