locked
Mascara animada RRS feed

  • Pergunta

  •  

    Pessoal,

     

    em termos de animação sem codigo, pelo um storyboard.

     

    É possivel fazer uma mascara animada como no Flash? Como?

     

    Valeuuu

    terça-feira, 28 de outubro de 2008 13:35

Todas as Respostas

  •  

    Exemplo:

     

    http://www.microsoft.com/pt/br/default.aspx

     

    essa "animação de banner em destaque" (como naqueles iguais do submarino, uol..etc..)

    reparem nos banners das pontas esquerda e direita (e até do centro), eles sai por baixo de alguma coisa tipo mascara:

     

    Imgs que dei PrintScreen na hora da animação:

     

    As pessoas "vão para fora" da area

     


    Comparando ao do site, nesta img o último menino não aparece completo

     

     

    Alguém já conseguiu fazer a mascara animada?

     

     

    Porque ela parada já fiz.

    Valeuuu
    sexta-feira, 12 de dezembro de 2008 16:16
  •  

    Ophabyo,

     

    Para fazer uma máscara animada, só precisa ser feito a máscara e adicionar a animação nela. Um exemplo, eu tenho uma imagem e quero um circulo animado como mascara. Primeiro eu crio a máscara (você disse que já conseguiu). Irá ficar assim seu código:

     

    Code Snippet

    <Image Source="MyImage.jpg">

    <Image.Clip>

    <EllipseGeometry x:Name="mascara" Center="100,100" RadiusX="100" RadiusY="50" />

    </Image.Clip>

    </Image>

     

     

    Depois você precisa aplicar a animação na sua máscara. Exemplo:

     

    Code Snippet

    <UserControl.Resources>

    <Storyboard x:Name="Storyboard1">

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:01" Storyboard.TargetName="mascara" Storyboard.TargetProperty="RadiusY">

    <SplineDoubleKeyFrame KeyTime="00:00:00" Value="50"/>

    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="100"/>

    </DoubleAnimationUsingKeyFrames>

    </Storyboard>

    </UserControl.Resources>

     

    Abraço,

     

    "Se sua pergunta foi respondida, por favor, marque como resposta."

    sexta-feira, 12 de dezembro de 2008 17:26
  •  

    Já tentei varias manieras jeitos, não dá certo.

     

    Você utiliza qual opção quando abre o Blend 2 ?

     

    WPF Application (.exe)

    WPF Control Library

    Silverlight 1 Site

    Silverlight 2 Application

     

    Pq para todos os testes e job, sempre utilizo a última (4ª) opção pois foi me passado para sempre utilizar ela para web.

     

    Por exemplo, animação de linha guia, funciona nos WPF´s mais não funciona para o "Silverlight 2 Application"

     

    Mais vou tentando por aqui..

     

    A sim, no caso do seu exemplo, o que queria era mover a mascara 'Ellipse' pela imagem (a img ficará parada) ou a Imagem andando (se movendo) e a Ellipse parada.

     

    Valeuuu.
    sexta-feira, 12 de dezembro de 2008 17:48
  •  

    Eu também utilizo o Silverlight 2 Application. Realmente, existe muitas propriedades que funcionam no WPF e não no Silverlight. WPF roda em cima de um framework inteiro, Silverlight em um plugin de 4 mb.

     

    Bom, eu achei um exemplo de Silverlight que utiliza alguns efeitos legais de máscara. Não é nenhuma linha guia, mas pode ser que isto já de ajude:

     

    http://www.shinedraw.com/?dl_id=99

     

    Para fazer uma ellipse como máscara se movendo, até onde eu sei, você deverá criar um objeto timer e ir posicionando através do X e Y (bem próximo) em loop.

     

    Infelizmente ainda existe algumas limitações do Silverlight.

     

    Abraço.

     

    "Se sua pergunta foi respondida, por favor, marque como resposta"

    quinta-feira, 18 de dezembro de 2008 18:24