写了一个JavaFx版的登陆界面

本文详细介绍了如何使用JavaFx扩展现有的B/S结构Web应用程序,并提供了登陆界面的设计实例。主要内容包括舞台场景的设置、界面元素的创建与布局、以及交互逻辑的实现。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

想用JavaFx扩展原有的B/S结构的Web应用程序,JavaFx目前处于1.2版,很多东西都还处于快速的发展中,要做程序,只能是自己边学边干,这里是自己做的一个登陆界面,界面 如下:


 

 

 

代码如下:

 

 package page;

import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.paint.LinearGradient;
import javafx.scene.paint.Stop;
import javafx.scene.paint.Color;
import javafx.scene.layout.VBox;
import javafx.scene.control.TextBox;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.HBox;
import javafx.scene.shape.Rectangle;
import javafx.scene.Group;
import javafx.stage.Alert;
import javafx.scene.text.Text;

/**
 * 开始于 2010-01-28
 * javaFx版的威博文件管理系统
 * 登陆页面
 * 最后修改于 2010-02-08
 * @author 万继斌
 * @version 1.2
 */
//定义舞台场景的宽度
def sceneWidth = 640;
//定义舞台场景的高度
def sceneHeight = 480;
//定义用户名组合对象
def userName = Group {
            content: [
                HBox {
                    spacing: 5
                    content: [
                        Label {
                            text: "用户:"
                        }
                        TextBox {
                            text: ""
                            columns: 15
                            selectOnFocus: true
                        }
                    ]
                }
            ]
        }
//定义用户名组合对象
def userPassword = Group {
            content: [
                HBox {
                    spacing: 5
                    content: [
                        Label {
                            text: "密码:"
                        }
                        TextBox {
                            text: ""
                            columns: 15
                            selectOnFocus: true
                        }
                    ]
                }
            ]
        }
//提示信息
def message = Text {
            content: "处理提示信息"
        }
//定义提交按钮组合对象
def submit = Group {
            content: [
                HBox {
                    content: [
                        Button {
                            text: "登陆系统"
                            action: function () {
                                if (Alert.question("提交处理", "提交处理吗?")) {
                                    message.content = "是,提交";
                                    } else {
                                    message.content = "否,放弃";
                                    }
                                }
                        }
                    ]
                }
            ]
        }
//定义登陆矩形背景
def bgRectangle = Rectangle {
            x: sceneWidth / 2 - 120;
            y: sceneHeight / 2 - 120;
            width: 240
            height: 180
            arcWidth: 20
            arcHeight: 20
            opacity: 0.5
            stroke: Color.YELLOWGREEN
            strokeWidth: 2
            fill: Color.WHITESMOKE
        }
//定义垂直布局
def vbox = VBox {
            layoutX: bgRectangle.layoutBounds.minX + 20
            layoutY: bgRectangle.layoutBounds.minY + 20
            spacing: 20
            content: [
                userName,
                userPassword,
                submit,
                message
            ]
        }

//舞台
Stage {
    title: "威博文件管理系统"
    scene: Scene {
        //初始场景,按照640*480的屏幕大小设计
        width: sceneWidth;
        height: sceneHeight
        //场景填色,使用线性渐变
        fill: LinearGradient {
            startX: 1; endX: 1 //X坐标方向不渐变
            startY: 0; endY: 1 //Y坐标方向渐变
            stops: [
                Stop {
                    offset: 0
                    color: Color.LIGHTGREEN
                },
                Stop {
                    offset: 1
                    color: Color.LIGHTCYAN
                }
            ]
        }//fill: LinearGradient
        //场景内容
        content: [
            bgRectangle,
            vbox
        ]//场景内容组
    }//场景
}
 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值