2015-06-06 23 views
11

Tôi đang sử dụng Java 8. Tôi có thanh công cụ và nút trên đó.JavaFx: Đường viền nút và di chuột

Tôi muốn thực hiện những điều sau:

  • Trong trạng thái bình thường (không có di chuột) ở thanh công cụ, chỉ có nút nhãn phải được nhìn thấy (không có nền tảng, và cũng không biên giới).
  • Khi người dùng di chuột qua nút, khi đó nút thông thường phải được nhìn thấy.

Làm cách nào để thực hiện thông qua css?

Trả lời

18

Sử dụng các phong cách để loại bỏ các nền:

.button { 
    -fx-background-color: transparent; 
} 

On di chuột, để mang lại tất cả mọi thứ chỉ cần sử dụng nút phong cách từ modena.css:

.button:hover{ 
    -fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color; 
    -fx-background-insets: 0 0 -1 0, 0, 1, 2; 
    -fx-background-radius: 3px, 3px, 2px, 1px; 
    -fx-padding: 0.333333em 0.666667em 0.333333em 0.666667em; /* 4 8 4 8 */ 
    -fx-text-fill: -fx-text-base-color; 
    -fx-alignment: CENTER; 
    -fx-content-display: LEFT; 
} 
0

nền minh bạch có thể được kiểm soát thông qua các thính giả chuột, tức là bằng cách đặt CSS theo lập trình (làm giảm bớt nhu cầu về biểu định kiểu bên ngoài):

final String IDLE_BUTTON_STYLE = "-fx-background-color: transparent;"; 
final String HOVERED_BUTTON_STYLE = "-fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color;"; 


button.setStyle(IDLE_BUTTON_STYLE); 
button.setOnMouseEntered(e -> button.setStyle(HOVERED_BUTTON_STYLE)); 
button.setOnMouseExited(e -> button.setStyle(IDLE_BUTTON_STYLE)); 
1

Tôi đồng ý với netzwerg. Nếu bạn đang sử dụng fxml với javafx thì bạn nên bao gồm các dòng mã này trong phương thức initialize() của lớp điều khiển của bạn.

Ví dụ về lớp điều khiển:

public class Controller implements Initializable{ 
    private Button test; 
    private static final String IDLE_BUTTON_STYLE = "-fx-background-color: transparent;"; 
    private static final String HOVERED_BUTTON_STYLE = "-fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color;"; 

    @Override 
    public void initialize(URL location, ResourceBundle resources) { 
     button.setStyle(IDLE_BUTTON_STYLE); 
     button.setOnMouseEntered(e -> button.setStyle(HOVERED_BUTTON_STYLE)); 
     button.setOnMouseExited(e -> button.setStyle(IDLE_BUTTON_STYLE)); 
    } 
} 
Các vấn đề liên quan