สอนสร้างระบบ Point of Sale (POS) ด้วย JavaFX และ Spring Boot

การสร้างระบบ Point of Sale (POS) ที่สามารถใช้ได้จริงในธุรกิจขนาดเล็กสามารถเริ่มต้นได้ด้วย JavaFX และ Spring Boot ซึ่งเป็นเครื่องมือยอดนิยมในสายงาน Java ทั้งสองนี้ช่วยให้สามารถพัฒนาแอปพลิเคชันที่มีประสิทธิภาพและมีส่วนติดต่อผู้ใช้ (UI) ที่สวยงามได้ง่ายๆ บทความนี้จะแบ่งออกเป็นหลายตอนเพื่อให้คุณสามารถเข้าใจและนำไปใช้งานได้อย่างต่อเนื่อง

ตอนที่ 1: การเตรียมความพร้อม

1. ติดตั้งเครื่องมือ

Java Development Kit (JDK): ดาวน์โหลดและติดตั้ง JDK เวอร์ชันล่าสุด
IDE: ใช้ IntelliJ IDEA หรือ Eclipse เพื่อเขียนโค้ด
Maven/Gradle: สำหรับการจัดการ Dependency

2. สร้างโปรเจกต์ Spring Boot

ใช้ Spring Initializr (https://start.spring.io) เพื่อสร้างโปรเจกต์พร้อม Dependency:
- Spring Web
- Spring Data JPA (ถ้ามีฐานข้อมูล)
- Lombok

3. สร้างโปรเจกต์ JavaFX

เพิ่มไลบรารี JavaFX ลงในโปรเจกต์โดยใช้ Maven หรือ Gradle:

<dependency>
  <groupId>org.openjfx</groupId>
  <artifactId>javafx-controls</artifactId>
  <version>20</version>
</dependency>

ตอนที่ 2: การสร้าง Backend สำหรับจัดการสินค้า

1. โมเดลสินค้า (Product Model)

@Data
@NoArgsConstructor
@AllArgsConstructor
public class Product {
    private Long id;
    private String name;
    private double price;
    private String imageUrl;
    private String category;
}

2. สร้าง Controller สำหรับสินค้า

@RestController
@RequestMapping("/api/products")
public class ProductController {

    @GetMapping
    public List<Product> getAllProducts() {
        return List.of(
            new Product(1L, "Coffee", 2.50, "https://example.com/images/coffee.png", "Beverage"),
            new Product(2L, "Tea", 1.75, "https://example.com/images/tea.png", "Beverage"),
            new Product(3L, "Sandwich", 4.00, "https://example.com/images/sandwich.png", "Food"),
            new Product(4L, "Cake", 3.25, "https://example.com/images/cake.png", "Dessert")
        );
    }
}

ตอนที่ 3: การสร้าง UI ด้วย JavaFX

1. การแสดงสินค้าใน Grid View

ใช้ GridPane ในการแสดงรายการสินค้าแต่ละชิ้น

private GridPane createProductGrid(ObservableList<Product> products) {
  GridPane grid = new GridPane();
  grid.setPadding(new Insets(10));
  grid.setHgap(15);
  grid.setVgap(15);

  int column = 0, row = 0;
  for (Product product : products) {
      VBox productBox = createProductBox(product);
      grid.add(productBox, column, row);

      column++;
      if (column == 3) { // 3 Columns ต่อแถว
          column = 0;
          row++;
      }
  }
  return grid;
}

2. เพิ่ม Tab สำหรับแยกประเภทสินค้า

TabPane categoryTabs = new TabPane();
for (String category : groupedProducts.keySet()) {
    Tab tab = new Tab(category);
    tab.setGraphic(createCategoryIcon(category));
    categoryTabs.getTabs().add(tab);
}

3. ไอคอนสำหรับประเภทสินค้า

private Node createCategoryIcon(String category) {
    String iconUrl = categoryIcons.getOrDefault(category, "https://example.com/icons/default.png");
    ImageView icon = new ImageView(new Image(iconUrl));
    icon.setFitWidth(16);
    icon.setFitHeight(16);
    return icon;
}

ตอนที่ 4: การเพิ่มฟีเจอร์ Cart และ Checkout

1. ระบบตะกร้าสินค้า

เพิ่มสินค้าจากหน้า Product ไปยังตะกร้า
```
Button addButton = new Button("Add");
addButton.setOnAction(e -> cart.add(product));
```

2. การพิมพ์ใบเสร็จ

ใช้ TextArea หรือสร้างไฟล์ PDF

private void printReceipt(List<Product> cartItems) {
  System.out.println("Receipt");
  for (Product product : cartItems) {
      System.out.println(product.getName() + " - $" + product.getPrice());
  }
}

สรุป

บทความนี้ได้นำเสนอแนวทางในการสร้างระบบ POS แบบง่ายด้วย JavaFX และ Spring Boot ครอบคลุมตั้งแต่การสร้าง Backend, การแสดงสินค้าใน UI, การจัดการประเภทสินค้า และระบบตะกร้าสินค้า พร้อมฟีเจอร์ Checkout บทความถัดไปอาจเพิ่มเติมการเชื่อมต่อฐานข้อมูลหรือฟีเจอร์ที่ซับซ้อนยิ่งขึ้น!

ค้นหาบล็อกนี้

Plaza Java