2016-04-25

Mavenでライブラリを追加 Add libraries with Maven

Netbeans

はじめに Introduction

私は今まで, 外部のライブラリをプロジェクトに追加する時, 次の様に行っていました.

ブラウザで使いたいライブラリの.jarを検索
.jarをダウロード
Netbeansで
"プロパティ" --> "ライブラリ" --> "JAR/フォルダを追加" --> ダウンロードした.jarを選択......

しかしこれでは, ライブラリのダウンロードや設定, ヴァージョン管理が面倒くさい, といった問題がある気がします. ライブラリの数が増えるとそれらが更に大変になるでしょう.

そこでMavenを使ってみるとライブラリの準備をとても楽に行う事ができました. NetbeansでMavenを使って, ライブラリをプロジェクトへ追加する手順を紹介します.

The following is how I used to add external libraries to my projects.

Search .jar file of the library I want to use using browser
Download .jar file
With Netbeans,
"Properties" --> "Libraries" --> "Add JAR/Folder" --> Select downloaded .jar......

There are some problems at this method. It is bothersome to download .jar, add to my project, or manage version. The more libraries are increase, the more bothersome to do these.

However, I can add a library to my project easily with Maven now. I am introducing in this article how to add libraries to your netbeans project with Maven.

Maven とは What's Maven

MavenとはJava用プロジェクト管理ツールです. その機能の1つに依存性の管理があります. 依存性とはプロジェクトが依存するライブラリの事です. Mavenのこの機能を使うと, ライブラリのプロジェクトへの追加を簡単に行う事ができます.

Maven is a tool to manage project for Java. Dependency management is one of the function of Maven. Dependency is a library your project depends on. With Maven dependency management function, you can add some libraries to your project easily.

手順

主な手順を次に示します.

Mavenプロジェクトを新規作成
pom.xmlの編集
1. 方法その1
  - ブラウザを使ってMaven Repository: Search/Browse/Exploreでライブラリを検索
  - 調べた情報を元に依存性を追加
2. 方法その2
  - ブラウザを使ってライブラリのホームページを検索
  - pom.xmlに直接依存性の情報を挿入
プロジェクトをビルド

1. Mavenプロジェクトを作成

Netbeansで"ファイル"-->"新規プロジェクト"-->"Maven"-->"Javaアプリケーション"と選択し"次へ"と進みます.
アーティファクトIDとは.jarなどのプロジェクトの成果物の名前です. グループIDとはプロジェクトを一意に識別できる様なグループの名前です. ヴァージョンとはプロジェクトのヴァージョンです. プロジェクトの情報を設定して"終了"で新規プロジェクトの作成を完了します. プロジェクトファイルにpom.xmlというファイルができます.

2. pom.xmlの編集

pom.xmlファイルはMavenプロジェクトの設定が書かれたファイルです.

ライブラリの情報をpom.xmlに追加するには次の2通りの方法があります. 私は後者をお勧めします.

2.1. 方法その1

2.1.1 ライブラリを検索

ブラウザでMaven Repository: Search/Browse/Exploreから検索し, 使いたいライブラリのアーティファクトID, グループ ID, ヴァージョンを調べます.

2.1.2 調べた情報を元に依存性を追加

Netbeansのプロジェクトの"依存性"で右クリックしてメニューから"依存性の追加..."を選択します. 調べたアーティファクトID, グループ ID, ヴァージョンを入力して"追加"を選択します. そうするとプロジェクトフォルダのpom.xmlの

<dependencies>
</dependencies>

のタグの間に

<dependency>
    <groupId>ライブラリのグループ ID</groupId>
    <artifactId>ライブラリのアーティファクト ID</artifactId>
    <version>ライブラリのヴァージョン</version>
</dependency>

という記述が挿入されます.

2.2. 方法その2

2.2.1 ライブラリのホームページを検索

ブラウザで使いたいライブラリのホームページを検索します. Mavenプロジェクトへのライブラリの導入に関する記述を探します. きっとそこには次の様なpom.xmlに挿入すべきテキストがあるでしょう.

<dependency>
    <groupId>ライブラリのグループ ID</groupId>
    <artifactId>ライブラリのアーティファクト ID</artifactId>
    <version>ライブラリのヴァージョン</version>
</dependency>

これをコピーします.

2.2.2 pom.xmlに直接依存性の情報を挿入

Netbeansでプロジェクトファイルのpom.xmlを開きます. そして次のタグの間にコピーした内容をペーストし保存します.

<dependencies>
</dependencies>

もしこのdependenciesタグが無い場合は

