I made a GUI with Swing

Introduction

I wanted to make a GUI, so I made it using Swing. I will summarize what I made for the first time, so it will be for beginners. If you make a mistake or find something better, please let me know.

environment

macOS Catalina (version 10.15.1) Eclipse ~~ To install the plug-in, click How to plug Swing into Eclipse 2019-03 ver. Installed with reference to ~~ The page is gone. ..

Preparation

  1. Create a project
  2. Select New> Other and select WindowsBuilder> Swing Designer> Application Window → [Next] スクリーンショット 2019-12-17 10.54.11.png
  3. Enter a name and click [finish] to create → The following code is automatically generated スクリーンショット 2019-12-17 11.01.54.png

Screen creation

You can arrange it freely on the [Design] tab. I wanted to arrange it freely this time, so I created it with Absolute layout スクリーンショット 2019-12-17 11.10.36.png

  1. Click Absolute layout from Layouts → Click the window-like area on the right side → The panel is now installed on the base. (It looks the same, but it looks like a carpet on the floor.)
  2. From Components, select the component you want to place and place it. I tried to place the label. スクリーンショット 2019-12-17 11.17.42.png Once placed, the code will also be generated automatically. スクリーンショット 2019-12-17 11.19.00.png
  3. You can change the properties by selecting the component you have placed. Try changing the text to be displayed to the user ID. Rewrite the text of the property to "user ID" → stretch the size of the label horizontally スクリーンショット 2019-12-17 11.22.13.png
  4. Repeat this to create the UI as you imagined. In the end, I made the UI like this. (It's not a cool UI, but it's still under construction ...) スクリーンショット 2019-12-17 11.25.15.png
title component
☆ 彡 Hotel JLabel
username JLabel
password JLabel
Next to the username JFormattedTextField
Next to the password JpasswordField
Login JButton

Event creation

As it is now, the UI is only displayed, so pressing the login button does nothing. Make sure that the event fires when you click the login button. This time, after pressing the login button, another screen will be displayed.

  1. Right-click on the component and select "Add event handler> mouse> mouse clicked" スクリーンショット 2019-12-17 11.36.29.png
  2. The code is automatically generated, so I will write the process here スクリーンショット 2019-12-17 11.43.48.png
  3. When you press the login button, the original screen (login screen) will be discarded and the next screen will be displayed. スクリーンショット 2019-12-17 11.47.21.png Dispose the login screen with frame.dispose (); Another screen is visualized with a.frame.setVisible (true) ;.

It's a little difficult to understand, The frame of frame.dispose (); is the login screen, The frame of a.frame.setVisible (true); will be another screen. If an error occurs in the frame of a.frame.setVisible (true) ;, delete the private of "private JFrame frame;" on the screen to be displayed. スクリーンショット 2019-12-17 11.46.56.png 4. Almost ready, let's run When executed, the login screen will be displayed. スクリーンショット 2019-12-17 11.55.58.png

When you press the login button ... スクリーンショット 2019-12-17 11.57.13.png Another screen will be displayed.

at the end

I'm not a professional, so please use it as a reference level ... Also, when creating with Absolute layout, it is nice to be able to freely change the size of the component, but when I change the size of the screen, it does not move nicely from the original position, so it makes me a little sad. .. If you know a good way, please let me know ... I will write an article again when the one I am making is completed.

Recommended Posts

I made a GUI with Swing
I made a risky die with Ruby
I made a rock-paper-scissors app with kotlin
I made a rock-paper-scissors app with android
04. I made a front end with SpringBoot + Thymeleaf
I made a mosaic art with Pokemon images
I made a gender selection column with enum
I made a LINE bot with Rails + heroku
I made a portfolio with Ruby On Rails
I made a chat app.
[Ruby] I made a crawler with anemone and nokogiri.
Ruby: I made a FizzBuzz program!
I made a development environment with rails6 + docker + postgreSQL + Materialize.
I made a shopify app @java
I made a plugin to execute jextract with Gradle task
I made a mod that instantly calls a vehicle with Minecraft
I made a simple recommendation function.
I made a matching app (Android app)
I made a package.xml generation tool.
[Android] I made a pedometer app.
I made a command line interface with WinMerge Plugin using JD-Core
[Rails] I made a simple calendar mini app with customized specifications.
I made a simple search form with Spring Boot + GitHub Search API.
[Ruby] I made a simple Ping client
Create a GUI JSON Viewer with Ruby/GTK3
I made an eco server with scala
I tried playing with BottomNavigationView a little ①
I made a plugin for IntelliJ IDEA
I made a calculator app on Android
I made a new Java deployment tool
I made a bulletin board using Docker 1
I made StringUtils.isBlank
I made an app to scribble with PencilKit on a PDF file
[LINE BOT] I made a ramen BOT with Java (Maven) + Heroku + Spring Boot (1)
I made a site that summarizes information on carbohydrate restriction with Vue.js
I made a Diff tool for Java files
I made a primality test program in Java
Refactored GUI tools made with Java8 + JavaFX in 2016
I made blackjack with Ruby (I tried using minitest)
Display Mat type image on GUI with Swing
I made a rock-paper-scissors game in Java (CLI)
I made a viewer app that displays a PDF
I made a Docker container to run Maven
I made a Ruby extension library in C
[Rails] I made a draft function using enum
I built a Code Pipeline with AWS CDK.
I tried to break a block with java (1)
Learn Java with Progate → I will explain because I made a basic game myself
I made a Docker image of SDAPS for Japanese
I made a simple calculation problem game in Java
I made an iPhone Theremin with Vision framework + AudioKit
A simple CRUD app made with Nuxt / Laravel (Docker)
I made a check tool for the release module
I made a method to ask for Premium Friday
I made a drawing chat "8bit paint chat" on WebAssembly
I tried deploying a page made with antique Middleman on Azure Static Web Apps
I want to monitor a specific file with WatchService
I made a Restful server and client in Spring.
I made a library that works like a Safari tab !!
I tried OCR processing a PDF file with Java
[Beginner] I stumbled upon launching a project with Rails6