JAVAFX 屏幕适配
我们在做桌面应用的时候经常需要 在最大化的时候,让部分控件跟随窗口大小变化而变化。
这个时候我们需要 利用VBox 或者HBox 作为根布局,再将需要跟随屏幕子控件设置 VBox.vgrow="ALWAYS" 或者 HBox.hgrow="ALWAYS" 即可,下面以下图为例
上两张图一张是正常模式,一张是最大化下没有设置屏幕适配的状态下,特别的不美观,接下来我们设置一下,
是不是好看很多,左边的列表,和右侧的选项卡跟随了屏幕变化,但是图片中的选项卡里面的内容是不是没有跟随TabPane的大小变化而变化呢,接下来在处理TabPane 子项的屏幕填充,先看上面的布局代码
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.*?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="750.0" prefWidth="1280.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.mitcub.controller.HomeController">
<children>
<HBox prefHeight="100.0" prefWidth="1280.0">
<children>
<Pane layoutX="4.0" layoutY="4.0" prefHeight="100.0" prefWidth="250.0" style="-fx-border-color: #bbbbbb; -fx-border-radius: 3;">
<children>
<RadioButton fx:id="rb_xyft" layoutX="14.0" layoutY="10.0" mnemonicParsing="false" selected="true" text="A" />
<RadioButton fx:id="rb_azxy" layoutX="14.0" layoutY="35.0" mnemonicParsing="false" text="B" />
<RadioButton fx:id="rb_sgft" layoutX="14.0" layoutY="60.0" mnemonicParsing="false" text="C" />
<RadioButton fx:id="rb_jsssc" layoutX="134.0" layoutY="60.0" mnemonicParsing="false" text="D" />
<RadioButton fx:id="rb_jsft" layoutX="134.0" layoutY="35.0" mnemonicParsing="false" text="E" />
<RadioButton fx:id="rb_jssc" layoutX="134.0" layoutY="10.0" mnemonicParsing="false" text="F" />
</children>
</Pane>
</children></HBox>
<HBox fx:id="hb_bottom" nodeOrientation="LEFT_TO_RIGHT" prefHeight="600.0" prefWidth="1280.0" VBox.vgrow="ALWAYS">
<children>
<TableView fx:id="recordTableView" layoutX="0.0" layoutY="0.0" prefHeight="615.0" prefWidth="250.0">
<columns>
<TableColumn fx:id="timeColum" prefWidth="45.0" text="时间" />
<TableColumn fx:id="issueColum" prefWidth="80.0" text="数" />
<TableColumn fx:id="codeColum" prefWidth="200.0" text="D" />
</columns>
</TableView>
<TabPane fx:id="tabPane" layoutX="275.0" layoutY="110.0" prefHeight="615.0" prefWidth="1020.0" style="-fx-border-color: #bbbbbb;" tabClosingPolicy="UNAVAILABLE" HBox.hgrow="ALWAYS">
<tabs>
<Tab id="setTabPage" closable="false" text="设置">
<content>
<fx:include source="settingView.fxml" />
</content>
</Tab>
<Tab id="hisTabPage" closable="false" text="演算">
<content>
<fx:include source="historyView.fxml" />
</content>
</Tab>
</tabs>
<HBox.margin>
<Insets left="5.0" />
</HBox.margin>
</TabPane>
</children>
<VBox.margin>
<Insets top="5.0" />
</VBox.margin></HBox>
<HBox prefHeight="35.0" prefWidth="1280.0" style="-fx-background-color: #f9f9f9;">
<VBox.margin>
<Insets top="3.0" />
</VBox.margin>
<children>
<Label text="版本V1.0.0" />
</children>
<padding>
<Insets left="30.0" top="10.0" />
</padding>
</HBox>
</children>
</VBox>
下面我们来处理 选项卡里面的内容撑开,看上图的选项卡中,感觉是没有被撑开,子项中的背景色设置成了橘黄色,这是因为创建fmxl的时候,默认给根布局设置了 maxHeight="-Infinity" maxWidth="-Infinity" 只要将子项的根下的这行去掉即可,接下来看效果
这样是不是好看很多的,跟最开始的效果比起来是不是会好很多,跟初始状态比较,是不是更可以接受一些了,当然还可以继续优化。JavaFX 屏幕最大化适配先写到这里。代码附上
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<VBox fx:id="vbox_root" minHeight="-Infinity" minWidth="-Infinity" prefHeight="600.0" prefWidth="1020.0" style="-fx-background-color: ff6600;" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.mitcub.view.SettingView">
<children>
<HBox prefHeight="211.0" prefWidth="1020.0">
<children>
<Pane prefHeight="211.0" prefWidth="257.0">
<children>
<Button fx:id="btn_start" layoutX="20.0" layoutY="171.0" mnemonicParsing="false" onAction="#startClick" prefHeight="29.0" prefWidth="60.0" text="开始" />
<Button fx:id="btn_pause" layoutX="95.0" layoutY="171.0" mnemonicParsing="false" onAction="#pauseClick" prefHeight="29.0" prefWidth="60.0" text="暂停" />
<Button fx:id="btn_stop" layoutX="173.0" layoutY="171.0" mnemonicParsing="false" onAction="#stopClick" prefHeight="29.0" prefWidth="60.0" text="停止" />
<CheckBox fx:id="cb_win" layoutX="20.0" layoutY="20.0" mnemonicParsing="false" text="超过" />
<CheckBox fx:id="cb_lose" layoutX="20.0" layoutY="51.0" mnemonicParsing="false" text="低于" />
<TextField fx:id="tv_win" layoutX="95.0" layoutY="17.0" prefHeight="23.0" prefWidth="77.0" />
<TextField fx:id="tv_lose" layoutX="95.0" layoutY="49.0" prefHeight="23.0" prefWidth="77.0" />
<Label layoutX="188.0" layoutY="21.0" text="停止" />
<Label layoutX="188.0" layoutY="53.0" text="停止" />
<Label layoutX="20.0" layoutY="91.0" prefHeight="15.0" prefWidth="207.0" text=":0.00" textFill="#ff4d4d" />
<Label layoutX="20.0" layoutY="125.0" text="延时下注" />
<TextField fx:id="tv_delaybet" layoutX="80.0" layoutY="121.0" prefHeight="23.0" prefWidth="48.0" />
<Label layoutX="141.0" layoutY="125.0" text="(0-60秒)" />
</children>
</Pane>
<Pane prefHeight="200.0" prefWidth="600.0">
<children>
<CheckBox fx:id="cb_num1" layoutX="20.0" layoutY="10.0" mnemonicParsing="false" text="1" />
<CheckBox fx:id="cb_num2" layoutX="20.0" layoutY="45.0" mnemonicParsing="false" text="2" />
<CheckBox fx:id="cb_num3" layoutX="20.0" layoutY="80.0" mnemonicParsing="false" text="3" />
<CheckBox fx:id="cb_num4" layoutX="20.0" layoutY="115.0" mnemonicParsing="false" text="4" />
<CheckBox fx:id="cb_num5" layoutX="20.0" layoutY="150.0" mnemonicParsing="false" text="5" />
<CheckBox fx:id="cb_num6" layoutX="255.0" layoutY="10.0" mnemonicParsing="false" text="6" />
<CheckBox fx:id="cb_num7" layoutX="255.0" layoutY="45.0" mnemonicParsing="false" text="7" />
<CheckBox fx:id="cb_num8" layoutX="255.0" layoutY="80.0" mnemonicParsing="false" text="8" />
<CheckBox fx:id="cb_num9" layoutX="255.0" layoutY="115.0" mnemonicParsing="false" text="9" />
<CheckBox fx:id="cb_num10" layoutX="255.0" layoutY="150.0" mnemonicParsing="false" text="10" />
<TextField fx:id="tv_num1" layoutX="60.0" layoutY="8.0" />
<TextField fx:id="tv_num2" layoutX="60.0" layoutY="43.0" />
<TextField fx:id="tv_num3" layoutX="60.0" layoutY="78.0" />
<TextField fx:id="tv_num4" layoutX="60.0" layoutY="113.0" />
<TextField fx:id="tv_num5" layoutX="60.0" layoutY="148.0" />
<TextField fx:id="tv_num6" layoutX="300.0" layoutY="8.0" />
<TextField fx:id="tv_num7" layoutX="300.0" layoutY="43.0" />
<TextField fx:id="tv_num8" layoutX="300.0" layoutY="78.0" />
<TextField fx:id="tv_num9" layoutX="300.0" layoutY="112.0" />
<TextField fx:id="tv_num10" layoutX="300.0" layoutY="148.0" />
<Label layoutX="20.0" layoutY="185.0" text="" />
<TextField fx:id="tv_jine" layoutX="52.0" layoutY="182.0" prefHeight="23.0" prefWidth="290.0" />
<CheckBox fx:id="cb_zfb" layoutX="350.0" layoutY="185.0" mnemonicParsing="false" text="" />
</children></Pane>
</children>
</HBox>
<TableView fx:id="table_bet" layoutX="7.0" layoutY="219.0" prefHeight="384.0" prefWidth="1008.0" VBox.vgrow="ALWAYS">
<columns>
<TableColumn prefWidth="100.0" text="A" />
<TableColumn prefWidth="150.0" text="B" />
<TableColumn prefWidth="150.0" text="C" />
<TableColumn prefWidth="50.0" text="D" />
<TableColumn prefWidth="60.0" text="E" />
<TableColumn prefWidth="80.0" text="F" />
<TableColumn prefWidth="300.0" text="G" />
<TableColumn prefWidth="300.0" text="H" />
<TableColumn prefWidth="100.0" text="I" />
</columns>
</TableView>
</children>
</VBox>
至于为什么选择JavaFX做桌面软件,因为平时用java用的多web ,安卓都在用java,但是java写桌面体验太差了,之前一直用arrdio这个小工具在写桌面程序,这个小软件,开发快,布局拖拽 对齐 方便快捷,桌面应用的首选,缺点就是比较小众,可借鉴的文章不多,C#呢,也不是没考虑过,玩了一阵子感觉没兴趣了,哈哈,至于为什么选JavaFX,一来是学习,而来是arrdio的网络库inet.whttp 模拟提交数据的时候,经常会因为服务器更改了之后造成需要更改头部(header),貌似java用okhttp,就没那么多问题了,强大的okhttp,哈哈,最近也是抱着学习的态度,拿这个之前写的小软件练练手。
本文地址:https://blog.csdn.net/tangjz2008/article/details/107598355