<packaging>jar</packaging>

の後にdependenciesタグを追加して下さい.

3. プロジェクトをビルド

最後にプロジェクトをビルドします. Netbeansのプロジェクトで右クリックして"依存性でビルド"を選択します. そうするとライブラリがダウンロードされます. これで追加したライブラリが使える様になります.

How to use Maven

The following is a main process to add a library to your project

Make new Maven project
Edit pom.xml
1. method A
  - Search the library at Maven Repository: Search/Browse/Explore using your browser
  - Add dependency using information you searched
2. method B
  - Search the website of the library using your browser
  - Add information of dependency to pom.xml directly
Build your project

1. Make new Maven project

With Netbeans, go "File"-->"New project"-->"Maven"-->"Java Application", and push "Next".
Artifact ID is the name of project product like .jar file. Group ID is the unique identifier of your group . Version is a version of your project. Input these information and push "finish" to finish making new project. In project files, a file will be created with name pom.xml.

2. Edit pom.xml

In pom.xml file, settings of Maven project is written. There are 2 methods to add information of the external library to pom.xml. I recommend the second method.

2.1. Method A

2.1.1 Search library

With your browser, visit Maven Repository: Search/Browse/Explore, and check the artifact id, the group id, and the version of the library you want to add.

2.1.2 Add dependency to pom.xml

With Netbeans, right-click "dependencies" and open menu. Select "Add dependency...". Input the artifact id, the group id, and the version of the library you checked. Push "Add". And then, look at the tag as follows in pom.xml.

<dependencies>
</dependencies>

The contents as follows are added between that tag.

<dependency>
    <groupId>Group ID of the library</groupId>
    <artifactId>Artifact  ID of the library</artifactId>
    <version>Version of the library</version>
</dependency>

2.2. Method B

2.2.1 Search website of the library

With your browser, search the website of the library you want to add. Find description about adding library to Maven project. Maybe you will find the text like as follows.

<dependency>
    <groupId>Group ID of the library</groupId>
    <artifactId>Artifact ID of the library</artifactId>
    <version>Version of the library</version>
</dependency>

Copy the text you found in order to insert this text to pom.xml.

2.2.2 Insert dependency to pom.xml

With Netbeans, open pom.xml. Insert copied text between the following tag and save.

<dependencies>
</dependencies>

If there is no dependencies tag, add dependencies tag after the following tag.

<packaging>jar</packaging>

3. Build project

At the end, build your project. Right-click project and open menu. Select "Build dependencies". Downloading library will be started automatically and you can use the library.

まとめ Summary

Mavenを利用すると外部のライブラリを簡単に用意する事ができます. その仕方はライブラリのWebサイトを探し, maven用のxmlをコピーし, pom.xmlに挿入するだけです.

With Maven, you can add external library easily. All you have to do is to search website of the library, to copy xml text for Maven, and to insert it to pom.xml.

2016-04-14

学年割電卓に新機能 GakunenWari Calculator updated

My Games/Apps

比で計算できるようになりました.
You can calculate using ratio.
https://jumpaku.github.io/GakunenWari/

以下の学年割り電卓は学年割り電卓2になりました．旧学年割りは現在公開されていません．

Old GakunenWari Calculator is updated to GakunenWari Calculator 2. The following GakunenWari Calculator not available.

新機能 New feature

比計算機能 Calculation using ratio

今までは学年間での支払金額の差を入力すると各学年の1人当たりの支払金額が計算されていました. 今回のアップデートでは学年毎の支払金額の比からも支払金額を計算できる様になりました. これにより, 1年生の支払金額を0にしたり先輩の支払比率を極端に大きくしたりできる様になります.

You could calculate using only difference of payment amount until now. With the new feature, you can using ratio of payment amount too. You can set amount of lowest grader to 0, increase amount of highest grader.

学年割りとは? What is Gakunen-Wari?

学年割りとは学年毎に支払金額を変える割り勘です.
詳しくは以下の記事を読んで下さい.

Gakunen-Wari is a method of splitting the bill. The payment amount of a participant is often changed by his/her grade. Visit here to get more detail.

jumpaku.hatenablog.com

CSSについて About CSS

CSSでタブの位置を調整するのが大変でした. CSSは人が書くものなのかと疑うくらいめんどくさいと思いました.

CSS is too difficult. It was hard for me to set position of tabs.

2016-04-14

愛と血の修羅場(Lovely and Bloody Suspense)

My Games/Apps ウディタ説法系推理アドベンチャシリーズ

館を訪れた私
容疑者の思惑

証言とダイイングメッセージ

