wangchunxiang/fantaibao-crawler-desktop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(page): 调整数据抓取页面UI布局和样式

Browse Source 
- 增大主容器间距和内边距，提升视觉层次感
- 扩大标题字体大小，增强可读性
- 调整表单网格间距和内边距，优化布局紧凑度
- 增加平台选择下拉框宽度，改善用户体验
- 修改日期选择器默认值和宽度，便于操作
- 增大按钮间距和内边距，提升触控友好性
- 扩大场景窗口尺寸，提供更宽敞的操作空间
This commit is contained in:
wangchunxiang
2025-12-11 18:00:41 +08:00
parent ad3380c979
commit d118b84750
1 changed files with 20 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/main/java/com/fantaibao/page/DataCrawlView.java
View File

@@ -1,5 +1,6 @@
package com.fantaibao.page;
import com.fantaibao.page.PlatformSelectionView;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
@@ -32,20 +33,20 @@ public class DataCrawlView {
// 创建主容器
VBox root = new VBox();
root.setAlignment(Pos.CENTER);
root.setSpacing(20);
root.setPadding(new Insets(30));
root.setSpacing(30);
root.setPadding(new Insets(40));
root.setStyle("-fx-background-color: #f5f5f5;");
// 标题
Label titleLabel = new Label("数据抓取配置");
titleLabel.setStyle("-fx-font-size: 24px; -fx-font-weight: bold; -fx-text-fill: #333333;");
titleLabel.setStyle("-fx-font-size: 28px; -fx-font-weight: bold; -fx-text-fill: #333333;");
// 创建表单容器
GridPane formPane = new GridPane();
formPane.setAlignment(Pos.CENTER);
formPane.setHgap(15);
formPane.setVgap(20);
formPane.setPadding(new Insets(20));
formPane.setHgap(20);
formPane.setVgap(25);
formPane.setPadding(new Insets(30));
formPane.setStyle("-fx-background-color: white; -fx-border-radius: 10px; -fx-background-radius: 10px; " +
"-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.1), 10, 0, 0, 0);");
@@ -56,7 +57,7 @@ public class DataCrawlView {
platformComboBox = new ComboBox<>();
platformComboBox.getItems().addAll("美团", "大众点评");
platformComboBox.setValue("美团");
platformComboBox.setPrefWidth(200);
platformComboBox.setPrefWidth(250);
platformComboBox.setStyle("-fx-font-size: 14px;");
// 开始时间选择
@@ -64,8 +65,8 @@ public class DataCrawlView {
startDateLabel.setStyle("-fx-font-size: 14px; -fx-text-fill: #333333;");
startDatePicker = new DatePicker();
startDatePicker.setValue(LocalDate.now().minusDays(7)); // 默认一周前
startDatePicker.setPrefWidth(200);
startDatePicker.setValue(LocalDate.now().minusDays(10)); // 默认10天前
startDatePicker.setPrefWidth(250);
startDatePicker.setStyle("-fx-font-size: 14px;");
// 结束时间选择
@@ -73,8 +74,8 @@ public class DataCrawlView {
endDateLabel.setStyle("-fx-font-size: 14px; -fx-text-fill: #333333;");
endDatePicker = new DatePicker();
endDatePicker.setValue(LocalDate.now()); // 默认今天
endDatePicker.setPrefWidth(200);
endDatePicker.setValue(LocalDate.now().minusDays(1)); // 默认昨天
endDatePicker.setPrefWidth(250);
endDatePicker.setStyle("-fx-font-size: 14px;");
// 添加到表单
@@ -88,39 +89,39 @@ public class DataCrawlView {
// 按钮区域
HBox buttonBox = new HBox();
buttonBox.setAlignment(Pos.CENTER);
buttonBox.setSpacing(20);
buttonBox.setSpacing(30);
// 返回按钮
Button backButton = new Button("返回");
backButton.setStyle("-fx-background-color: #cccccc; -fx-text-fill: #333333; " +
"-fx-font-size: 16px; -fx-font-weight: bold; -fx-padding: 12px 36px; " +
"-fx-font-size: 16px; -fx-font-weight: bold; -fx-padding: 15px 40px; " +
"-fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.2), 10, 0, 0, 0);");
backButton.setCursor(javafx.scene.Cursor.HAND);
backButton.setOnMouseEntered(e -> backButton.setStyle("-fx-background-color: #bbbbbb; " +
"-fx-text-fill: #333333; -fx-font-size: 16px; -fx-font-weight: bold; " +
"-fx-padding: 12px 36px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-padding: 15px 40px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.3), 15, 0, 0, 0);"));
backButton.setOnMouseExited(e -> backButton.setStyle("-fx-background-color: #cccccc; " +
"-fx-text-fill: #333333; -fx-font-size: 16px; -fx-font-weight: bold; " +
"-fx-padding: 12px 36px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-padding: 15px 40px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.2), 10, 0, 0, 0);"));
backButton.setOnAction(e -> handleBackAction());
// 开始抓取按钮
crawlButton = new Button("开始抓取");
crawlButton.setStyle("-fx-background-color: #4CAF50; -fx-text-fill: white; " +
"-fx-font-size: 16px; -fx-font-weight: bold; -fx-padding: 12px 36px; " +
"-fx-font-size: 16px; -fx-font-weight: bold; -fx-padding: 15px 40px; " +
"-fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.2), 10, 0, 0, 0);");
crawlButton.setCursor(javafx.scene.Cursor.HAND);
crawlButton.setOnMouseEntered(e -> crawlButton.setStyle("-fx-background-color: #45a049; " +
"-fx-text-fill: white; -fx-font-size: 16px; -fx-font-weight: bold; " +
"-fx-padding: 12px 36px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-padding: 15px 40px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.3), 15, 0, 0, 0);"));
crawlButton.setOnMouseExited(e -> crawlButton.setStyle("-fx-background-color: #4CAF50; " +
"-fx-text-fill: white; -fx-font-size: 16px; -fx-font-weight: bold; " +
"-fx-padding: 12px 36px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-padding: 15px 40px; -fx-border-radius: 30px; -fx-background-radius: 30px; " +
"-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.2), 10, 0, 0, 0);"));
// 为按钮添加点击事件
@@ -133,7 +134,7 @@ public class DataCrawlView {
root.getChildren().addAll(titleLabel, formPane, buttonBox);
// 设置场景并显示窗口
Scene scene = new Scene(root, 500, 450);
Scene scene = new Scene(root, 800, 600);
primaryStage.setScene(scene);
primaryStage.show();
}