设置切换按钮的图标

时间:2013-08-17 13:39:43

标签: javafx-2 javafx javafx-8

我用Borderpane创建了Icon,图片和文字我想设置为按钮图标。

@Override
    public void start(Stage primaryStage)
    {

        final VBox vbox = new VBox();

        // create 3 toggle buttons and a toogle group for them
        ToggleButton tb1 = new ToggleButton();
        tb1.setGraphic(newConnectionIcon());
        ToggleButton tb2 = new ToggleButton();
        ToggleButton tb3 = new ToggleButton();

        final ToggleGroup group = new ToggleGroup();
        tb1.setToggleGroup(group);
        tb2.setToggleGroup(group);
        tb3.setToggleGroup(group);
        // select the first button to start with
        group.selectToggle(tb1);

        final Rectangle rect1 = new Rectangle(300, 300);
        rect1.setFill(Color.DARKOLIVEGREEN);
        final Rectangle rect2 = new Rectangle(300, 300);
        rect2.setFill(Color.LAVENDER);
        final Rectangle rect3 = new Rectangle(300, 300);
        rect3.setFill(Color.LIGHTSLATEGREY);

        tb1.setUserData(rect1);
        tb2.setUserData(rect2);
        tb3.setUserData(rect3);

        group.selectedToggleProperty().addListener(new ChangeListener<Toggle>()
        {
            @Override
            public void changed(ObservableValue<? extends Toggle> ov, Toggle toggle, Toggle new_toggle)
            {
                if (new_toggle == null)
                {
                }
                else
                {
                    vbox.getChildren().set(1, (Node) group.getSelectedToggle().getUserData());
                }
            }
        });

        HBox hBox = new HBox();
        hBox.getChildren().addAll(tb1, tb2, tb3);
        hBox.setPadding(new Insets(10, 10, 10, 10));

        vbox.getChildren().addAll(hBox, (Node) group.getSelectedToggle().getUserData());

        StackPane root = new StackPane();
        root.getChildren().add(vbox);

        Scene scene = new Scene(root, 800, 850);

        primaryStage.setScene(scene);
        primaryStage.show();
    }

    private static BorderPane newConnectionIcon() {
        // Add background effect
        DropShadow ds = new DropShadow();
        ds.setOffsetY(2.0);
        ds.setOffsetX(2.0);
        ds.setColor(Color.GRAY);
        // New BorderPane which will hold the components
        bpi = new BorderPane();
        bpi.setEffect(ds);  // Add the effect
        bpi.setCache(true);
        // Set the size of the BorderPane
        bpi.setPrefSize(30, 30);
        bpi.setMaxSize(30, 30);
        // Add style        
        bpi.setStyle("-fx-background-color: linear-gradient(#f2f2f2, #d4d4d4);"
                + "  -fx-background-insets: 0 0 -1 0, 0, 1, 2;"
                + "  -fx-background-radius: 3px, 3px, 2px, 1px;");
        // Add Label to the Icon
        Text inftx = new Text("New Connection");
        inftx.setFont(Font.font ("Verdana", 5));   // Set font and font size
        inftx.setFill(Color.WHITE); // Set font color
        ncpic.setFitHeight(25);    // Set size of the Icon picture
        ncpic.setFitWidth(25);
        // Internal StackPane which will hold the picture and the Icon Label
        StackPane stack = new StackPane();
        stack.getChildren().addAll(ncpic, inftx);   // Add the picture and the Label
        // Add the StackPane to the main BorderPane        
        bpi.setCenter(stack);
        // Change the border of the Icon when the mouse is over the Icon
        bpi = mouseOver(bpi);
        // Navigate to new Panel when the user clicks on the Icon
        bpi.setOnMouseClicked(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent t) {



            }
        });

        return bpi;
    }

如何删除默认的togglebutton并将我的自定义图标用作按钮?

1 个答案:

答案 0 :(得分:3)

使用Labeled#setGraphic(Node)ToggleButtonLabeled,因此定义了setGraphic(Node)方法。或者,您也可以使用专门的ToogleButton constructor

参数你应该传递给setGraphic()是你的BorderPane!他是Node =)

要清楚一点,这里有一段代码片段:

myToogleButton.setGraphic(myBorderPane);