locked
Panorama com ApplicationBar RRS feed

  • Pergunta

  • Olá pessoal,

    Tenho a seguinte dúvida, como faço para utilizar o applicationBar em um panorama, onde, ao deslizar para o item seguinte do panorama, mude as opções do item applicationBar.

    Desde já,

    Agradeço a atenção.

    terça-feira, 6 de novembro de 2012 17:53

Respostas

  • Sergio, boa noite.

    Paguei minha língua. Houve a necessidade absoluta de criar uma appbar no Panorama. Consegui fazer funcionar com a ApplicationBar padrão do WP.

    Estive no Nokia Developer Day em SP que aconteceu no dia 21/11/2012 e este conceito vem de encontro com as novas Apps para Windows 8 e Windows Phone 8.

    Você cria as regras de apresentação dos botões na própria exibição da AppBar. Também esconde a AppBar quando terminar de usar. Muito legal que desta maneira você pode customizar as descrições para outros idiomas utilizando o Resources!

    Funciona muito bem, inclusive já publiquei a app sem remorsos.

    Não esquece de comentar todo código da ApplicationBar no XAML, pois agora todo controle fica no codebehind (C# neste exemplo).

    Segue o código abaixo.

    Abraço!

            public void CriaApplicationBar()
            {
                this.ApplicationBar = new ApplicationBar();
                this.ApplicationBar.IsVisible = true;
                this.ApplicationBar.IsMenuEnabled = true;
    
                // ApplicationBar Buttons
                ApplicationBarIconButton btnLancamentoQuitar = new ApplicationBarIconButton();
                btnLancamentoQuitar.IconUri = new Uri("Toolkit.Content/ApplicationBar.Select.png", UriKind.Relative);
                btnLancamentoQuitar.Text = dicionario.btnLancamentoPagar;
                btnLancamentoQuitar.Click += new EventHandler(btnLancamentoQuitar_Click);
                this.ApplicationBar.Buttons.Add(btnLancamentoQuitar);
                
    
                ApplicationBarIconButton btnLancamentoApagar = new ApplicationBarIconButton();
                btnLancamentoApagar.IconUri = new Uri("Toolkit.Content/ApplicationBar.Delete.png", UriKind.Relative);
                btnLancamentoApagar.Text = dicionario.btnLancamentoApagar;
                btnLancamentoApagar.Click += new EventHandler(btnLancamentoApagar_Click);
                this.ApplicationBar.Buttons.Add(btnLancamentoApagar);
            }
    
    
            public void EscondeApplicationBar()
            {
                this.ApplicationBar = null;
            }


    Andrey Kurka (MCC) | Federal Case | @federalcaseinfo



    sexta-feira, 23 de novembro de 2012 01:48

Todas as Respostas

  • Hum... acho que panorama não tem o controle applicationBar, se conseguir me avisa.

    Paulo Rogério

    terça-feira, 6 de novembro de 2012 18:42
  • Sergio,

    Controle nativo não há. Pode encontrar de terceiros, mas desconheço.

    Neste caso você utiliza o Pivot.

    Abraço.


    Andrey Kurka (MCC) | Federal Case | @federalcaseinfo

    terça-feira, 6 de novembro de 2012 18:53
  • Paulo, até consegui utilizar, porém, de forma fixa os itens do applicationBar

    e o que queria era que por exemplo, no item um do panorama, tenho a opção de "salvar" e o deslizar para o item 2 do panorama, modifique as opções para "editar e "excluir" no item applicationBar.

    segue abaixo um exemplo que fiz só que de forma fixa, talvez possa te ajudar. 

    <!--<!--LayoutRoot contains the root grid where all other page content is placed-->
        <Grid x:Name="LayoutRoot">
            <controls:Panorama Title="my application">

                <!--Panorama item one-->
                <controls:PanoramaItem Header="item1">
                    <Grid/>
                </controls:PanoramaItem>

                <!--Panorama item two-->
                <controls:PanoramaItem Header="item2">
                    <Grid/>
                </controls:PanoramaItem>
            </controls:Panorama>
        </Grid>

        <phone:PhoneApplicationPage.ApplicationBar>
            <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
                <!--<shell:ApplicationBarIconButton IconUri="/Imagens/add.png" Text="Novo" Click="btnNovo_Click" />-->
                <shell:ApplicationBar.MenuItems>
                    <shell:ApplicationBarMenuItem Text="Item de Menu" />
                </shell:ApplicationBar.MenuItems>
            </shell:ApplicationBar>
        </phone:PhoneApplicationPage.ApplicationBar>
    </phone:PhoneApplicationPage>-->

    terça-feira, 6 de novembro de 2012 19:02
  • Vlw Andrey a dica,

    Encontrei isto, estou mexendo nele, mas quem quiser ir dando uma olhada.

    http://www.windowsphonegeek.com/articles/Advanced-ApplicationBar-for-Windows-Phone

    terça-feira, 6 de novembro de 2012 20:14
  • Implementei aqui e fiz uns testes.

    Aparentemente funciona, mas testa bastante antes de publicar. Já aconteceu comigo de usar um componente de terceiros e tive sérios problemas.

    Se não for Telerik, Visifire, Windows Phone Toolkit ou algum recomendado por desenvolvedores experientes, não arrisco. Até mesmo porque não é um padrão do Panorama trabalhar com Application Bar.

    Qualquer coisa, volta aqui e vamos trocando figurinhas.

    Abraço.


    Andrey Kurka (MCC) | Federal Case | @federalcaseinfo

    terça-feira, 6 de novembro de 2012 23:01
  • private void panPrincipal_SelectionChanged(object sender, System.Windows.Controls.SelectionChangedEventArgs e)
            {
                ApplicationBar.IsVisible = (panPrincipal.SelectedItem == ipanPanorama1) || (panPrincipal.SelectedItem == ipanPanorama2);
                ((ApplicationBarIconButton)ApplicationBar.Buttons[1]).Isvisible = (panPrincipal.SelectedItem == ipanPanorama2);
                ((ApplicationBarMenuItem)ApplicationBar.MenuItems[0]).Isvisible = (panPrincipal.SelectedItem == ipanPanorama1);
                ((ApplicationBarMenuItem)ApplicationBar.MenuItems[2]).Isvisible = (panPrincipal.SelectedItem == ipanPanorama1);
                ((ApplicationBarMenuItem)ApplicationBar.MenuItems[3]).Isvisible = (panPrincipal.SelectedItem == ipanPanorama1);
                ((ApplicationBarMenuItem)ApplicationBar.MenuItems[4]).Isvisible = (panPrincipal.SelectedItem == ipanPanorama2);
            }
    Se voce declarar todos os botões e menus no XAML pode determinar onde sera visivel assim(acima)


    quarta-feira, 14 de novembro de 2012 17:23
  • Sergio, boa noite.

    Paguei minha língua. Houve a necessidade absoluta de criar uma appbar no Panorama. Consegui fazer funcionar com a ApplicationBar padrão do WP.

    Estive no Nokia Developer Day em SP que aconteceu no dia 21/11/2012 e este conceito vem de encontro com as novas Apps para Windows 8 e Windows Phone 8.

    Você cria as regras de apresentação dos botões na própria exibição da AppBar. Também esconde a AppBar quando terminar de usar. Muito legal que desta maneira você pode customizar as descrições para outros idiomas utilizando o Resources!

    Funciona muito bem, inclusive já publiquei a app sem remorsos.

    Não esquece de comentar todo código da ApplicationBar no XAML, pois agora todo controle fica no codebehind (C# neste exemplo).

    Segue o código abaixo.

    Abraço!

            public void CriaApplicationBar()
            {
                this.ApplicationBar = new ApplicationBar();
                this.ApplicationBar.IsVisible = true;
                this.ApplicationBar.IsMenuEnabled = true;
    
                // ApplicationBar Buttons
                ApplicationBarIconButton btnLancamentoQuitar = new ApplicationBarIconButton();
                btnLancamentoQuitar.IconUri = new Uri("Toolkit.Content/ApplicationBar.Select.png", UriKind.Relative);
                btnLancamentoQuitar.Text = dicionario.btnLancamentoPagar;
                btnLancamentoQuitar.Click += new EventHandler(btnLancamentoQuitar_Click);
                this.ApplicationBar.Buttons.Add(btnLancamentoQuitar);
                
    
                ApplicationBarIconButton btnLancamentoApagar = new ApplicationBarIconButton();
                btnLancamentoApagar.IconUri = new Uri("Toolkit.Content/ApplicationBar.Delete.png", UriKind.Relative);
                btnLancamentoApagar.Text = dicionario.btnLancamentoApagar;
                btnLancamentoApagar.Click += new EventHandler(btnLancamentoApagar_Click);
                this.ApplicationBar.Buttons.Add(btnLancamentoApagar);
            }
    
    
            public void EscondeApplicationBar()
            {
                this.ApplicationBar = null;
            }


    Andrey Kurka (MCC) | Federal Case | @federalcaseinfo



    sexta-feira, 23 de novembro de 2012 01:48
  • Vlw Andrey, esta maneira eu desconhecia,

    cara resolvi o meu problema com o "PhoneApplicationPage.Resources" e depois tratei no "SelectionChanged" do panorama, ficou assim...

    XAML:

        <Grid x:Name="LayoutRoot">
            <controls:Panorama Name="Panorama"  Title="Teste" FontFamily="Segoe WP Bold" SelectionChanged="Panorama_SelectionChanged">
                <!--Panorama item one-->
                <controls:PanoramaItem Header="Item 1">
                    <Grid>
                      
                    </Grid>
                </controls:PanoramaItem>
    
                <!--Panorama item two-->
                <controls:PanoramaItem Header="Item 2">
                    <Grid>
                       
                    </Grid>
                </controls:PanoramaItem>
            </controls:Panorama>
        </Grid>
    
        <phone:PhoneApplicationPage.Resources>
            <shell:ApplicationBar x:Key="1" IsVisible="True" IsMenuEnabled="True" Opacity="0">
                <shell:ApplicationBarIconButton IconUri="/Imagens/add.png" Text="Novo" Click="btnNovo_Click"/>
            </shell:ApplicationBar>
    
            <shell:ApplicationBar x:Key="2" IsVisible="True" IsMenuEnabled="True" Opacity="0">
                <shell:ApplicationBar.MenuItems>
                    <shell:ApplicationBarMenuItem Text="Teste 1..." Click="BtnVisualizar_Click"/>
                    <shell:ApplicationBarMenuItem Text="teste 2..." Click="BtnExcluir_Click"/> 
                </shell:ApplicationBar.MenuItems>
            </shell:ApplicationBar>
        </phone:PhoneApplicationPage.Resources> 
    </phone:PhoneApplicationPage>

    CB:

    private void Panorama_SelectionChanged(object sender, SelectionChangedEventArgs e) { string aux; switch (Panorama.SelectedIndex) { case 0: aux = "1"; break; case 1: aux = "2"; break; }

    ApplicationBar = (Microsoft.Phone.Shell.ApplicationBar)Resources[aux]; }

    Peço desculpas por não ter postado antes é que to compenetrado aqui no App (hehehe...) e só voltei a entrar no fórum agora que surgiu uma dúvida, dai vi sua resposta.

    Abraço!

    sexta-feira, 23 de novembro de 2012 06:56
  • Sem problemas!

    Assim que cheguei do evento eu montei a solução, testei e procurei seu post para compartilhar a boa notícia.

    O que achei mais bacana é que não precisamos de um componente de terceiros. Resolveu tudo pelo SDK original.

    Abraço!


    Andrey Kurka (MCC) | Federal Case | @federalcaseinfo

    sábado, 24 de novembro de 2012 01:39