Navegando entre seções

Navegando entre seções

asf.core.elements.Navigation

Todas as aplicações (ASF e Section - Ambas herdam de asf.core.viewcontrollers.AbstractApplicationViewController) possuem uma propriedade chamada .navigation que é uma instância da classe asf.core.elements.Navigation.

Alguns métodos importantes

Abrir Seções

public function openSection( params:*, ... extraArguments ):Section

Parâmetros de openSection:

• params Você pode informar quatro tipos de valores nesse parâmetro:
  • String id String contendo o ID da seção a ser aberta
  • Section section Objeto Section da seção a ser aberta
  • params:Object ou params:NavigateParams Objeto contendo as seguintes propriedades:
    • sectionID:String = "" ID da seção a ser aberta
    • section:Section = null Objeto Section da seção a ser aberta
    • setAsCurrent:Boolean = true Caso o parâmetro "closeCurrentBeforeOpen" seja "false" e este seja "true", o framework carregará a próxima seção e só em seguida irá fechar a(s) anterior(es) para então abrir a próxima. Caso os dois sejam "false", nenhuma seção será fechada pela navegação.
    • closeCurrentBeforeOpen:Boolean = true Fecha ou não as seções atuais antes de carregar e abrir a próxima seção
    • preserveHistory:Boolean = false Caso true, não afeta o histórico da navegação
    • sectionsToCloseAfter:Vector.<Section> Vector contendo as seções que devem ser fechadas após a seção ser aberta
    • extraArguments:Array O mesmo que o parâmetro extraArguments do método openSection
    • withSubSection ID ou Section da subseção a ser aberta dentro da seção.
    • container Uma Sprite para ser usada como container. Esse parâmetro sobrescreve a layer da seção configurada no XML. Essa substituição é temporária, ela dura enquanto a seção estiver ativa.
• extraArguments Parâmetros adicionais que serão passadas para o método init da ISectionView

Este método retorna o objeto Section da seção aberta.. Isso pode ser usado para fazer o preloading da seção através de eventos:

var sectionHome:Section = app.navigation.openSection( "home" );

sectionHome.addEventListener( DependenciesProgressEvent.LOAD_COMPLETE, handleAppLoadComplete );
sectionHome.addEventListener( DependenciesProgressEvent.LOAD_PROGRESS, handleProgress );

Criando Loadings para seções

Você pode criar Loadings para serem exibidos durante o carregamento das seções. No exemplo a seguir, um loading é exibido após a seção atual ser fechada e enquanto a próxima seção é carregada. Após o carregamento o loading é removido e só depois a próxima seção é aberta:

app.navigation.addEventListener( NavigationEvent.CHANGE, onSectionNavigate );

private function onSectionNavigate(event:NavigationEvent):void
{
	var nextSection:Section = event.section;
	nextSection.addEventListener( ApplicationEvent.WILL_LOAD_DEPENDENCIES, onSectionWillLoad );
}

private function onSectionWillLoad(event:ApplicationEvent):void
{
	var nextSection:Section = event.target as Section;

	nextSection.removeEventListener( ApplicationEvent.WILL_LOAD_DEPENDENCIES, onSectionWillLoad );

	nextSection.pauseLoading( ); //Pausa o carregamento da seção para esperar o Loading ser exibido com animação

	nextSection.addEventListener( DependenciesProgressEvent.LOAD_COMPLETE, onSectionLoadComplete );
	nextSection.addEventListener( DependenciesProgressEvent.LOAD_PROGRESS, onSectionLoadProgress );
	nextSection.addEventListener( ApplicationEvent.WILL_DISPATCH_LOAD_COMPLETE, onSectionWillDispatchComplete );

	showLoading( ).queue( nextSection.resumeLoading );
}

private function onSectionWillDispatchComplete(event:ApplicationEvent):void
{
	var nextSection:Section = event.target as Section;

	nextSection.removeEventListener( ApplicationEvent.WILL_DISPATCH_LOAD_COMPLETE, onSectionWillDispatchComplete );

	nextSection.pauseLoading( ); //Pausa o carregamento da seção para esperar o Loading ser removido com animação

	loading.close( ).queue( nextSection.resumeLoading );
}

private function onSectionLoadProgress(event:DependenciesProgressEvent):void
{
	loading.setProgress( event.bytesLoaded / event.bytesTotal );
}

private function onSectionLoadComplete( evt:DependenciesProgressEvent = null ):void
{
	var nextSection:Section = evt.target as Section;

	nextSection.removeEventListener( DependenciesProgressEvent.LOAD_COMPLETE, onSectionLoadComplete );
	nextSection.removeEventListener( DependenciesProgressEvent.LOAD_PROGRESS, onSectionLoadProgress );
}

private function showLoading( ):Sequence
{
	loading.setProgress( 0 );
	return loading.open( );
}

Fechar Seções

public function closeSections( p_sections:Vector.<Section>, p_order:Array = null, p_parallel:Boolean = true, p_delays:Vector.<uint> = null ):Sequence

Parâmetros de closeSections:

• p_sections Vector preenchido com os objetos Section a serem fechados
• p_order Array de `String} com os IDs das seções na ordem em que devem ser fechadas
• p_parallel Determina se as seções são fechadas em paralelo ou não. Caso false serão fechadas em sequência.
• p_delays Vector de uint com o tempo de espera em millisegundos entre o fechamento de cada seção na ordem informada.

Retorna um objeto asf.core.util.Sequence. Com o retorno é possível adicionar eventos e identificar o momento em que a operação é finalizada.

Você também pode usar o método closeAllActiveSections para fechar todas as seções atualmente abertas. Ele também recebe os parâmetros p_order, p_parallel, p_delays e também retorna um Sequence.

Obs.: O método closeAllActiveSections não fecha as seções que tiverem o parâmetro closeOnNavigate definido como false

Exemplo:

var trans:Sequence = app.navigation.closeAllActiveSections( );
trans.addEventListener( SequenceEvent.TRANSITION_COMPLETE, handleCloseCurrentComplete );

ou

var trans:Sequence = app.navigation.closeAllActiveSections( );
trans.queue( handleCloseCurrentComplete );

Algumas propriedades Úteis

• sections Vector com todas as seções
• lastOpenedSection Última seção aberta
• currentActiveSections Todas as seções atualmente abertas
• history Objeto History com a navegação da seção. Com ele é possível voltar e avançar no histórico.