tvDestaque ( estilo aqueles do terra, uol... < 123 > )

Question

Pessoal,

tenho que fazer aquelas tvDestaques estilo do uol, terra, ig, e diversos outros sites pela net.

Até que consegui fazer, mais acho que está bugado em algum lugar!

Se tiverem paciencia, ficam vendo sem clicar nos numeros uns 2 minutos, ele trava!!!


<iframe src="http://silverlight.services.live.com/invoke/84419/tvDestaque_Numeros/iframe.html" scrolling="no" frameborder="0" style="width:547px; height:278px"></iframe>

http://silverlight.services.live.com/invoke/84419/tvDestaque_Numeros/iframe.html

http://silverlight.live.com/ContentTestPage.aspx?setName=tvDestaque_Numeros

o codigo inteiro está aqui em c#:

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Browser;

namespace SilverlightApplication18_tvDestaques_NUMEROS
{
	public partial class Page : UserControl
	{
        public enum LinkPara { pagBanner1, pagBanner2, pagBanner3 };

        public LinkPara vaiPagina;

		public Page()
		{
			// Required to initialize variables
			InitializeComponent();
            //Chama a função banner1
            banner1();
            ///////////////////////////////////////////////////
            //Img Campo
            imgBanner1.Visibility = Visibility.Collapsed;
            //quadrado1.Visibility = Visibility.Collapsed;
            //Img Flores
            imgBanner2.Visibility = Visibility.Collapsed;
            quadrado2.Visibility = Visibility.Collapsed;
            //Img Floresta
            imgBanner3.Visibility = Visibility.Collapsed;
            quadrado3.Visibility = Visibility.Collapsed;
            ///////////////////////////////////////////////////
		}
        ///////////////////////////////////////////////////////////////////////
        //Funcao para o Banner 1 aparecer e os demais se esconder
        private void banner1_Inicia(object sender, EventArgs e)
        {
            //
            //O 2 se esconde, pois não será usado
            imgBanner2.Visibility = Visibility.Collapsed;
            quadrado2.Visibility = Visibility.Collapsed;
            Banner2.Stop();
            //
            //O 3 se esconde, pois não será usado
            imgBanner3.Visibility = Visibility.Collapsed;
            quadrado3.Visibility = Visibility.Collapsed;
            Banner3.Stop();
            //
            //O 1 começa
            Banner1.Begin();
            //
            vaiPagina = LinkPara.pagBanner1;
            //
            //O 1 completou? então ele chama a função do banner2_Inicia
            Banner1.Completed += banner2_Inicia;
            //O 1 aparece, pois será usado
            //imgBanner1.Visibility = Visibility.Visible;
            quadrado1.Visibility = Visibility.Visible;
            //
        }
        //Funcao para o Banner 2 aparecer e os demais se esconder
        private void banner2_Inicia(object sender, EventArgs e)
        {
            //
            //O 1 se esconde, pois não será usado
            imgBanner1.Visibility = Visibility.Collapsed;
            quadrado1.Visibility = Visibility.Collapsed;
            Banner1.Stop();
            //
            //
            //O 3 se esconde, pois não será usado
            imgBanner3.Visibility = Visibility.Collapsed;
            quadrado3.Visibility = Visibility.Collapsed;
            Banner3.Stop();
            //
            //
            //O 2 começa
            Banner2.Begin();
            //
            vaiPagina = LinkPara.pagBanner2;
            //
            //O 2 completou? então ele chama a função do banner3_Inicia
            Banner2.Completed += banner3_Inicia;
            //O 2 aparece, pois será usado
            //imgBanner2.Visibility = Visibility.Visible;
            quadrado2.Visibility = Visibility.Visible;
            //
        }
        //Funcao para o Banner 3 aparecer e os demais se esconder
        private void banner3_Inicia(object sender, EventArgs e)
        {
            //
            //O 1 se esconde, pois não será usado
            imgBanner1.Visibility = Visibility.Collapsed;
            quadrado1.Visibility = Visibility.Collapsed;
            Banner1.Stop();
            //
            //O 2 se esconde, pois não será usado
            imgBanner2.Visibility = Visibility.Collapsed;
            quadrado2.Visibility = Visibility.Collapsed;
            Banner2.Stop();
            //
            //
            //O 3 começa
            Banner3.Begin();
            //
            vaiPagina = LinkPara.pagBanner3;
            //
            //O 3 completou? então ele chama a função do banner1_Inicia
            Banner3.Completed += banner1_Inicia;
            //O 3 aparece, pois será usado
            //imgBanner3.Visibility = Visibility.Visible;
            quadrado3.Visibility = Visibility.Visible;
            //
        }
        ///////////////////////////////////////////////////////////////////////
        //
        private void banner1()
        {
            //
            //O 2 se esconde, pois não será usado
            imgBanner2.Visibility = Visibility.Collapsed;
            quadrado2.Visibility = Visibility.Collapsed;
            Banner2.Stop();
            //
            //O 3 se esconde, pois não será usado
            imgBanner3.Visibility = Visibility.Collapsed;
            quadrado3.Visibility = Visibility.Collapsed;
            Banner3.Stop();
            //
            //O 1 começa
            Banner1.Begin();
            //
            vaiPagina = LinkPara.pagBanner1;
            //
            //O 1 completou? então ele chama a função do banner2_Inicia
            Banner1.Completed += banner2_Inicia;
            //O 1 aparece, pois será usado
            //imgBanner1.Visibility = Visibility.Visible;
            quadrado1.Visibility = Visibility.Visible;
        }
        //
        private void banner2()
        {
            //
            //O 1 se esconde, pois não será usado
            imgBanner1.Visibility = Visibility.Collapsed;
            quadrado1.Visibility = Visibility.Collapsed;
            Banner1.Stop();
            //
            //O 3 se esconde, pois não será usado
            imgBanner3.Visibility = Visibility.Collapsed;
            quadrado3.Visibility = Visibility.Collapsed;
            Banner3.Stop();
            //
            //O 2 começa
            Banner2.Begin();
            //
            vaiPagina = LinkPara.pagBanner2;
            //
            //O 2 completou? então ele chama a função do banner3_Inicia
            Banner2.Completed += banner3_Inicia;
            //O 2 aparece, pois será usado
            //imgBanner2.Visibility = Visibility.Visible;
            quadrado2.Visibility = Visibility.Visible;
            //
        }
        //
        private void banner3()
        {
            //
            //O 1 se esconde, pois não será usado
            imgBanner1.Visibility = Visibility.Collapsed;
            quadrado1.Visibility = Visibility.Collapsed;
            Banner1.Stop();
            //
            //O 2 se esconde, pois não será usado
            imgBanner2.Visibility = Visibility.Collapsed;
            quadrado2.Visibility = Visibility.Collapsed;
            Banner2.Stop();
            //
            //O 3 começa
            Banner3.Begin();
            //
            vaiPagina = LinkPara.pagBanner3;
            //
            //O 3 completou? então ele chama a função do banner1_Inicia
            Banner3.Completed += banner1_Inicia;
            //O 3 aparece, pois será usado
            //imgBanner3.Visibility = Visibility.Visible;
            quadrado3.Visibility = Visibility.Visible;
            //
        }

