web-apps/apps/spreadsheeteditor/main/resources/help/en/UsageInstructions/ManipulateObjects.htm

45 lines
4 KiB
HTML
Raw Normal View History

2016-03-11 00:48:53 +00:00
<!DOCTYPE html>
<html>
<head>
<title>Manipulate objects</title>
<meta charset="utf-8" />
<meta name="description" content="Move, rotate, resize, reshape and arrange autoshapes, images, charts." />
<link type="text/css" rel="stylesheet" href="../editor.css" />
<script type="text/javascript" src="../callback.js"></script>
<script type="text/javascript" src="../search/js/page-search.js"></script>
2016-03-11 00:48:53 +00:00
</head>
<body>
<div class="mainpart">
<div class="search-field">
<input id="search" class="searchBar" placeholder="Search" type="text" onkeypress="doSearch(event)">
</div>
2016-03-11 00:48:53 +00:00
<h1>Manipulate objects</h1>
<p>You can resize, move, rotate and arrange autoshapes, images and charts inserted into your worksheet.</p>
<h3>Resize objects</h3>
<p>To change the autoshape/image/chart <b>size</b>, drag small squares <img alt="Square icon" src="../images/resize_square.png" /> situated on the object edges. To maintain the original proportions of the selected object while resizing, hold down the <b>Shift</b> key and drag one of the corner icons.</p>
2017-09-20 08:31:59 +00:00
<p class="note"><b>Note</b>: to resize the inserted chart or image you can also use the right sidebar that will be activated once you select the necessary object. To open it, click the <b>Chart settings</b> <img alt="Chart settings icon" src="../images/chartsettingsicon.png" /> or the <b>Image settings</b> <img alt="Image settings icon" src="../images/image_settings_icon.png" /> icon to the right.
2016-03-11 00:48:53 +00:00
<p><img alt="Maintaining proportions" src="../images/maintain_proportions.png" /></p>
<h3>Move objects</h3>
<p>To alter the autoshape/image/chart <b>position</b>, use the <img alt="Arrow" src="../images/arrow.png" /> icon that appears after hovering your mouse cursor over the object. Drag the object to the necessary position without releasing the mouse button.
To move the object by the one-pixel increments, hold down the <b>Ctrl</b> key and use the keybord arrows.
To move the object strictly horizontally/vertically and prevent it from moving in a perpendicular direction, hold down the <b>Shift</b> key when dragging.</p>
<h3>Rotate objects</h3>
<p>To <b>rotate</b> the autoshape/image, hover the mouse cursor over the rotation handle <img alt="Rotation Handle" src="../images/greencircle.png" /> and drag it clockwise or counterclockwise. To constrain the rotation angle to 15 degree increments, hold down the <b>Shift</b> key while rotating.</p>
<h3>Reshape autoshapes</h3>
<p>When modifying some shapes, for example Figured arrows or Callouts, the yellow diamond-shaped <img alt="Yellow diamond icon" src="../images/yellowdiamond.png" /> icon is also available. It allows to adjust some aspects of the shape, for example, the length of the head of an arrow.</p>
<p><img alt="Reshaping autoshape" src="../images/reshaping.png" /></p>
<h3 id="arrange">Arrange several objects</h3>
<p>If you have several objects (autoshapes, images and charts) overlapped you can arrange their order clicking the necessary object with the mouse and selecting the desired arrangement type from the right-click menu:</p>
<ul>
<li><b>Bring to Foreground</b> - to move the selected object in front of all other objects,</li>
<li><b>Send to Background</b> - to move the selected object behind all other objects,</li>
2017-09-20 08:31:59 +00:00
<li><b>Bring Forward</b> - to move the selected object by one level forward as related to other objects,</li>
<li><b>Send Backward</b> - to move the selected object by one level backward as related to other objects.</li>
2016-03-11 00:48:53 +00:00
</ul>
<h3>Group several objects</h3>
<p>To manipulate several objects at once, you can <b>group</b> them. Hold down the <b>Ctrl</b> key while selecting the objects with the mouse, then right-click to open the context menu and select the <b>Group</b> option.</p>
<p><img alt="Grouping objects" src="../images/grouping.png" /></p>
<p>To ungroup them, select the grouped objects with the mouse and use the <b>Ungroup</b> option from the right-click menu.</p>
</div>
</body>
</html>