JavaFX:控件边框设置

104 篇文章 5 订阅

JavaFX中控件的边框也可以进行设置。主要有两种方式,一种是Java方式,一种是CSS方式。

JavaFX中控件继承自Region类。setBorder方法用来设置边框属性。

// The border of the Region, which is made up of zero or more BorderStrokes, and zero
// or more BorderImages. It is possible for a Border to be empty, where it has neither
// strokes nor images, and is semantically equivalent to null.
public final void setBorder(Border value)

边框类Border是一个不可变的对象,它封装了渲染区域边框所需的全部数据集。由于该类是不可变的,因此可以在多个不同的 "区域 "中自由重复使用相同的边框。

class Border {

    // 四个构造函数。
    public Border(List<BorderStroke> strokes, List<BorderImage> images);

    public Border(BorderStroke[] strokes, BorderImage[] images);

    public Border(BorderStroke... strokes);
  
    public Border(BorderImage... images);
}

每个边框类Border都由笔画BorderStoke和/或图像组成。两个列表都不会为空,但其中一个或两个都可能为空。在渲染时,如果没有指定图像或没有图像加载成功,那么所有笔画都将按顺序渲染。如果指定了任何图像且加载成功,则不会绘制任何笔画,但这些笔画仍会对边框的内侧和外侧产生影响。

class BorderStroke {
    public BorderStroke(Paint stroke,
                        BorderStrokeStyle style,
                        CornerRadii radii,
                        BorderWidths widths);

    public BorderStroke(Paint stroke,
                        BorderStrokeStyle style,
                        CornerRadii radii,
                        BorderWidths widths,
                        Insets insets);

    public BorderStroke(Paint topStroke,
                        Paint rightStroke,
                        Paint bottomStroke,
                        Paint leftStroke,
                        BorderStrokeStyle topStyle,
                        BorderStrokeStyle rightStyle,
                        BorderStrokeStyle bottomStyle,
                        BorderStrokeStyle leftStyle,
                        CornerRadii radii,
                        BorderWidths widths,
                        Insets insets);
}

    topStroke - The fill to use on the top. If null, defaults to Color.BLACK.
    rightStroke - The fill to use on the right. If null, defaults to the same value as topStroke.
    bottomStroke - The fill to use on the bottom. If null, defaults to the same value as topStroke.
    leftStroke - The fill to use on the left. If null, defaults to the same value as rightStroke.
    topStyle - The style to use on the top. If null, defaults to BorderStrokeStyle.NONE.
    rightStyle - The style to use on the right. If null, defaults to the same value as topStyle.
    bottomStyle - The style to use on the bottom. If null, defaults to the same value as topStyle.
    leftStyle - The style to use on the left. If null, defaults to the same value as rightStyle.
    radii - The radii. If null, defaults to square corners by using CornerRadii.EMPTY.
    widths - The thickness of each side. If null, defaults to DEFAULT_WIDTHS.
    insets - The insets indicating where to draw the border relative to the region edges. If null, defaults to Insets.EMPTY.

定义边框的描边类BorderStroke,用于为区域设计样式。描边是一种基于矢量的渲染,用于勾勒边框区域的轮廓。它可以从 Region 的边缘嵌入(或外移),在计算 Region 的嵌入(用于定义内容区域)时,会考虑到描边的值。在使用任何边框图像时,都不会使用描边视觉效果。

BorderStrokeStyle:定义 BorderStroke 一侧使用的描边样式。有几种预定义的样式,不过这些预定义样式的属性可能与最终绘制它们时使用的设置不一致。您也可以创建一个新的 BorderStrokeStyle,然后手动定义每个描边设置,这与任何形状类似。注:BorderStrokeStyle.NONE是默认值,设置边框不显示。

具体示例:

package javafx8.ch10;

import javafx.application.Application;
import javafx.geometry.Rectangle2D;
import javafx.scene.Scene;
import javafx.scene.layout.Border;
import javafx.scene.layout.BorderStroke;
import javafx.scene.layout.BorderStrokeStyle;
import javafx.scene.layout.BorderWidths;
import javafx.scene.layout.CornerRadii;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Paint;
import javafx.stage.Screen;
import javafx.stage.Stage;

/**
 * @copyright 2003-2023
 * @package   javafx8.ch10
 * @file      BorderTest.java
 * @date      2023-10-16 15:47
 * @author    qiao wei
 * @version   1.0
 * @brief     测试控件边框设置。
 * @history
 */
