Positioning Buttons in the Multi-Page List object

The Multi Page List objects is a list object which does advanced formatting of data and creates a multi page list of items that the user can navigate through. However, the object does not allow you to manually position the navigation buttons, thus severely limiting your design choices.

This Tip of the day will describe how to position the navigation buttons any where that you want.

This uses the Multipage list example in the

MacromediaGenerator 2extrasMultiPageList

folder.

If the Multi Page List objects works like other list objects, then it just creates a bunch of key frames, each with different content. To move between items we just have to move around on the time line of the list object.

Make sure that you give the MP list object an instance name. In the object;s properties window, place “list” in the instance name column,

First we have to get rid of the buttons automatically put in.

Open up the Symbol Library, and edit the “CustomNext” graphic symbol. Delete all of the graphics in the symbol, but do not delete the symbol. Do the same thing for the “CustomPrevious” and “CustomHome” buttons.

By doing this, Generator will no longer automatically insert buttons into the list (we actually it will, but there will be nothing there).

Now all we have to do is to create our own buttons, and add some action script to make them work.

Create three buttons (next, previous, home) and place them on the main time line (or the same movie clip as the Multi Page List object).

Add the following code to each button :

Next :

on(release)
{
	if(list:_currentFrame == list:_totalFrames - 1)
	{
		tellTarget("list")
		{
			gotoAndStop(1);
		}
	}
	else
	{
		tellTarget("list")
		{
			nextFrame();
		}
	}
}

Prev :

on(release)
{
	if(list:_currentFrame == 1)
	{
		tellTarget("list")
		{
			gotoAndStop(_totalFrames);
		}
	}
	else
	{
		tellTarget("list")
		{
			prevFrame();
		}
	}
}

Home :

on(release)
{
	tellTarget("list")
	{
		gotoAndStop(1);
	}
}

Basically, the code in the next button checks to see if it is on the last frame of the list object, if it is it goes to the first frame. If it is not, then it goes to the next frame. The prev button does the same but in reverse.

Now, not only can you position your buttons, but they wrap when you get to the end or beginning of the list.

You can download a working example here.