IT评测·应用市场-qidao123.com
标题:
Maven JavaFX利用SCSS样式表
[打印本页]
作者:
梦见你的名字
时间:
2025-3-14 17:29
标题:
Maven JavaFX利用SCSS样式表
关于SCSS
详见
此处
。
原理
JavaFX本身的CSS解析器不支持SCSS，因此我们需要在编译阶段将SCSS文件编译为CSS文件，然后在JavaFX中引入CSS文件。
本文利用的编译插件是
sass-cli-maven-plugin
。
利用
POM文件设置
代码如下：
<build>
<plugins>
<plugin>
<groupId>us.hebi.sass</groupId>
<artifactId>sass-cli-maven-plugin</artifactId>
<version>1.0.3</version>
<configuration>
<sassVersion>1.62.0</sassVersion>
<args>
<arg>${project.basedir}/src/scss/input.scss:${project.basedir}/target/classes/css/output.css</arg>
<arg>--no-source-map</arg>
<arg>--no-charset</arg>
</args>
</configuration>
<executions>
<execution>
<id>sass-exec</id>
<phase>generate-resources</phase>
<goals>
<goal>run</goal>
</goals>
</execution>
</executions>
</plugin>
</plugins>
</build>
复制代码
代码中只需要关注一个地方：
${project.basedir}/src/scss/input.scss
{project.basedir}/target/classes/css/output.css
它的基本格式是：
项目SCSS文件路径:编译后CSS文件路径
路径写好以后即可编译查看是否有用。
引入CSS文件
编译完成后，我们只需要在项目中引入CSS文件即可，以/target/classes/css/output.css地址为例：
public class MainApplication extends Application {
@Override
public void start(Stage stage) throws IOException {
FXMLLoader fxmlLoader = new FXMLLoader(MainApplication.class.getResource("/fxml/main-application.fxml"));
Parent root = fxmlLoader.load();
// 嵌入全局css表
root.getStylesheets().add(Objects.requireNonNull(MainApplication.class.getResource("/css/output.css"))
.toExternalForm());
Scene scene = new Scene(root);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch();
}
}
复制代码
另外，程序开发阶段运行时可能不会触发该插件的编译，如果SCSS文件更新，可能需要先手动编译一次再运行。
如果是IDEA中也可以如下设置：
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
欢迎光临 IT评测·应用市场-qidao123.com (https://dis.qidao123.com/)
Powered by Discuz! X3.4
{project.basedir}/target/classes/css/output.css