`

JavaFX学习之样例3

阅读更多
  该代码主要是针对node的mouseTransparentProperty和pickOnBoundsProperty属性。
  mouseTransparentProperty为true则该节点及其子节点的鼠标事件无效,也就是说对鼠标透明了。
  pickOnBoundsProperty则是计算边界(也就是哪些地方鼠标点击会有效)。默认为false,则边界是几何的边界。为true则是用矩形刚好把几何框起来的边界。
  看例子
import javafx.application.Application;
import javafx.beans.binding.Bindings;
import javafx.event.EventHandler;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.CheckBox;
import javafx.scene.control.ToggleButton;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;

// Demonstrates the JavaFX node mouseTransparent and pickOnBounds properties.
public class LayerClick extends Application {
  public static void main(String[] args) { launch(args); }
  @Override public void start(Stage stage) throws Exception {
    ToggleButton testButton = new ToggleButton("");
    
    VBox layer1 = new VBox();
    layer1.getChildren().add(testButton);

    Node layer2 = new Circle(100, 100, 100, Color.FIREBRICK);
    layer2.setOnMouseClicked(new EventHandler<MouseEvent>(){
		@Override
		public void handle(MouseEvent event) {
			System.out.println("circle click");
			
		}
    });
    layer2.setOpacity(0.7);

    StackPane stack = new StackPane();
    stack.getChildren().setAll(layer1, layer2);    
    stack.setStyle("-fx-background-color: azure;");
    
    VBox layout = new VBox();
    layout.getChildren().setAll(
            stack, 
            createControls(testButton, layer2)
    );
    
    stage.setScene(new Scene(layout));
    stage.show();
  }

  private VBox createControls(ToggleButton controlledButton, Node controlledNode) {
    controlledButton.textProperty().bind(
            Bindings
              .when(controlledNode.mouseTransparentProperty()).then("Completely Clickable")
              .otherwise(Bindings
                 .when(controlledNode.pickOnBoundsProperty()).then("Not Clickable")
                 .otherwise("Partially clickable")
              )
    );  //button的text值绑定圆的mouseTransparentProperty和pickOnBoundsProperty
    
    CheckBox enableMouseTransparency = new CheckBox("Enable MouseTransparency");
    enableMouseTransparency.setSelected(controlledNode.isMouseTransparent());
    controlledNode.mouseTransparentProperty().bind(enableMouseTransparency.selectedProperty());
    //圆的mouseTransparentProperty绑定checkbox的选中属性。 mouseTransparentProperty若为true则该节点及其子节点的鼠标事件无效
            
    CheckBox enablePickOnBounds      = new CheckBox("Enable Pick On Bounds");
    enablePickOnBounds.setSelected(controlledNode.isPickOnBounds());
    controlledNode.pickOnBoundsProperty().bind(enablePickOnBounds.selectedProperty());
  //圆的pickOnBoundsProperty绑定checkbox的选中属性
    VBox controls = new VBox(10);
    controls.setStyle("-fx-background-color: cornsilk; -fx-padding: 10;");
    controls.getChildren().addAll(
            enableMouseTransparency,
            enablePickOnBounds
    );
    
    return controls;
  }
}

当二个属性都没选时,button只有一部分能按动,因为使用的stackpane存放的button和circle,circle在上面,盖住了button的一部分。

当mouseTransparentProperty为true时,此时circle对鼠标透明,所以此时button全都可以按动。

当pickOnBoundsProperty为true时,此时circle鼠标事件响应的边界,变成一个矩形(刚好框住圆形)。而button在矩形范围内,所以此时button完全被circle盖住了,不能点击。
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics