Java(Swing)アプリをダークでかっこいいUIにする方法

今までJavaのSwingで業務GUIアプリケーションを作ってきたのですが、どうにもデフォルトのUIが好きになれずにいました。Look And FeelでWindows風 にするなどしてみたのですが、いまいち納得できず悶々としておりました。さらにSwingでダークモードアプリを作成したことがなく、ダークモード好きの私としてはこれはいかんという事で 今まで作ったアプリの配色をダーク系にしてみました。結果としてはそこそこのUIになったのですが、枠線が消えなかったりSwingUIのデザイン自体が好きじゃないというのもあって、 私の力量ではここまでかと半ばあきらめモードとなっておりました。

しかし、ここ最近FlatLafというプロジェクトを見つけました。デモアプリがダウンロードできるようになっていて、そのアプリでデザインの確認が可能となっているのですが、まさに一目惚れ。 ダーク系のテーマもあり、これだ！とすぐさまライブラリをダウンロードして、過去のアプリに組み込んでみました。多少の調整が必要でしたが、一気に今時なUIにアップグレードできました。

日本語で紹介されている記事がなかったため、備忘録もかねて導入方法について説明します。

FlatLafについて

SwingアプリケーションのLook And Feelを拡張して、デザイン性の高いUIを実装することができます。

ライセンス：　The Apache License, Version 2.0

Webサイト：　https://www.formdev.com/flatlaf/

基本のテーマはライト系テーマが2つ、ダーク系テーマが2つの計4つ。別途拡張テーマをダウンロードすればさらに多くのテーマが使用可能となります。動作にはJava8以上が必要とのこと。

デモアプリをダウンロードしてテーマを確認

FlatLafのホームページを開き、赤枠の「download」をクリックするとデモアプリである実行可能JARをダウンロードすることができます。 2021年10月現在では、flatlaf-demo-1.6.1.jarがダウンロードされました。これをダブルクリックで起動すると、各テーマの配色を確認することができます。

基本テーマ

基本のテーマはライト系テーマが2つ、ダーク系テーマが2つの計4つです。

1. Flat Light

2. Flat IntelliJ

3. Flat Dark

4. Flat Darcula(私はこれを採用しました)

拡張テーマ

別途テーマをダウンロードすることによりさらに多くのテーマを選択可能となります。以下わたしがいいと思ったテーマ(ダーク系)を紹介します。

1. Arc Dark

2. Dark Flat

3. Gruvbox Dark Medium

FlatLafベースライブラリのインストール(Mavenを使用する場合)

Mavenプロジェクトのpom.xmlのdependenciesに以下を追記します。

		
<dependency>
	<groupId>com.formdev</groupId>
	<artifactId>flatlaf</artifactId>
	<version>1.6.1</version>
</dependency>
		
		

FlatLafベースライブラリのインストール(jarを直接ダウンロードする場合)

こちらのページからダウンロードできるようになっていますので、最新版のflatlaf-1.6.1.jarをダウンロードして、プロジェクトのビルドパスに追加します。

FlatLaf拡張テーマライブラリのインストール(Mavenを使用する場合)

Mavenプロジェクトのpom.xmlのdependenciesに以下を追記します。

		
<dependency>
	<groupId>com.formdev</groupId>
	<artifactId>flatlaf-intellij-themes</artifactId>
	<version>1.6.1</version>
</dependency>
		
		

FlatLaf拡張テーマライブラリのインストール(jarを直接ダウンロードする場合)

こちらのページからダウンロードできるようになっていますので、最新版のflatlaf-intellij-themes-1.6.1.jarをダウンロードして、プロジェクトのビルドパスに追加します。

使用方法

mainメソッドでSwingコンポーネントを作成する前に次のコードを埋め込むだけです。

		
FlatDarculaLaf.setup();
// create UI here...
		
		

もしくは

		
try {
	UIManager.setLookAndFeel( new FlatDarculaLaf() );
} catch (UnsupportedLookAndFeelException e) {
	e.printStackTrace();
}
// create UI here...
		
		

UIサンプル

こちらの記事で紹介したシンプルメディアプレーヤーのテーマを「Flat Darcula」に変更してみます。flatlaf-1.6.1.jarをビルドパスに追加して、記事中のサンプルコードのmainメソッドを以下のように書き換えます。

		
public static void main(String[] args) {
	FlatDarculaLaf.setup();
	new SimplePlayer();
}
		
		

ウィンドウのHeightを大きくしないと、スライダーの部分がはみ出してしまいました。少し調整が必要となる場合がありますが、一気にかっこよくなりました。