Exercise - Controlling the Camera

<sidebar>Sidebar: Flowcode Exercises:Ex1</sidebar> This exercise assumes you have configured the System Panel options to your preference in the exercise Setting Up the System Panel

For a more in-depth look and practical use based on this exercise and creating a component using the System Panel and other Existing components such as dials then see the exercise Controlling Shapes.

Change the viewpoint

• Flowcode allows you to view these objects from different directions by changing the 'camera position' (viewpoint).

The first method uses the red, green and blue arrows at the top left hand corner of the System Panel.

First, click on the arrowhead of the green arrow.

This gives you a view of the objects from the 'green' direction.

Now do the same with the head of the red arrow, to see them from the 'red' direction.

Finally, clicking on the head of the blue arrow takes you back to the original view.

• There are three 'camera' controls that give finer control.

The first is the 'pan' control that allows you to move the viewpoint to one side.

To see this, click on the 'pan' control. Hold down the Ctrl key, and click the mouse anywhere on the System Panel.

As you move the cursor up and down or from side to side, the viewpoint moves accordingly.

Notice that the coordinates of the objects do not change. The objects stay in the same place, but they are viewed from a different place.

The second and third are 'camera rotation' controls.

Click on the first of these. Hold down the Ctrl key, and click the mouse anywhere on the System Panel.

As you move the cursor, the objects seem to rotate, though, if you look at the 'Rotation' settings on the Panel Properties, you see that these settings do not change. Again, it is the viewpoint that is changing.

Then, try the same with the other control.

Multiple views

• A powerful feature of Flowcode 6 is the ability to view the components from a number of different directions simultaneously.

• To see this:

Click on the 'General options' icon.

In 'Number of views:', click on the down-arrow and select "3".

By clicking on the appropriate arrowheads, set up each view as shown below.

(Depending on the size and shape of the Systems Panel, the three views may be arranged vertically, instead of horizontally.

Drag one edge of the Systems Panel sideways to see this effect. )

• You can adjust the viewpoint individually for each view, by operating the 'camera position' controls.

An example of doing so is given below - notice the positions of the red, green and blue arrows in each:

• Alternatively, you can make changes to the objects themselves, in which case all three views are affected at once.

In the next image, the instrument panel has been rotated:

You can see what is happening by viewing the Panel Properties. Changes to the objects themselves result in changes to properties such as 'Coordinates' and 'World size'.

Camera movement and rotation change the viewpoint, but do nothing to the properties of the objects themselves.

What next

Now that you know how to navigate and operate the System Panel effectively, you can move onto learn how to configure and set up the Dashboard Panel in the exercise Setting Up the Dashboard Panel.

If you want to practically use these functions with a real component for further clarity and understanding the see the exercise Controlling Shapes.

Video instructions

See the Aligning Objects on the Panel 1 video to learn the basics of aligning objects on the panel, this video covers the all available options of the 'Snap to' function including Snap to Grid, Objects and Table top.

The next video, Aligning Objects on the Panel 2, expands onto manipulating objects by moving, rotating and scaling / re-sizing objects to align them on the panel, this video makes use of the Project Explorer in order to manipulate the objects precisely.

Finally, the Alignig Objects on the Panel 3 video details additional options to effectively align objects on the panel, this includes various options from the context menu when you right-click a selected object.

5-IzDJ2NDcc}}		okbJ9pJrEeA}}
{{#ev:youtube|0b0jtQzBS9Q}}