        //
        ///////////////////////////////////////////////////////////////////////
        //BTN 1
        private void b1_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            banner1();
        }
        //BTN 2
        private void b2_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            banner2();
        }
        //BTN 3
        private void b3_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            banner3();
        }
        //BTN 'TRANSPARENTE' UNICO, QUE SERVE PARA TODOS
        private void btnTransparente_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            if (vaiPagina == LinkPara.pagBanner1)
            {
                HtmlPage.Window.Navigate(new Uri("http://www.globo.com"), "_blank");
            }
            else if (vaiPagina == LinkPara.pagBanner2)
            {
                HtmlPage.Window.Navigate(new Uri("http://www.uol.com.br"), "_blank");
            }
            else 
            //(vaiPagina == LinkPara.pagBanner3)
            {
                HtmlPage.Window.Navigate(new Uri("http://www.google.com"), "_blank"); 
            }

        }

	}
}

Não entendo nada de nada, tudo que sei foi aprendido na raça...

Então espero compreenção de vcs :)

Eu acho que o problema é aqui nas linhas:

Banner1.Completed += banner2_Inicia;

Acho que é um tipo de codigo que fica checando direto o tempo inteiro!
Estilo o EnterFrame do ActionScript do Flash.

Alguém pode me dar uma luz do que seria?
Existe outro codigo para 'limpar' (tirar da memoria) isso?

Valeuuuu

---

Web Motion Designer

Answer 1

Olá ophabyo .

Acho que voce está colocando complexidade d+ em uma coisa que deveria ser simples.
O numero de banners serão sempre 3? Para simplificar as transições voce pode trabalhar com States, deixe que o VisualStateManager do Silverlight controle cada um, irá facilitar seu trabalho. Se estiver utilizando o Silverlight 3 , voce também pode brincar com PixelShader para váriar o efeito de cada transição. Enfim, o Expression Blend é capaz de facilitar sua vida neste caso, vale a pena dar uma olhada para ver como é simples.

Answer 2

Olá ophabyo .

Acho que voce está colocando complexidade d+ em uma coisa que deveria ser simples.
O numero de banners serão sempre 3? Para simplificar as transições voce pode trabalhar com States, deixe que o VisualStateManager do Silverlight controle cada um, irá facilitar seu trabalho. Se estiver utilizando o Silverlight 3 , voce também pode brincar com PixelShader para váriar o efeito de cada transição. Enfim, o Expression Blend é capaz de facilitar sua vida neste caso, vale a pena dar uma olhada para ver como é simples.

Thiago,

vc falou grego!
brincadeira!

Não acho que estou complicando, tbm acho que deveria ser mais simples, no Flash faço em 5 minutos,
mais o siverlight ainda é um mundo novo!

São 3 storyboard, quando acaba um (fica checando se a storyboard completou [Completed]) , chama as funções para dar inicio ao outro.

Estou usando o Silverlight 2!

Tai uma dica para vc fazer ou o Lucas um tutorial! ;)

Valeeuuu

---

Web Motion Designer