Monday, 15 December 2014

Creating A Navigation Bar







This is the final result for a navigation bar. It can now when hovered over contrast to a lighter colour, to do this I clicked the button, then went to properties, and changed the brightness.



This is just the pop up you get to test it, by going on the Flash CC navigation Bar "Control" then to click on the test option.

Here's how you do the whole thing:

First make a button this will involve creating the shape you want, this can be done by selecting the rectangle tool. Then change the colour I chose a blue, blackish texture. Then convert to symbol- naming it "Navigation Button" which you then select button for type. Convert to symbol the second time only this time naming it "Navigation Movie" and choosing movie clip as the type. Select the button then go over to the up state, clicking it while pressing alt, and dragging it to hit. Now do the same for the over state. Click on the button going to properties, in there go to colour effect, then to style. This should have a brightness box, click this, bear in mind your on the over state, and change to 30%, now click hit state, and do the same changing the brightness to 64%. Now rename the layer 1- "Navigation Home". Create a new layer naming this "Text", and on that layer click the text tool, and type "Home". Make sure to choose a suitable colour for this.

After this stay on text layer, go on to the up state, while clicking, and pressing alt drag to the hit state. Go to the original page, and create 3 new layers name the first or bottom  layer "Navigation Home", the second one "Navigation Clients", third one "Navigation Services", and the fourth one "Navigation Contact Us". Now lock the Navigation Home layer, then click on the Navigation Clients, then go to the library clicking on the button you made, and duplicate naming this "Navigation Clients", and once this is created drag from the library next to the other button. Edit the text naming it "Client" aligning it so it looks good. Now repeat the same step for all of these locking the layer, and duplicating it naming it the one you locked.

Finally you need to match the canvas to the navigation bar to do this you need to gather the width, and height, and then go to modify, then document, and change the height, and x to the info you gathered so it matches, and your done.

No comments:

Post a Comment