https://github.com/xxrjun/uml-editor
π NCU CSIE SE6029 OOAD Final Project, Spring 2024, M.S./Ph.D.
https://github.com/xxrjun/uml-editor
javascript jswin uml-editor
Last synced: 9 months ago
JSON representation
π NCU CSIE SE6029 OOAD Final Project, Spring 2024, M.S./Ph.D.
- Host: GitHub
- URL: https://github.com/xxrjun/uml-editor
- Owner: xxrjun
- License: mit
- Created: 2024-03-14T12:44:53.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-04-10T15:48:00.000Z (almost 2 years ago)
- Last Synced: 2024-04-11T03:19:20.630Z (almost 2 years ago)
- Topics: javascript, jswin, uml-editor
- Language: Java
- Homepage: https://xxrjun.github.io/uml-editor/
- Size: 1.95 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://xxrjun.github.io/uml-editor)
[](https://github.com/xxrjun/uml-editor/releases/tag/v1.0)
[](https://sonarcloud.io/summary/new_code?id=xxrjun_uml-editor)
[](https://sonarcloud.io/summary/new_code?id=xxrjun_uml-editor)
[](https://sonarcloud.io/summary/new_code?id=xxrjun_uml-editor)
# UML Editor
- [UML Editor](#uml-editor)
- [Software Requirements](#software-requirements)
- [Maven Dependencies](#maven-dependencies)
- [Features](#features)
- [GUI Layout and Buttons](#gui-layout-and-buttons)
- [Functions](#functions)
- [Extra Features](#extra-features)
- [Usage](#usage)
- [Build](#build)
- [Run](#run)
- [Class Diagram](#class-diagram)
- [Future Work](#future-work)
- [Project File Structure](#project-file-structure)
- [Program Flow Overview](#program-flow-overview)
- [Use Case Sequence Diagram](#use-case-sequence-diagram)
- [A. Creating a UML Object](#a-creating-a-uml-object)
- [B. Creating a UML Connection Line](#b-creating-a-uml-connection-line)
- [C. Select/Unselect a Single Object](#c-selectunselect-a-single-object)
- [D.1 Group Objects](#d1-group-objects)
- [D.2 Ungroup Objects](#d2-ungroup-objects)
- [E. Move Objects](#e-move-objects)
- [F. Change Object Name](#f-change-object-name)
- [References](#references)
- [Documentations](#documentations)
- [Related Projects](#related-projects)
## Software Requirements
- IDE: IntelliJ IDEA
- Java JDK 17.0.1
- GUI Library: [Java Swing](https://docs.oracle.com/javase%2F7%2Fdocs%2Fapi%2F%2F/javax/swing/package-summary.html)
- [SonarLint Plugin](https://plugins.jetbrains.com/plugin/7973-sonarlint) - Code quality and security analysis tool
- [Maven](https://mvnrepository.com/) - Dependency Management
- [Figma](https://www.figma.com/) - UI and components design
- Documentation
- [Generate JavaDoc](https://www.jetbrains.com/help/idea/javadocs.html#generate-javadoc) - IntelliJ IDEA Tool
- [Deploy - Publish Javadoc](https://github.com/marketplace/actions/deploy-publish-javadoc) - GitHub Action
### Maven Dependencies
- Logger: [slf4j](http://www.slf4j.org/) with [logback](http://logback.qos.ch/)
## Features
### GUI Layout and Buttons
- [x] Select
- [x] Association
- [x] Generalization
- [x] Composition
- [x] Class
- [x] Use Case
### Functions
- [x] Create basic object: Class, UseCase
- [x] Select/Unselect/Move a single basic object: Class, UseCase
- [x] Create UMLConnectionLine: AssociationLine, CompositionLine, GeneralizationLine
- [x] Change Object Name
- [x] Select/Unselect/Move connection line
- [x] Select/Unselect a UMLGroup of objects
- [x] Group/UpGroup
- [x] Select and Move BaseUMLObject (include Group)
### Extra Features
- [ ] Delete UMLObject
## Usage
You can just download [π v1.0](https://github.com/xxrjun/uml-editor/releases/tag/v1.0) and run the jar file.
### Build
```bash
mvn clean package
```
### Run
```bash
java -jar target/uml-editor-1.0-jar-with-dependencies.jar
```
## Class Diagram with Dependency
> [!TIP]
> Generated by [UML class diagrams](https://www.jetbrains.com/help/idea/class-diagram.html)

## Future Work
- Improve code quality. More OO.
- Documentations: Java API Docs, README.md
## Project File Structure
```bash
.
|
+---assets
+---docs
+---src
| +---main
| | +---java
| | | \---com
| | | \---xxrjun
| | | | UMLEditorApplication.java
| | | |
| | | +---components
| | | | | Canvas.java
| | | | | MenuBar.java
| | | | | ToolPanel.java
| | | | |
| | | | \---uml
| | | | | UMLGroup.java
| | | | | UMLObject.java
| | | | | UMLPort.java
| | | | |
| | | | +---basics
| | | | | ClassBasicObject.java
| | | | | UMLBasicObject.java
| | | | | UseCaseBasicObject.java
| | | | |
| | | | \---connectionlines
| | | | AssociationLine.java
| | | | CompositionLine.java
| | | | GeneralizationLine.java
| | | | UMLConnectionLine.java
| | | |
| | | +---enums
| | | | EditFunctionTypes.java
| | | | ToolButtonConfig.java
| | | | UMLObjectTypes.java
| | | |
| | | +---factories
| | | | UMLObjectFactory.java
| | | |
| | | \---modes
| | | CreateBasicUMLObject.java
| | | CreateUMLConnectionLine.java
| | | Select.java
| | | UMLFactory.java
| | | UMLMode.java
| | |
| | \---resources
| | \---images
...
```
## Program Flow Overview
1. Click Tool Button
2. Mode
1. Create UMLObject
1. Create UMLConnectionLine
2. Create UMLBasicObject
2. Select
1. If selection is UMLObjects
1. can Move (UMLConnectionLine movement are not supported yet.)
2. If selection is UMLBasicObject
1. can change itβs ObjectName
3. If selection is an Area including several UMLObjects
1. can Group
4. If selection is an UMLGroup
1. can UnGroup
3. Canvas Repaint
```mermaid
graph TD
A[Initialize UML Editor] --> B{Button Clicked}
B -->|Select| C[Set Select Mode]
B -->|Association| D[Set Association Mode]
B -->|Generalization| E[Set Generalization Mode]
B -->|Composition| F[Set Composition Mode]
B -->|Class| G[Set Class Creation Mode]
B -->|Use Case| H[Set Use Case Creation Mode]
C --> I{Mouse Event on Canvas}
D --> I
E --> I
F --> I
G --> I
H --> I
I -->|Left Click on Object| J[Select/Unselect Object]
I -->|Left Click on Canvas| K[Unselect All Objects]
I -->|Left Press on Object| L[Start Line Creation]
I -->|Mouse Drag| M[Update Line Endpoint]
I -->|Left Release on Object| N[Create Connection Line]
I -->|Left Press on Object| O[Start Object Movement]
I -->|Mouse Drag| P[Move Object]
I -->|Left Release| Q[Update Object Position]
J --> R{Edit Menu}
K --> R
R -->|Group Selected| S[Merge Selected Objects]
R -->|Ungroup Selected| T[Decompose Composite Object]
R -->|Change Object Name| U[Open Name Change Window]
U -->|OK with New Name| V[Update Object Name]
U -->|Cancel| W[Close Window]
V --> W
W --> I
```
## Use Case Sequence Diagram
### A. Creating a UML Object
```mermaid
sequenceDiagram
participant User
participant Button
participant Canvas
User->>Button: Click button
Button-->>User: Change button color to black
User->>Canvas: Move cursor to (x,y) and press left mouse button
Canvas-->>Canvas: Draw a blank object at (x,y)
User->>Canvas: Repeat creating same object
alt User press another button
User->>Button: Click another button
Button-->>User: Change to the mode of clicked button
end
```
### B. Creating a UML Connection Line
```mermaid
sequenceDiagram
participant User
participant Object1
participant Object2
participant Canvas
User->>Object1: Press left mouse button within boundary
User->>Canvas: Drag mouse
User->>Object2: Release mouse button within boundary
Canvas-->>Canvas: Create connection line between Object1 and Object2
Canvas-->>Canvas: Draw arrow at Object2 based on line type
alt Press point not on object
User->>Canvas: Press, drag and release not on any object
Canvas-->>Canvas: Do nothing
else Release point not on object
User->>Canvas: Release mouse not on any object
Canvas-->>Canvas: Do not create connection line
end
```
### C. Select/Unselect a Single Object
```mermaid
sequenceDiagram
participant User
participant Object
participant Canvas
User->>Object: Click on object
Object-->>Canvas: Deselect any other selected objects
Object-->>Object: Display 4 connection ports
alt Click on empty area
User->>Canvas: Click on coordinates without object
Canvas-->>Canvas: Deselect any selected objects
end
```
### D.1 Group Objects
```mermaid
sequenceDiagram
participant User
participant EditMenu
participant SelectedObjects
User->>EditMenu: Select "Group" option
EditMenu->>SelectedObjects: Merge into one composite object
```
### D.2 Ungroup Objects
```mermaid
sequenceDiagram
participant User
participant EditMenu
participant CompositeObject
User->>EditMenu: Select "Ungroup" option
EditMenu->>CompositeObject: Decompose one layer
```
### E. Move Objects
```mermaid
sequenceDiagram
participant User
participant Object
participant Canvas
User->>Object: Press left mouse button
User->>Canvas: Drag mouse to (x,y)
User->>Canvas: Release mouse button
Canvas->>Object: Move object to (x,y)
Canvas-->>Canvas: Redraw connected lines
```
### F. Change Object Name
```mermaid
sequenceDiagram
participant User
participant EditMenu
participant Object
participant NameWindow
User->>Object: Select object
User->>EditMenu: Select "Change Object Name"
EditMenu-->>NameWindow: Open window with text area and OK/Cancel
User->>NameWindow: Enter new name, press OK
NameWindow-->>Object: Change object name
NameWindow-->>NameWindow: Close window
```
## References
### Documentations
- [Requirement - Use Case Format](./docs/requirement%20-%20use%20case%20format.pdf)
- [Java Design Pattern](https://java-design-patterns.com/patterns/)
- [Package javax.swing](https://docs.oracle.com/en/java/javase/17/docs/api/java.desktop/javax/swing/package-summary.html)
- [Java Swing Tutorial](https://www.javatpoint.com/java-swing)
- [The Javaβ’ Tutorials | Creating a GUI With Swing](https://docs.oracle.com/javase/tutorial/uiswing/index.html)
### Related Projects
> [!TIP]
> Code similarity is checked by using [MOSS](https://theory.stanford.edu/~aiken/moss/). Result: http://moss.stanford.edu/results/1/9411843636512/
- [haVincy/UML-Editor](https://github.com/haVincy/UML-Editor)
- [MU-PING/UML-editor](https://github.com/MU-PING/UML-editor)
- [wst24365888/XYZ-UML-Editor](https://github.com/wst24365888/XYZ-UML-Editor?tab=readme-ov-file)