none
Cambiar el color de un boton al pasar el mouse por encima WPF XAML RRS feed

  • Pregunta

  • tengo esta linea XAML

    <Button Content="Reportes" Width="90" Background="#FF364E6F" Foreground ="White"></Button>

    quiero que al pasar el mouse por encima cambiar el color Background y el Foreground 

    Esto se lograría solo en XAML???

    Lo que pasa es que tambien estoy aprendiendo MVVM y no quiero usar code behind como esto es diseño mi duda es si la vista por si misma XAML puede lograr esto sin usar code Behind???

    Si no es posible hacerlo solo desde la vista entonces ese cambio deberia hacerse en el VieModel???

    martes, 10 de abril de 2018 5:53

Todas las respuestas

  • hice el siguiente axml en el app

    pero algo me esta fallando en triger podrian apoyarme, la idea es que cuando el mouse pase por arriba del control cambie su bacground y su foreground

    <Window.Resources>
    		<Style x:Key="ButtonModules" TargetType="Button">
    			<Setter Property="Template">
    				<Setter.Value>
    					<ControlTemplate TargetType="Button">
    						<Button Background="#FF364E6F" Width="100" Foreground="White"></Button>
    						<ControlTemplate.Triggers>
    							<Trigger Property="IsMouseOver" Value="true">
    								
    									
    							</Trigger>
    						</ControlTemplate.Triggers>
    					</ControlTemplate>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</Window.Resources>

    martes, 10 de abril de 2018 13:45
  • Ya lo cambie por algo mucho mas simple y tampoco funciona

    <Window.Resources>
    		<Style x:Key="ButtonModules" TargetType="Button">
    			<Setter Property="Background" Value ="#FF364E6F"/>
    			<Setter Property="Width" Value="100"/>
    			<Setter Property="Foreground" Value="White"/>
    			<Style.Triggers>
    				<Trigger Property ="IsPressed" Value="True">
    					<Setter Property="Background" Value="Green"/>
    				</Trigger>
    			</Style.Triggers>
    		</Style>
    	</Window.Resources>

    martes, 10 de abril de 2018 18:49
  • Ejemplo de evento de entrada de mouse

    En el ejemplo siguiente, se cambia el color Background de un Button cuando el puntero del Mouse entra en el Button. El color Background se restaura cuando el mouse sale de la Button.

    La primera sección del ejemplo crea el StackPanel y el Button control y asocia los controladores de eventos para los eventos MouseEnter y MouseLeave al Button.

    XALM

    <StackPanel>
      <Button Background="AliceBlue"
              MouseEnter="OnMouseExampleMouseEnter"
              MouseLeave="OnMosueExampleMouseLeave">Button
              
      </Button>
    </StackPanel>

    C#:

    // Create the UI elements.
    StackPanel mouseMoveStackPanel = new StackPanel();
    Button mouseMoveButton = new Button();
    
    // Set properties on Button.
    mouseMoveButton.Background = Brushes.AliceBlue;
    mouseMoveButton.Content = "Button";
    
    // Attach Buttons to StackPanel.
    mouseMoveStackPanel.Children.Add(mouseMoveButton);
    
    // Attach event handler.
    mouseMoveButton.MouseEnter += new MouseEventHandler(OnMouseExampleMouseEnter);
    mouseMoveButton.MouseLeave += new MouseEventHandler(OnMosueExampleMouseLeave);

    La segunda sección del ejemplo está escrita en código y define los controladores de eventos. Cuando el Mouse entra en el Button, se cambia el color Background de la Button a SlateGray. Cuando el mouse sale del Button, se vuelve a cambiar el color Background de la Button a AliceBlue.


    private void OnMouseExampleMouseEnter(object sender, MouseEventArgs e)
    {
        // Cast the source of the event to a Button.
        Button source = e.Source as Button;
    
        // If source is a Button.
        if (source != null)
        {
            source.Background = Brushes.SlateGray;
        }
    }

    private void OnMosueExampleMouseLeave(object sender, MouseEventArgs e)
    {
        // Cast the source of the event to a Button.
        Button source = e.Source as Button;
    
        // If source is a Button.
        if (source != null)
        {
            source.Background = Brushes.AliceBlue;
        }
    }

    Fuente:

    https://docs.microsoft.com/es-es/dotnet/framework/wpf/advanced/input-overview

    Saludos campeón.

    http://electronica-pic.blogspot.com

    sábado, 4 de julio de 2020 10:18