浮かび上がる真相
衝撃の結末

At the House.
Each of the suspects has unique faiths.
Testimonies and a Dying message are given.
The truth will out.
You'll be shocked by the last.

ダウンロード DOWNLOAD
愛と血の修羅場(サスペンス)_v1.4.zip - Google ドライブ

概要

タイトル : 愛と血の修羅場
読み : あいとちのさすぺんす
作者 : Jumpaku
ジャンル : 説法系推理アドベンチャ
プレイ時間 : 30分程度
プラットフォーム : Windows
リリース : 2016年3月4日
言語 : 日本語
開発環境 : ウルフRPGエディタ

Detail

Title : 愛と血の修羅場(Lovely and Bloody Suspense)
Pronunciation : Ai to chi no suspense
Written by : Jumpaku
Genre : Adventure or Mystery with sermons
How long : About 30 minutes
Platform : Windows
Released : March 4, 2016
Language : Japanese
Tool : Wolf RPG Editor

遊び方 How to play

以下からダウンロードし, 展開して下さい. Game.exeを実行すると遊べます. 詳しい操作方法は一緒に展開されるREADME.txtを読んで下さい.

Download from here, extract, and execute Game.exe. Read README.txt to see detail.

愛と血の修羅場(サスペンス)_v1.4.zip - Google ドライブ

製作

2016年の2月27日, 私は友人から「第6回ウディフェスにゲームを作って応募しよう」と誘われました. 応募期限は2月29日, 使うのはウルフRPGエディタ. 短い期限と初めてのツールに対して私は最初少し抵抗がありました. しかし簡単なゲームで良いと言われた事, 困った事があればその友人を頼れば良い事, プログラミングするよりもレイヤの高そうなツールを使う良い機会である事などを考えた結果, ゲームを作ってウディフェスに応募する事を決心しました.

マップ作りやイベントの作成と配置の仕方を教えてもらい, ゲームの内容を考え, 手直しをし, ゲームが完成しました. 完成したゲームをウディフェスに応募したのは2月28日の事でした.

しかし, 「愛と血の修羅場(サスペンス)」は非公開となってしまいました. 私は応募要項をよく読んでおらず, 作品表現の基準を満たしていなかったのです. ウディフェス実行委員からのメールにはその他にも修正すべき点がいくつもあると書かれていました. 締切までまだあと1日あったので修正すべき点についてもっと詳しくお教え下さいと返信した所, 私が対応すべき修正箇所を丁寧に説明して下さいました. 更に修正期限を3月4日までとして下さいました.

私は応募要項を熟読し直し, 修正を開始し, 細部に渡って調整し, デバッグし, 再度応募し, 遂に公開されました.

公開後, 大変嬉しい事に「愛と血の修羅場(サスペンス)」の感想メールを頂きました. また実況動画でプレイされているのを見ました. 楽しそうにプレイされていて良かったです. 作った甲斐がありました.

私は前にプログラミングサークル内でRPGを作るプロジェクトに参加していましたが, 1からプログラミングするのはとても難しく, 挫折しました. 既存のジャンルのゲームはプログラミングするよりもレイヤの高い所で楽に開発できる事を実感しました. ゲーム作りにはウルフRPGエディタはもちろん, Unityやティラノビルダーなどのツールを積極的に使っていくべきだと思いました.

Development story

On February 27, 2016, a my friend said me "let's make a game and participate in Wodifes." Wodifes is a game festival. There are many games developed with Wolf RPG Editor. Wolf RPG Editor is a tool to develop Role-Playing-Game. The deadline was February 29, 2016, and that was the first time for me to use Wolf RPG Editor. That was why I hesitated to make a game. However, I decided to create a game. The reasons are as follows.

He said that the game to develop may be simple.
Even if I am in trouble, I can rely on him.
That was a chance to use a higher-layer tool to develop game.

He taught me how to use the tool and I understood. I thought and write detail story of the game with Wolf RPG Editor. With his support, I completed making the game. It was named "愛と血の修羅場(Lovely and Bloody Suspense)" on February 28.

The game was sent to Wodifes immediately, but it wasn't accepted. The game I sent didn't satisfied the standards of expression of works because I hadn't read application requirements carefully. The e-mail from Wodifes executive committee also said that I have to fix many things. Thinking of the deadline, I asked Wodifes executive committee what I should fix. Wodifes executive committee taught me detail of revision points diligently. Furthermore, Wodifes executive committee extended the time limit until March 4, 2016. I won't forget the feelings of gratitude.

