none
Control de Estados con C# (Silverlight4)

    Pregunta

  • Saludos, genere una aplicación Silverlight en Spression Blend 4, la cual consta de XAML y C#. Alguien me puede aportar una idea sobre como convertir el XAML a C#. Es decir, como declarar los estados con C#.

    XAML de la aplicacion:

    <UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" x:Class="HolaEstados.MainPage" Width="400" Height="202"> <!--Objeto Canvas.--> <Canvas x:Name="LayoutRoot" Background="#FFDAA93E" > <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="VisualStateGroup">

    <!--Estado Visual 1--> <VisualState x:Name="EstadoVisual1"> <Storyboard> <ColorAnimation Duration="0" To="#FF2121E9" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rectangle" d:IsOptimized="True"/> </Storyboard> </VisualState>

    <!--Estado Visual 2--> <VisualState x:Name="EstadoVisual2"> <Storyboard> <ColorAnimation Duration="0" To="#FFF7CE0D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rectangle" d:IsOptimized="True"/> </Storyboard> </VisualState>

    <!--Estado Visual 3--> <VisualState x:Name="EstadoVisual3"> <Storyboard> <ColorAnimation Duration="0" To="#FFF13B12" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rectangle" d:IsOptimized="True"/> </Storyboard> </VisualState>

    </VisualStateGroup> </VisualStateManager.VisualStateGroups>

    <!--Objeto Button1.--> <Button Content="Estado1" Canvas.Left="8" Canvas.Top="68" Width="75" Click="eventoClick"/> <!--Objeto Button2.--> <Button Content="Estado3" Width="75" Canvas.Left="8" Canvas.Top="120" Click="eventoClick"/> <!--Objeto Button3.--> <Button Content="Estado2" Width="75" Canvas.Left="8" Canvas.Top="94" Click="eventoClick"/> <!--Objeto Rectangle.--> <Rectangle x:Name="rectangle" Fill="#FFF4F4F5" Height="125" Canvas.Left="223" Stroke="Black" Canvas.Top="68" Width="169"/> <!--Objeto TextBlock.--> <TextBlock Height="45" Width="384" Canvas.Left="8" Canvas.Top="8" TextWrapping="Wrap" FontSize="13.333" Text="Este ejemplo define un objeto Rectangle con 3 estados declarados con XAML, los cuales son invocados con C#." /> </Canvas> </UserControl>

    Codigo C# de la aplicacion:

    //Directivas using.
    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;
    
    //Espacio de nombres.
    namespace HolaEstados
    {
    	//Clase parcial derivada de UserControl denominada MainPage.
    	public partial class MainPage : UserControl
    	{
    		//Constructor.
    		public MainPage()
    		{
    			// Necesario para inicializar variables
    			InitializeComponent();
    		}
    
    		//Metodo manejador de eventos.
    		//Detecta sobre que boton se pulsa y segun el boton asigna un estado.
            private void eventoClick(object sender, RoutedEventArgs e)
            {
                //Obtiene la referencia al objeto que produce el evento y la almacena en varButton.
                Button varButton = e.OriginalSource as Button;
    
                //Sentencia if (Boton: Estado1).
                if (varButton.Content.ToString() == "Estado1")
                {
                    //Establece el Estado1.
                    VisualStateManager.GoToState(this, "EstadoVisual1", true);
                }
                //Sentencia else if (Boton: Estado2).
                else if (varButton.Content.ToString() == "Estado2")
                {
                    //Establece el Estado2.
                    VisualStateManager.GoToState(this, "EstadoVisual2", true);
                }
                //Sentencia else if (Boton: Estado3).
                else if ((varButton.Content.ToString() == "Estado3"))
                {
                    //Establece el Estado3.
                    VisualStateManager.GoToState(this, "EstadoVisual3", true);
                }
            }
    	}
    }


    El siguiente enlace muestra la aplicación en Internet:

    http://dl.dropbox.com/u/106467475/HolaEstadosSite/Default.html

    Agregue algo de código pero no funciona ¿Por que no funciona?

    Por favor, que algún MVP ayude a este simple mortal.

    <UserControl
    	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    	xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    	mc:Ignorable="d"
    	x:Class="HolaEstados.MainPage"
    	Width="400" Height="202">
    
    	<!--Objeto Canvas.-->
    	<Canvas x:Name="LayoutRoot" Background="#FFDAA93E" >
    		<VisualStateManager.VisualStateGroups>
    			<VisualStateGroup x:Name="objetoVisualStateGroup">
                    
    				<!--Estado Visual 1-->
    				<VisualState x:Name="EstadoVisual1">
    					<!--Agregado mediante codigo.-->
    				</VisualState>
                    
    				<!--Estado Visual 2-->
    				<VisualState x:Name="EstadoVisual2">
    					<Storyboard>
    						<ColorAnimation Duration="0" 
                                            To="#FFF7CE0D" 
                                            Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" 
                                            Storyboard.TargetName="objetoRectangle1" 
                                            d:IsOptimized="True"/>
    					</Storyboard>
    				</VisualState>
                    
    				<!--Estado Visual 3-->
    				<VisualState x:Name="EstadoVisual3">
    					<Storyboard>
    						<ColorAnimation Duration="0" 
                                            To="#FFF13B12" 
                                            Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" 
                                            Storyboard.TargetName="objetoRectangle1" 
                                            d:IsOptimized="True"/>
    					</Storyboard>
    				</VisualState>
                    
    			</VisualStateGroup>
    		</VisualStateManager.VisualStateGroups>
            
    		<!--Objeto Button1.-->
    		<Button Content="Estado1" Canvas.Left="8" Canvas.Top="68" Width="75" Click="eventoClick"/>
    		<!--Objeto Button2.-->
            <Button Content="Estado3" Width="75" Canvas.Left="8" Canvas.Top="120" Click="eventoClick"/>
    		<!--Objeto Button3.-->
            <Button Content="Estado2" Width="75" Canvas.Left="8" Canvas.Top="94" Click="eventoClick"/>
    		<!--Objeto objetoRectangle1.-->
    		<Rectangle x:Name="objetoRectangle1" Fill="#FFF4F4F5" Height="125" Canvas.Left="223" Stroke="Black" Canvas.Top="68" Width="169"/>
    		<!--Objeto TextBlock.-->
    		<TextBlock Height="45" Width="384" Canvas.Left="8" Canvas.Top="8" TextWrapping="Wrap" FontSize="13.333" 
    		Text="Este ejemplo define un objeto objetoRectangle1 con 3 estados declarados con XAML, los cuales son invocados con C#." />
    	</Canvas>
    </UserControl>

    //Directivas using.
    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;
    
    //Espacio de nombres.
    namespace HolaEstados
    {
    	//Clase parcial derivada de UserControl denominada MainPage.
    	public partial class MainPage : UserControl
    	{
    		//Constructor.
    		public MainPage()
    		{
    			// Necesario para inicializar variables
    			InitializeComponent();
    		}
    
    		//Metodo manejador de eventos.
    		//Detecta sobre que boton se pulsa y segun el boton asigna un estado.
            private void eventoClick(object sender, RoutedEventArgs e)
            {
                //Crea un objeto ColorAnimation.
                ColorAnimation objetoColorAnimation = new ColorAnimation();
                //Define la duracion de la animacion (0 Segundos).
                objetoColorAnimation.Duration = new Duration(TimeSpan.FromSeconds(0));
                //Establece el color que asigna el Estado1.
                objetoColorAnimation.To = Color.FromArgb(255, 254, 73, 0);
    
                //Define el numero de repeticiones de la escala de tiempo (Infinito).
                objetoColorAnimation.RepeatBehavior = RepeatBehavior.Forever;
                //Define si la escala de tiempo retrocede despues de completar una iteracion de avance.
                objetoColorAnimation.AutoReverse = false;
    
                //Crea un objeto Storyboard.
                Storyboard objetoStoryboard = new Storyboard();
                //Agrega el objetoColorAnimation al objetoStoryboard.
                objetoStoryboard.Children.Add(objetoColorAnimation);
                //Establece el objeto al cual se aplica la animacion.
                Storyboard.SetTarget(objetoColorAnimation, objetoRectangle1);
                //Establece el nombre de la propiedad de dependencia que se anima.
                Storyboard.SetTargetProperty(objetoColorAnimation, new PropertyPath(objetoRectangle1.Fill));
    
                //Agrega el objetoColorAnimation al EstadoVisual1.
                EstadoVisual1.Storyboard.Children.Add(objetoColorAnimation);
    
                //Obtiene la referencia al objeto que produce el evento y la almacena en varButton.
                Button varButton = e.OriginalSource as Button;
    
                //Sentencia if (Boton: Estado1).
                if (varButton.Content.ToString() == "Estado1")
                {
                    //Establece el Estado1.
                    VisualStateManager.GoToState(this, "EstadoVisual1", true);
                }
                //Sentencia else if (Boton: Estado2).
                else if (varButton.Content.ToString() == "Estado2")
                {
                    //Establece el Estado2.
                    VisualStateManager.GoToState(this, "EstadoVisual2", true);
                }
                //Sentencia else if (Boton: Estado3).
                else if ((varButton.Content.ToString() == "Estado3"))
                {
                    //Establece el Estado3.
                    VisualStateManager.GoToState(this, "EstadoVisual3", true);
                }
            }
    	}
    }






    • Editado MonsterCSharp jueves, 20 de septiembre de 2012 4:53 Agregar informacion
    miércoles, 19 de septiembre de 2012 4:19

Todas las respuestas

  • Me parece que tienes el mismo problema que esta persona, http://stackoverflow.com/questions/5696626/programmatic-state-changes-not-working-in-silverlight

    Saludos,

    jueves, 27 de septiembre de 2012 15:48
  • Lamentablemente no es la solución completa. Es decir, según leo esta persona quiere invocar los estados escritos en XAML con manejadores de eventos escritos en C#(Eso ya lo hice y muestro como hacerlo en el primer par de codigo). Yo lo que quiero es declarar los estados con C#. El como invocarlos es muy facil. Saludos y gracias por colaborar.

    Nota: Mi intención es que la pagina se descargue lo mas rápido posible y esto pretendo lograrlo declarando en C# tanto como me sea posible. Ah, y también pretendo agregar tantas consultas en el foro como pueda (Este mes no he tenido tiempo). Esto con la intención de popularizar el uso de Silverlight.
    viernes, 28 de septiembre de 2012 1:13