• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

How to create navigation code where each button goes to specific frame?

New Here ,
Apr 12, 2017 Apr 12, 2017

Copy link to clipboard

Copied

Hi I'm new to animate and was looking for help regarding the navigation section. Please see images below for reference. I would like to have it so from the homepage you see below there is a navigation system and when you click on a certain button it takes you to that particular frame of the app. I managed to get it going to the gallery page and back to the home however once I add more code in it doesn't work and I'm not 100% how to write the code out for this. For example my gallery last 10 frames roughly so I wanted to start the music page on frame 12 and video frame 13. Also when on these page then the navigation must remain consistent so when I am on the video page the home and gallery buttons must go back to the relevant pages.

Hope you can understand this and thank you for your help

(ps- sorry if you don't like Celtic FC)

Capture.PNGcode1.PNGcode2.PNG

[Moved from non-technical Lounge to Adobe Animate forum by moderator]

Message was edited by: Jane Edwards

Views

320

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Apr 12, 2017 Apr 12, 2017

you should be using an array of image names and text file names (or just one array when you're ready to get fancier):

var index:int = -1;

var sourceA:Array = ['armstrong.png','player2.png',etc...];

var textA:Array = ['armstrong.txt','player2.txt',etc..];

previous_btn.addEventListener(MouseEvent.CLICK,prevF);

next_btn.addEventListener(MouseEvent.CLICK,nextF);

deactviateF(previous_btn);

function prevF(e:MouseEvent):void {

index--;

if(index==0){

deactivateF(previous_btn);

}

activateF(next_btn);

  img.source=("i

...

Votes

Translate

Translate
Community Expert ,
Apr 12, 2017 Apr 12, 2017

Copy link to clipboard

Copied

what code doesn't work?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 12, 2017 Apr 12, 2017

Copy link to clipboard

Copied

Hi I have since fixed this however I am now running into another issue perhaps you can help me on. screenshot1.PNGscreenshot2.PNG

The first image you see here is my home gallery page which is fine and the second image you see is what happens when you click the next player button. However on the second image there should be a previous button that is sitting on frame 3 that allows you to scroll back and forward through the players, showing an image of each player and a description. I have added my code below from frames 2 and 3.

code3.PNGcode4.PNG

This particular part is where I think the problem lies but not sure on that

scroll_bar.visible = false;

previous_btn.addEventListener(MouseEvent.CLICK,ldContent);

next_btn.addEventListener(MouseEvent.CLICK,ldContent1);

function ldContent1(e:MouseEvent):void {

  img.source=("images/armstrong.png");

  textLoad("armstrong.txt");

}

I have taking two images of a screenshot to show the desired outcome below that I am after. As you can see each separate image will sit in the UILoader and the text on the right but the next and previous buttons are not showing this. Only the first initial click of next player plays the first image.

outcome.PNG

Thanks for your help

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 12, 2017 Apr 12, 2017

Copy link to clipboard

Copied

LATEST

you should be using an array of image names and text file names (or just one array when you're ready to get fancier):

var index:int = -1;

var sourceA:Array = ['armstrong.png','player2.png',etc...];

var textA:Array = ['armstrong.txt','player2.txt',etc..];

previous_btn.addEventListener(MouseEvent.CLICK,prevF);

next_btn.addEventListener(MouseEvent.CLICK,nextF);

deactviateF(previous_btn);

function prevF(e:MouseEvent):void {

index--;

if(index==0){

deactivateF(previous_btn);

}

activateF(next_btn);

  img.source=("images/"+sourceA[index]);

  textLoad(textA[index]);

}

function nextF(e:MouseEvent):void {

index++;

if(index==sourceA.length){

deactivateF(next_btn);

}

activateF(previous_btn);

  img.source=("images/"+sourceA[index]);

  textLoad(textA[index]);

}

function deactivateF(btn):void{

btn.alpha = .3;

btn.mouseEnabled=false;

}

function activateF(btn):void{

btn.alpha = 1;

btn.mouseEnabled=true;

}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines