JavaFX布局-BorderPane

JavaFX布局-BorderPane

  • 实现方式
    • Java实现
    • FXML实现
  • 综合案例

  • 将容器空间分成五个区域:顶部(Top)、底部(Bottom)、左侧(Left)、右侧(Right)和中心(Center)。每个区域都可以放置一个节点(Node),比如另一个布局容器或UI控件
  • BorderPane中的一些区域可以为空,只设置需要的区域即可
  • 顶部和底部默认是横向扩展全宽的
  • 左右两侧则会扩展到足够容纳内容的高度
  • 中心区域通常用来放置主要的内容,默认会填充剩余的空间
    在这里插入图片描述

实现方式

Java实现

BorderPane pane = new BorderPane();
pane.setTop(new Label("top"));
pane.setCenter(new Label("center"));
pane.setBottom(new Label("bottom"));
pane.setLeft(new Label("left"));
pane.setRight(new Label("right"));
pane.setPadding(new Insets(5, 10, 10, 5));

FXML实现

<BorderPane xmlns="http://javafx.com/javafx" xmlns:fx="http://javafx.com/fxml" prefHeight="400.0" prefWidth="600.0">
    <top>
        <Button text="top"/>
    </top>
    <center>
        <Button text="center"/>
    </center>
    <bottom>
        <Button text="bottom"/>
    </bottom>
    <left>
        <Button text="left"/>
    </left>
    <right>
        <Button text="right"/>
    </right>
</BorderPane>

综合案例

BorderPane pane = new BorderPane();
        // top
        MenuBar menuBar = new MenuBar();
        menuBar.setStyle("-fx-background-color: pink;");
        Menu file = new Menu("文件");
        file.getItems().add(new Menu("新建"));
        file.getItems().add(new Menu("打开"));
        menuBar.getMenus().add(file);
        menuBar.getMenus().add(new Menu("编辑"));
        pane.setTop(menuBar);

        // center
        TabPane tabPane = new TabPane();
        tabPane.setStyle("-fx-background-color: blue;");
        Tab tab1 = new Tab("Untitled Tab 1");
        tab1.setContent(new FlowPane());
        tabPane.getTabs().add(tab1);
        Tab tab2 = new Tab("Untitled Tab 2");
        tab2.setContent(new FlowPane());
        tabPane.getTabs().add(tab2);
        pane.setCenter(tabPane);

        // bottom
        FlowPane flowPaneBottom = new FlowPane();
        flowPaneBottom.setStyle("-fx-background-color: red;");
        flowPaneBottom.setAlignment(Pos.CENTER);
        flowPaneBottom.getChildren().add(new Label("底部数据"));
        pane.setBottom(flowPaneBottom);

        // left
        TreeItem<String> root = new TreeItem<String>("root");
        root.getChildren().add(new TreeItem<String>("一级目录"));
        root.getChildren().add(new TreeItem<String>("二级目录"));
        root.getChildren().add(new TreeItem<String>("三级目录"));
        TreeView<String> treeView = new TreeView<String>(root);
        treeView.setPrefWidth(100);
        pane.setLeft(treeView);

        // right
        FlowPane flowPaneRight = new FlowPane();
        flowPaneRight.setStyle("-fx-background-color: green;");
        flowPaneRight.setOrientation(Orientation.VERTICAL);
        flowPaneRight.setAlignment(Pos.CENTER);
        flowPaneRight.getChildren().add(new Button("操作1"));
        flowPaneRight.getChildren().add(new Button("操作2"));
        flowPaneRight.getChildren().add(new Button("操作3"));
        flowPaneRight.getChildren().add(new Button("操作4"));
        flowPaneRight.getChildren().add(new Button("操作5"));
        pane.setRight(flowPaneRight);
        return pane;

在这里插入图片描述

<BorderPane prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/17.0.2-ea"  xmlns:fx="http://javafx.com/fxml/1" >
    <top>
        <MenuBar style="-fx-background-color: pink;">
            <Menu styleClass="menu-item" text="文件">
                <Menu text="新建"/>
                <Menu text="打开"/>
            </Menu>
            <Menu text="编辑"/>
        </MenuBar>
    </top>
    <center>
        <TabPane fx:id="tabPane1" prefHeight="200.0" prefWidth="200.0" styleClass="tab-pane" style="-fx-background-color: blue;"
                 tabClosingPolicy="UNAVAILABLE" BorderPane.alignment="CENTER">
            <tabs>
                <Tab fx:id="tab1" text="Untitled Tab 1">
                    <content>
                        <FlowPane fx:id="flowPane1" minHeight="0.0" minWidth="0.0" prefHeight="180.0"
                                  prefWidth="200.0"/>
                    </content>
                </Tab>
                <Tab fx:id="tab2" text="Untitled Tab 2">
                    <content>
                        <FlowPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0">
                            <Button styleClass="btn btn-primary" text="添加Button"/>
                            <Button styleClass="btn btn-primary" text="添加Tab"/>
                        </FlowPane>
                    </content>
                </Tab>
            </tabs>
        </TabPane>
    </center>
    <left>
        <TreeView prefWidth="100" >
            <TreeItem value="root">
                <children>
                    <TreeItem value="一级目录"/>
                    <TreeItem value="二级目录"/>
                    <TreeItem value="三级目录"/>
                </children>
            </TreeItem>
        </TreeView>
    </left>
    <right>
        <FlowPane alignment="CENTER" orientation="VERTICAL" prefWidth="60" style="-fx-background-color: green;">
            <Button text="操作1"/>
            <Button text="操作2"/>
            <Button text="操作3"/>
            <Button text="操作4"/>
        </FlowPane>
    </right>
    <bottom>
        <FlowPane alignment="CENTER" prefHeight="50" style="-fx-background-color: red;" BorderPane.alignment="CENTER">
            <Label text="底部数据"/>
            <BorderPane.margin>
                <Insets top="5.0" left="0" right="0" bottom="5"/>
            </BorderPane.margin>
        </FlowPane>
    </bottom>
</BorderPane>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/762530.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Java案例找素数(三种方法)

目录 一&#xff1a;问题&#xff1a; 二&#xff1a;思路分析&#xff1a; 三&#xff1a;具体代码&#xff1a; 四&#xff1a;运行结果&#xff1a; 一&#xff1a;问题&#xff1a; 二&#xff1a;思路分析&#xff1a; 三&#xff1a;具体代码&#xff1a; Ⅰ&#xf…

03 _ 类型基础(2):动态类型与静态类型

静态类型语言与动态类型语言 通俗定义 静态类型语言&#xff1a;在编译 阶段确定所有变量的类型 动态类型语言&#xff1a;在执行阶段确定所有变量的类型 Javascript 与 C 对比 静态类型与动态类型对比 其他定义 强类型语言&#xff1a;不允许程序在发生错误后继续执行 语…

【STM32】温湿度采集与OLED显示

一、任务要求 1. 学习I2C总线通信协议&#xff0c;使用STM32F103完成基于I2C协议的AHT20温湿度传感器的数据采集&#xff0c;并将采集的温度-湿度值通过串口输出。 任务要求&#xff1a; 1&#xff09;解释什么是“软件I2C”和“硬件I2C”&#xff1f;&#xff08;阅读野火配…

视频号视频怎么下载保存到手机,视频号视频如何下载到电脑本地

在数字化浪潮的推动下&#xff0c;视频号成为了我们获取信息、分享生活的重要平台。但有时候&#xff0c;我们遇到一些精彩的内容&#xff0c;想要保存下来以便日后观看&#xff0c;却发现视频号并不提供直接的下载功能。下面我就来为大家详细介绍视频号视频下载的方法&#xf…

Datax快速使用之牛刀小试

前言 一次我发现业务他们在用 datax数据同步工具&#xff0c;我尤记得曾经 19 年使用过&#xff0c;并且基于当时的版本还修复了个 BUG并且做了数据同步管道的集成开发。没想到时间过的飞快&#xff0c;业务方基于海豚调度 2.0.6 的版本中有在使用&#xff0c;由于业务方还没有…

大促前夕即高点,综合电商平台的“稀缺”魔法正在消失?

新一期618大促早已结束良久了&#xff0c;但似乎其产生的余韵却仍旧未消散。 从最直观的资本市场走势来看&#xff0c;自这一波618大促陆续开展之后&#xff0c;包括京东、阿里巴巴、拼多多等港美股股价就一改此前的上行态势&#xff0c;持续下滑至今。 事实上&#xff0c;早…

【计算机网络期末复习】例题汇总(一)

重点例题选择填空简答题与传输媒体的接口的特性重点 计算机网络的性能指标计算机网络体系结构例题 选择

【Linux】线程id与互斥(线程三)

上一期我们进行了线程控制的了解与相关操作&#xff0c;但是仍旧有一些问题没有解决 本章第一阶段就是解决tid的问题&#xff0c;第二阶段是进行模拟一个简易线程库&#xff08;为了加深对于C库封装linux原生线程的理解&#xff09;&#xff0c;第三阶段就是互斥。 目录 线程id…

【解锁未来:深入了解机器学习的核心技术与实际应用】

解锁未来&#xff1a;深入了解机器学习的核心技术与实际应用 &#x1f48e;1.引言&#x1f48e;1.1 什么是机器学习&#xff1f; &#x1f48e;2 机器学习的分类&#x1f48e;3 常用的机器学习算法&#x1f48e;3.1 线性回归&#xff08;Linear Regression&#xff09;&#x1…

【PYG】Planetoid中边存储的格式,为什么打印前十条边用edge_index[:, :10]

edge_index 是 PyTorch Geometric 中常用的表示图边的张量。它通常是一个形状为 [2, num_edges] 的二维张量&#xff0c;其中 num_edges 表示图中边的数量。每一列表示一条边&#xff0c;包含两个节点的索引。 实际上这是COO存储格式&#xff0c;官方文档里也有写&#xff0c;…

爬虫逆向实战(41)-某巢登陆(AES、MD5、RSA、滑块验证码)

一、数据接口分析 主页地址&#xff1a;某巢 1、抓包 通过抓包可以发现在登录时&#xff0c;网站首先请求captcha/querySlideImage/来获取滑块验证码的图片&#xff0c;然后请求captcha/checkCode/接口来验证滑块验证码。滑块验证码校验成功后&#xff0c;请求noshiro/getPu…

高性能LDO电路设计,有配套文档

内容&#xff1a; 1、电路文件&#xff08;有仿真状态&#xff09;和PDK&#xff08;TSMC180&#xff09; 2、配套仿真结果文档讲解6页 3、参考资料三篇 指标&#xff1a; LDO 温度系数1.09ppm LDO 环路增益在 64.3dB&#xff0c;相位裕度在 66&#xff0c;系统稳定。 LDO 最大…

抛弃 Neofetch?众多优秀替代方案等你体验!

目录 抛弃 Neofetch&#xff1f;众多优秀替代方案等你体验Neofetch 的替代品FastfetchscreenFetchmacchina 抛弃 Neofetch&#xff1f;众多优秀替代方案等你体验 NeoFetch 是用 Bash 3.2 编写的命令行系统信息工具&#xff0c;该项目的主要开发人员已将 GitHub 存储库存档&…

【漏洞复现】和丰多媒体信息发布系统 QH.aspx 任意文件上传漏洞

0x01 产品简介 和丰多媒体信息发布系统也称数字标牌&#xff08;Digital Signage&#xff09;&#xff0c;是指通过大屏幕终端显示设备&#xff0c;发布商业、财经和娱乐信息的多媒体专业视听系统&#xff0c;常被称为除纸张媒体、电台、电视、互联网之外的“第五媒体”。该系…

民生银行收大额罚单:信用卡中心一同被罚,管理层如何施救?

民生银行的2024年&#xff0c;再添变故。 近日&#xff0c;国家金融监管总局宁波分局公布了数则行政处罚信息公开表。内容显示&#xff0c;民生银行&#xff08;SH:600016、HK:01988&#xff09;宁波分行、民生银行信用卡中心宁波分中心因多项违法违规事实&#xff0c;共计被处…

【Git 学习笔记】Ch1.1 Git 简介 + Ch1.2 Git 对象

还是绪个言吧 今天整理 GitHub 仓库&#xff0c;无意间翻到了几年前自学 Git 的笔记。要论知识的稳定性&#xff0c;Git 应该能挤进前三——只要仓库还在&#xff0c;理论上当时的所有开发细节都可以追溯出来。正好过段时间会用到 Git&#xff0c;现在整理出来就当温故知新了。…

Redis集群-主从复制、哨兵

●主从复制&#xff1a;主从复制是高可用Redis的基础&#xff0c;哨兵和集群都是在主从复制基础上实现高可用的。 主从复制主要实现了数据的多机备份&#xff0c;以及对于读操作的负载均衡和简单的故障恢复。缺陷&#xff1a;故障 恢复无法自动化&#xff1b;写操作无法负载均…

HCIE实验这样玩太高级了吧?实现FRR+BFD+OSPF与BGP的联动

号主&#xff1a;老杨丨11年资深网络工程师&#xff0c;更多网工提升干货&#xff0c;请关注公众号&#xff1a;网络工程师俱乐部 晚上好&#xff0c;我的网工朋友。 今天搞个HCIE实验玩玩&#xff0c;上回分享了个张总讲解的防火墙配置实验思路&#xff0c;后来还特地搞了个视…

STM32人体心电采集系统

资料下载地址&#xff1a;STM32人体心电采集系统 1、项目功能介绍 此项目主要实现了以STM32为核心的人体心电采集系统软硬件的设计。软件设计过程是在STM32上移植的uCGUI做图形界面&#xff0c;并如实显示采集到的心电波形信号&#xff0c;有SD卡存储和USB数据传输功能。 2、实…