cocoa - Simple efecto mouseover en NSButton

nsbuttoncell

Question

Estoy creando un NSButtonCell personalizado para un renderizado personalizado.

Ahora, quiero tener un aspecto diferente dependiendo de si el mouse está sobre el botón o no. ¿Cómo puedo obtener esta información?

Gracias y saludos,

Answer 1

Aquí es que he creado y trabajado para mí perfectamente ...

Paso 1: Crea el botón con área de seguimiento

 NSButton *myButton = [[NSButton alloc] initWithFrame:NSMakeRect(100, 7, 100, 50)];
[myButton setTitle:@"sample"];

[self.window.contentView addSubview:myButton];
// Insert code here to initialize your application
NSTrackingArea* trackingArea = [[NSTrackingArea alloc]
                                initWithRect:[myButton bounds]
                                options:NSTrackingMouseEnteredAndExited | NSTrackingActiveAlways
                                owner:self userInfo:nil];
[myButton addTrackingArea:trackingArea];

Paso: 2 Implementar los siguientes métodos.

- (void)mouseEntered:(NSEvent *)theEvent{
NSLog(@"entered");
[[myButton cell] setBackgroundColor:[NSColor blueColor]];


}

- (void)mouseExited:(NSEvent *)theEvent{
[[myButton cell] setBackgroundColor:[NSColor redColor]];
NSLog(@"exited");

}

Answer 2

Debe Subclase la clase NSButton (o incluso mejor la clase NSButtonCell). Como dijo Justin si pones los dos métodos.

- (void)mouseEntered:(NSEvent *)theEvent;
- (void)mouseExited:(NSEvent *)theEvent;

Deben ser llamados cuando el mouse entra y sale del área. Es posible que también debas volver a crear el área de seguimiento, mira aquí:

- (void)updateTrackingAreas

Para el efecto de entrada y salida, jugué con el animador y el valor alfa, por ejemplo:

[self animator]setAlphaValue:0.5]; 

Answer 3

Para aquellos que prefieren crear subclases, también puede crear su propio NSButton y asignarle el NSTrackingArea .

Esta es una forma realmente simple y elegante de hacerlo, gracias a Joey Zhou : https://github.com/Swift-Kit/JZHoverNSButton

Está escrito en Swift 2, pero XCode lo traducirá automáticamente en Swift 3 - 4 sin ningún problema.

Espero que pueda ayudar a alguien

Answer 4

Un buen punto de partida, declarado en NSResponder:

- (void)mouseEntered:(NSEvent *)theEvent;
- (void)mouseExited:(NSEvent *)theEvent;

específicamente, el contenedor de la celda del botón (no la celda en sí) es el NSResponder.

Answer 5

Swift 3:

Crea el botón con código o simplemente usa su @IBOutlet. A continuación, defina el área de seguimiento del botón para pasar el mouse (desplazar):

let area = NSTrackingArea.init(rect: yourButtonName.bounds,
                               options: [.mouseEnteredAndExited, .activeAlways], 
                               owner: self, 
                               userInfo: nil)
yourButtonName.addTrackingArea(area)

Luego anule mouseEntered y mouseExited, configure lo que quiera cambiar (color de botón, imagen de botón, texto de botón, ...) en estas funciones:

override func mouseEntered(with event: NSEvent) {
    print("Entered: /(event)")
}

override func mouseExited(with event: NSEvent) {
    print("Exited: /(event)")
}

Si tiene varios botones (con área de seguimiento agregada para cada uno) y necesita identificar qué botón activó el evento mouseEntered, puede agregar información de información de usuario para este propósito, por lo que en lugar de:

userInfo: nil

Agregue el nombre de su botón personalizado en userInfo para cada botón, por ejemplo:

userInfo: ["btnName": "yourButtonName"]

Luego, puede escribir un caso de conmutador o instrucciones en su mouseEntered y mouseExited funciones como esta:

override func mouseEntered(with event: NSEvent) {
        // Identify which button triggered the mouseEntered event
        if let buttonName = event.trackingArea?.userInfo?.values.first as? String {
            switch (buttonName) {
            case "yourButtonName":
                //do whatever you want for this button..
            case "anotherButtonName":
                //do whatever you want for this button..
            default:
                print("The given button name: /"/(buttonName)/" is unknown!")
            }
        }
    }