public class BorderTest extends Application {
    
    public BorderTest() {}

    @Override
    public void start(Stage primaryStage) throws Exception {
        start02(primaryStage).show();
    }

    public static void main(String[] args) {
        Application.launch(BorderTest.class, args);
    }
    
    /**
     * @class   BorderTest
     * @date    2023-10-16 16:13
     * @author  qiao wei
     * @version 1.0
     * @brief   创建Stage。边框设置不做任何设置。
     * @param   primaryStage 主窗体。
     * @return  修改后的主窗体primaryStage。
     * @throws
     */
    private Stage start01(Stage primaryStage) {
        Pane pane = new Pane();
        
        // 设置pane尺寸。
        Rectangle2D screenRectangle = Screen.getPrimary().getBounds();
        double screenWidth = screenRectangle.getWidth();
        double screenHeight = screenRectangle.getHeight();        
        pane.setPrefSize(screenWidth / 3, screenHeight / 3);
        
        primaryStage.setScene(new Scene(pane));
        primaryStage.setTitle("添加Pane,对边框不做任何设置");
        
        return primaryStage;
    }
    
    /**
     * @class   BorderTest
     * @date    2023-10-16 17:37
     * @author  qiao wei
     * @version 1.0
     * @brief   
     * @param   
     * @return  
     * @throws
     */
    private Stage start02(Stage primaryStage) {
        Pane pane = new Pane();

        // 设置pane尺寸。
        Rectangle2D screenRectangle = Screen.getPrimary().getBounds();
        double screenWidth = screenRectangle.getWidth();
        double screenHeight = screenRectangle.getHeight();
        pane.setPrefSize(screenWidth / 3, screenHeight / 3);
        
        // 设置边框画笔。BorderStrokeStyle字段设置绘制边框,NONE不显示边框,DASHED、DOTTED、SOLD是预定义的边框。
        BorderStroke borderStroke = new BorderStroke(
            Paint.valueOf("#00FF00"),
            BorderStrokeStyle.DOTTED,
            new CornerRadii(30),
            new BorderWidths(20)
        );        
        pane.setBorder(new Border(borderStroke));

        primaryStage.setScene(new Scene(pane));
        primaryStage.setTitle("添加Pane,设置BorderStroke");

        return primaryStage;
    }
}

start01方法结果:

start02方法结果:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaFX中使用CSS语法来修改控件的样式。下面是一些常用控件的样式修改记录: 1. Button按钮控件: - 设置按钮背景色:-fx-background-color: #00ff00; - 设置按钮文字颜色:-fx-text-fill: #ffffff; - 设置按钮边框颜色:-fx-border-color: #ff0000; - 设置按钮边框宽度:-fx-border-width: 2px; - 设置按钮内边距:-fx-padding: 10px; 2. Label标签控件: - 设置标签文字颜色:-fx-text-fill: #000000; - 设置标签字体大小:-fx-font-size: 16px; - 设置标签字体样式:-fx-font-style: italic; - 设置标签字体粗细:-fx-font-weight: bold; - 设置标签背景色:-fx-background-color: #ffffff; 3. TextField文本框控件: - 设置文本框背景色:-fx-background-color: #ffffff; - 设置文本框边框颜色:-fx-border-color: #cccccc; - 设置文本框边框宽度:-fx-border-width: 1px; - 设置文本框内边距:-fx-padding: 5px; - 设置文本框文字颜色:-fx-text-fill: #000000; 4. ComboBox下拉框控件: - 设置下拉框背景色:-fx-background-color: #ffffff; - 设置下拉框边框颜色:-fx-border-color: #cccccc; - 设置下拉框边框宽度:-fx-border-width: 1px; - 设置下拉框内边距:-fx-padding: 5px; - 设置下拉框文字颜色:-fx-text-fill: #000000; 5. ListView列表控件: - 设置列表背景色:-fx-background-color: #ffffff; - 设置列表边框颜色:-fx-border-color: #cccccc; - 设置列表边框宽度:-fx-border-width: 1px; - 设置列表内边距:-fx-padding: 5px; - 设置列表文字颜色:-fx-text-fill: #000000; 以上是一些常用控件的CSS样式修改记录,可以根据需要进行修改。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值