After that, I read application requirements carefully, began fixing, debugged, and applied for Wodifes again. At last, "愛と血の修羅場(Lovely and Bloody Suspense)" was accepted and presented to the public.

I got an e-mail from a person who played the game. It told me his/her impression. Furthermore, I found a game commentary video on Youtube. In the video game player looked excited. These made me happy. Thank you very much!

I had tried programming to develop a RPG game before but it was very difficult, at the end, I gave up. I think that game developing tools like Wolf RPG Editor, Unity, or Tyrano Builder are higher-layer than programming. We should use these tools more because they help us to develop games.

ヴァージョン Version

v1.4 : README.txtとエネミィ画像を変更. Changed README.txt and enemy graphic
v1.3 : 誤字を修正 The typo was corrected
v1.2 : ウディフェスに再提出する前にサイズを軽量化 Lightening the data size before to resent to Wodifes
v1.1 : ウディフェスに再提出する為に大幅に修正 Improved to resent to Wodifes
v1.0 : 最初の完成品 Initial product

リンク Links

ダウンロード Download : 愛と血の修羅場(サスペンス)_v1.4.zip - Google ドライブ
実況動画 Youtube : 第6回ウディフェス作品 Live! 実況プレイ#09 作品No.25 No.27 No.29 No.30 - YouTube
実況動作 Youtube : 【フリゲ第6弾】愛と血の修羅場【説法ゲー】 - YouTube
ウディフェス Wodifes : https://hinezumi.net/wodifes/
ウルフRPGエディタ Wolf RPG Editor : WOLF RPGエディター公式サイト【RPG作成フリーソフト】

2015-12-09

JavaFX 0 Prepare JavaFX with NetBeans

JavaFX Netbeans

はじめに Introduction

私は環境構築が嫌いです. できるだけ簡単にJavaFXと日本語のNetBeansを準備してみました. この文章は2016年10月03日に更新しました.

I hate environment construction. Then, I prepared JavaFX and NetBeans. It was very easy.
This description was updated on October 03, 2016.

手順

ここから (https://www.oracle.com/technetwork/java/javase/downloads/index.html) 最新のJavaとNetBeansをダウンロードしてインストールする.
ここから (https://gluonhq.com/labs/scene-builder/) をダウンロードしてインストールする.
NetBeansでツール --> オプションと開いて, Java --> JavaFX の ScenBuilderホームに先ほどインストールしたScene Builderのパスを指定する.

Process

Download latest from https://www.oracle.com/technetwork/java/javase/downloads/index.html and install latest Java and NetBeans.
Download from https://www.oracle.com/technetwork/java/javafxscenebuilder-1x-archive-2199384.html) and install Scene Builder.
Set the path of Scene Builder on NetBeans Tool --> Option --> Java --> JavaFX --> SceneBuilder home, input the path of Scene Builder.

2015-11-29

JavaFX 2 Scene graph and Node

JavaFX

はじめに Introduction

この記事では以下の記事で作成したウェブブラウザを改造します. そしてこの改造を通してJavaFXでGUIを構成する方法, 特にシーングラフについて解説します.

I modified the web browser that was made on my article as follows. With making a web browser, I am going to explain how to set up JavaFX GUI elements, and what is scene graph.

jumpaku.hatenablog.com

作業 Works

JavaFXのJREを含んだ新規プロジェクトを作成する
Create new project contains JavaFX JRE.
WebBrowserクラスを作成し以下のソースコードを記述する
Create WebBrowser class and write source code as follows.
実行すると簡単なブラウザが起動される
Run application and you can use simple web browser.

ソースコード Source code

package jumpaku.webbrowser;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.VBox;
import javafx.scene.web.*;
import javafx.stage.Stage;

public final class WebBrowser extends Application {
    
    public static void main(String[] args) {
        launch(args);
    }

    private WebEngine engine = null;
    
    @Override
    public void start(Stage primaryStage) {
        WebView view = new WebView();
        engine = view.getEngine();
        
        TextField input = new TextField("https://www.google.co.jp/");
        
        engine.load(input.getText());
        
        Button go = new Button("Go");
        go.setOnMouseClicked(e -> engine.load(input.getText()));
        
        Button next = new Button("Next");
        next.setOnMouseClicked(e -> goHistory(1));
        
        Button prev = new Button("Prev");
        prev.setOnMouseClicked(e -> goHistory(-1));
        
        primaryStage.setScene(
                new Scene(
                        new VBox(
                                new ToolBar(
                                        prev, next, input, go),
                                view)));
        primaryStage.show();
    }
    
    private void goHistory(int offset){
        WebHistory history = engine.getHistory();
        int size = history.getEntries().size();
        int dist = history.getCurrentIndex() + offset;
        
        if(0 <= dist && dist < size){
            history.go(offset);
        }
    }
}

説明 Explanation

シーングラフ

JavaFXのGUIを構成する部品をノードと呼びます. 特に子ノードを持てるノードをブランチ, 子ノードを持てないノードをリーフと呼びます. JavaFXのGUIの構造は木構造となっており, これをシーングラフと呼びます. シーングラフのルートは親ノードを持ちません. ルート以外のノードは1個の親ノードと0個以上の子ノードを持ちます. ノードはNodeクラスで表されます. NodeクラスはGUI部品の大きさや位置, イベントハンドラ, 変換, ID, CSSスタイルなどを設定する事ができます. 今回使用したVBox, ToolBar, Button, TextField, WebViewを含む全てのGUI部品はNodeクラスのサブクラスです.

JavaFXではプロパティがサポートされています. プロパティとは値の変更を自動的に反映する仕組みです. Nodeクラスにも多くのプロパティがあります. 今回はプロパティについては説明しません.

WebBrowserクラス

WebBrowserクラスはApplicationクラスを継承しています. startメソッドをオーバーライドし, GUI部品の作成とシーングラフの組み立てをします.

startメソッドではまずWebViewオブジェクトを生成し, そのウェブエンジンをprivateフィールドengineで保持します.

次にTextFieldオブジェクトを生成します. この時コンストラクタで初期テキストとしてGoogleのURLを設定します.

それからアプリケーション起動時にGoogleが開かれる様にGoogleのページをロードします.

そして前のページに戻るprevボタン, 次のページに進むnextボタン, 入力されたurlを開くgoボタンをそれぞれ生成します. それぞれのボタンにはコンストラクタでボタンのラベルに表示される文字列を設定します. またButtonクラスのsetOnMouseClickedメソッドでボタンがクリックされた時に実行されるイベントハンドラを設定します. ここではイベントハンドラにラムダ式を利用しています.

そうして作成したGUI部品, ノードからシーングラフを組み立てます. VBoxオブジェクトがルートとなり, その子ノードにToolBarオブジェクトとviewを保持します. VBoxクラスは子ノードを縦に並べてレイアウトします. ToolBarオブジェクトはprev, next, input, goを子ノードとして保持します. Sceneオブジェクトを生成し, primaryStageに設定します. Sceneオブジェクトにはコンストラクタにルートを渡してシーングラフを設定します.

最後にprimaryStageのshowメソッドでウィンドウを表示します.

WebBrowserクラスはプライベートなフィールドengineを持ちます. engineはstartメソッドで初期化され, goHistoryメソッドで使用されます. goHistoryメソッドは引数のoffset分だけ閲覧履歴を移動します.

Scene Graph

GUI element of JavaFX is called node. Branch is a node that can not have any child nodes. Leaf is a node that can have some child nodes. Scene graph is a tree structure of nodes. Root of a scene graph has no parent node. Node but root has a parent and 0 or more children. Nodes are represented by Node class. You can control bounds, position, event handler, transformation, id, and CSS style of GUI elements with Node class. GUI elements includes VBox, ToolBar, TextField, and WebView class that are used in this WebBrowser are subclass of Node class.

JavaFX supports properties. Properties helps us to listen changes of values. Node class has many properties of that state. I'm sorry, this article does not explain JavaFX properties.

WebBrowser class

WebBrowser class inherits Application class. In overridden start method, GUI elements and a scene graph are constructed. In start method, first, WebView object constructed, web engine of that is set to a private field engine.

Next, TextField object is constructed with initial text string.

Google page is loaded to open google at start of the application.

Then, prev button to go previous page, next button to go next page, and go button to load input URL are constructed. Constructor of Button class sets text of label of the button with given string. Lambda expression given, setOnMouseClicked method is called to set event handler that is handled when mouse is clicked on the button.

After that, scene graph is made of these GUI elements, nodes. VBox object is the root that has 2 children Toolbar object and view. VBox class layouts children vertically. ToolBar object has 4 children pre, next, input, and go. Scene object is constructed with root of scene graph to set to that. The Scene object is set to primaryStage.

Finally, show method of primaryStage is called to show a window.

A field of WebBrowser class, engine is initialized in start method and used in goHistory method. goHistory method moves current page in web history by offset.

まとめ Summary

GUI部品はNodeクラスのサブクラス
GUI elements are subclass of Node class.
シーングラフは木構造
Scene graph is tree structure.