Это вторая часть серии статей о JavaFX и Seam with Flamingo . Основываясь на исходной информации из первой части статьи, эта вторая часть предоставляет пошаговое руководство по созданию приложений JavaFX, взаимодействующих с бэкэндом Seam.

Что мы собираемся построить

Вот снимок экрана приложения, которое мы собираемся создать. Приложение позволяет добавлять и удалять пользователей.

Что вам нужно

Вам понадобится следующее программное обеспечение, чтобы пройти пример. Возможно, у вас уже есть некоторые инструменты:

1. JavaFX SDK

2. Затмение 3.4.2

   1. Плагин Exadel JavaFX Studio для Eclipse

3. Сервер приложений JBoss 4.3.2 (для развертывания приложения Seam)

4. Готовое к развертыванию приложение Seam

5. Эксадель Фламинго

Примечание. Если вы предпочитаете читать учебник, не выполняя описанных шагов, в конце я предоставил готовое приложение, которое вы можете загрузить и развернуть в JBoss AS. Смотрите раздел «Готовая заявка».

JavaFX SDK

1. Загрузите JavaFX SDK для вашей операционной системы

2. Установите JavaFX SDK

Затмение 3.4

Если у вас нет Eclipse 3.4.2, загрузите его отсюда . Хотя простого Eclipse достаточно, было бы неплохо загрузить пакет Eclipse IDE для разработчиков Java EE. Все, что вам нужно сделать, это разархивировать загруженный файл.

Плагин Exadel JavaFX Studio для Eclipse

Плагин Exadel JavaFX Studio для Eclipse предоставляет функции, помогающие создавать и развертывать приложения JavaFX. Плагин бесплатный. Перейдите на страницу JavaFX Studio и нажмите ссылку «Загрузить» в меню слева.

Вы не обязаны использовать этот плагин. Вполне возможно создать это приложение, просто используя JavaFX SDK и инструменты командной строки; однако плагин значительно упростит этот процесс.

Установка плагина

1. Скачайте плагин, разархивируйте скачанный файл

2. Запустите Eclipse IDE

3. В меню Справка выберите Обновления программного обеспечения.

4. В диалоговом окне «Обновления программного обеспечения и надстройки» перейдите на вкладку «Доступное программное обеспечение».

5. Нажмите кнопку «Добавить сайт», выберите «Локальный», перейдите в папку с распакованным плагином, выберите этот каталог (где находится распакованный плагин) и нажмите OK.

6. Вы увидите опцию «Exadel JavaFX 1.0 Update Site» в списке. Проверьте опцию и нажмите Установить. Следуйте процедуре установки, чтобы установить плагин. В конце вас попросят перезапустить IDE.

7. Настройте JavaFX SDK

   1. Выберите Окно / Настройки / JavaFX

   2. Нажмите Добавить …

   3. Перейдите в папку, в которую вы установили JavaFX SDK

   4. Нажмите Готово. Теперь вы настроили JavaFX SDK.

8. Последний шаг — протестировать плагин (мы будем использовать этот проект позже):

   1. Выберите Файл / Новый / Другой … /

   2. Выберите проект JavaFX / JavaFX

   3. Нажмите «Далее

   4. В качестве имени проекта введите: javafx-seam

   5. Нажмите Готово

   6. Разверните проект, щелкните правой кнопкой мыши src и выберите New / Package.

   7. Для названия пакета введите: test

   8. Нажмите Готово

   9. Щелкните правой кнопкой мыши тестовый пакет и выберите New / Other … / JavaFX / JavaFX Script

   10. Нажмите «Далее

   11. Для имени файла введите: test (вам не нужно вводить .fx)

   12. Нажмите «Далее

   13. Выберите «Создать этап». Файл будет создан на простой стадии JavaFX.

   14. Щелкните правой кнопкой мыши в любом месте источника и выберите «Запустить как / JavaFX Application». Должно открыться окно с сообщением «Hello World». Если вы видите это окно, то все работает.

JBoss AS

Если у вас нет JBoss AS 4.2.3, пожалуйста, загрузите его. Все, что вам нужно сделать, это разархивировать загруженный файл. Это приложение было протестировано с JBoss AS 4.2.3 GA.

Шовное приложение

1. Загрузите приложение Seam.

2. Приложение завершено и готово к развертыванию. Скопируйте файл в <jbossas> / server / default / deploy

3. Чтобы запустить сервер, запустите <jboss> / bin / run

4. Чтобы убедиться, что приложение развертывается нормально, перейдите по адресу [ http: // localhost: 8080 / flamingods и нажмите ссылку на странице. , Это страница JSF для отображения пользователей в таблице. Если вы видите эту страницу, то приложение успешно развернуто

Давайте рассмотрим код приложения Seam.

Есть класс User, который выглядит так:

public class User {

@Length(min=3, max=40)
private String name;


public User (){
}

public User(String name) {
super();
this.name = name;
}

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

@Override
public String toString() {
return this.name;
}

} 

Пользователь — это наша модель в этом приложении. Также есть компонент userManager, который выглядит следующим образом:

@Scope (ScopeType.SESSION)
@Name ("userManager")
public class UserManager {
@In (required=false)
@Out (scope=ScopeType.SESSION, required=true)
private List <User> userList;

@Logger
private Log log;

@Factory ("userList")
public void create () {
userList = new ArrayList <User> ();
User user1 = new User ("John");
User user2 = new User ("Charley");
User user3 = new User ("Sergey");
userList.add(user1);
userList.add(user2);
userList.add(user3);
}

public void remove (int index){
User userToDelete = userList.get(index);
log.info("Deleting user: "+userToDelete.getName());
userList.remove(userToDelete);
log.info("all users: "+userList);
}

public void addUser (String name){
User user = new User ();
user.setName(name);
userList.add(user);
log.info("addUser(String) Added new user: "+user.getName());
log.info("all users: "+userList);
}

}

Компонент userManager содержит список пользователей и знает, как добавлять и удалять пользователей.

Фламинго

И, наконец, нам нужно скачать фламинго

1. Скачать Фламинго

2. Распакуйте файл (мы вернемся к Фламинго чуть позже.)

JavaFX, говорящий со швом

Теперь, когда у нас работает серверная часть (Seam), мы собираемся создать пользовательский интерфейс JavaFX и подключить его к серверной части. Это общие шаги:

1. Создать пользовательский интерфейс JavaFX

2. Создание клиентских сервисных интерфейсов

   1. Создать клиентскую фабрику

3. Изменение скрипта JavaFX

   1. Настройка URL сервера

   2. Загрузка существующих пользователей

   3. Добавление пользователя

   4. Удаление пользователя

   5. Проверка

Создание пользовательского интерфейса JavaFX

Вы уже создали проект (javafx-seam), поэтому давайте снова его использовать.

1. Создайте новый класс Java: example.model.User (обратите внимание на имя пакета)

2. Скопируйте и вставьте следующее:

   package example.model;
   
   public class User {
   	private String name;
   
   	public String getName() {
   		return name;
   	}
   	public void setName(String name) {
   		this.name = name;
   	}
   	public User(String name) {
   		super();
   		this.name = name;
   	}
   	public User (){}
   	@Override
   	public String toString() {
   		return this.name;
   	}
   }

   Это простой Java-бин, который будет использоваться как объект модели.

    

3. Создайте новый пакет: example.javafx 

4. Щелкните правой кнопкой мыши созданный пакет и выберите New / Other … / JavaFX / JavaFX Script

5. Для имени введите: UsersView
6. Нажмите Готово
7. Скопируйте и вставьте следующий JavaFX Script.
   

   package example.javafx;
   
   import javafx.scene.Scene;
   import javafx.stage.Stage;
   import javafx.scene.layout.HBox;
   import javafx.scene.layout.VBox;
   import javafx.scene.layout.Tile;
   import javafx.scene.text.Font;
   import javafx.scene.text.Text;
   import javafx.scene.control.TextBox;
   import javafx.scene.control.Button;
   import javafx.scene.control.Label;
   
   import example.model.User;
   
   var users: User[];
   
   function add () : Void {
     var newUser:User = new User ();
     newUser.setName (inputText.text);   
     insert {newUser} into users;  
   }
   function remove (idx : Integer) : Void {
     delete users[idx];
   }
   var inputText : TextBox = TextBox { 
        columns: 20                                 
   }
   var buttonAdd : Button = Button { 
         text: "Add"
         style: "base: blue" 
         action: function () {add()}
   }
   var buttonClear : Button = Button { 
         text: "Clear" 
         style: "base: blue" 
         action: function () {inputText.text = "";}
   }
   Stage {
     title: 'JavaFX and Seam'
     scene: Scene { 
        width: 500 
        height: 300
        content: [
            VBox { 
                translateX: 5
                translateY: 5
                content: [
                   VBox {
                     spacing: 8  
                      content: [
                         HBox {
                           content: [inputText] 
                        }
                        HBox {
                          spacing: 8
                          content: [buttonAdd, buttonClear]
                        }
                     ]
                 },
                 VBox {              
                     translateX: 10
                     translateY: 20
                     spacing: 5
                     content: bind for (p in users) {
                         HBox {
                           spacing: 8
                           content:[
                              Text {
                                 font: Font { size: 16 } 
                                 content: (p.getName() )
                              }
                              Button {
                                  height: 16 
                                  style: "base: blue" 
                                  text: 'Delete' 
                                  action:function () {remove(indexof p)}}
                           ]  
                         } 
                     }
                 }
             ]
          }
       ]
     }
   }
   

То, что вы видите здесь, является довольно простым скриптом JavaFX. Он еще ни к чему не подключен, но мы уже можем его запустить. Щелкните правой кнопкой мыши в редакторе и выберите «Запустить / JavaFX Application». Вы должны увидеть следующее:

Вы также можете запустить его как апплет, выбрав Run / JavaFX Application (Applet). Вы должны увидеть следующее:

Примечание: как только мы добавим связь с сервером, вы получите ошибки при запуске в качестве апплета. Мы исправим это, подписав файлы jar. Просто предупреждаю вас, если вы снова запустите приложение.

С этого момента мы будем редактировать этот файл скрипта JavaFX.

Создание клиентских сервисных интерфейсов

Прежде чем мы сможем вызывать методы компонента Seam из JavaFX, нам нужно знать, какие методы фактически доступны в компоненте Seam. Это делается путем создания интерфейса службы, который выглядит следующим образом:

package example.service;

public interface UserManager {
	public void remove (int index);
	public void addUser (String name);
}

Если вы посмотрите на код Seam, есть компонент userManager с теми же методами. Есть еще один для сервиса Binding

package example.service;

public interface BindingManager {
	public Object getObject(String componentName);
}

BindingManager — это встроенный в Flamingo серверный компонент, поэтому вам не нужно его создавать.

Создание клиентской сервисной фабрики

На этом этапе мы должны добавить файлы Flamingo и Hessian .jar. (Hessian — это двоичный протокол, который используется во Фламинго для связи с сервером.)

1. Создайте каталог lib в проекте javafx-seam. Вы можете использовать Eclipse для создания каталога

2. Скопируйте <фламинго> /bin/flamingo-javafx-1.8.1.jar в каталог javafx-seam / lib

3. Загрузите гессенский jar,  http://hessian.caucho.com/download/hessian-3.1.5.jar и скопируйте его также в javafx-seam / lib.

4. Разверните папку lib и выберите оба файла. Щелкните правой кнопкой мыши и выберите Build Path / Add to Build Path.

Далее нам нужно создать клиентскую ссылку (или прокси) на компоненты Seam:

package example.service;

import java.util.List;
import com.exadel.flamingo.javafx.ServiceFactory;
import example.model.User;

public class AppServiceFactory {
 public static BindingManager getBindingManager() {
   return (BindingManager) ServiceFactory.getService(BindingManager.class,
      "com.exadel.flamingo.service.binding.bindingManager");
 }
 public static UserManager getUserManager() {
   return (UserManager) ServiceFactory.getService(UserManager.class, "userManager");
 }
 public static User[] getUserList() {
   List<User> list = (List<User>) getBindingManager().getObject("userList");
   User[] temp = new User[list.size()];
   User[] users = list.toArray(temp);
   return users;
 }
}

GetService в Flamingo принимает два аргумента: (1) интерфейс сервиса и (2) Seam имя компонента. com.exadel.flamingo.service.bindingManager — это встроенный компонент Flamingo, который в некотором контексте связывает переменную Seam. userManager — это определенный нами компонент Seam (см. код на стороне сервера).

import com.exadel.flamingo.javafx.ServiceFactory;
...
ServiceFactory.setUrl('http://localhost:8080/flamingo-ds/seam/resource/hessian/');

import java.net.CookieHandler;
import java.net.CookieManager;
import java.net.CookiePolicy;
...
ServiceFactory.setUrl('http://localhost:8080/flamingo-ds/seam/resource/hessian/');
CookieHandler.setDefault(new CookieManager(null, CookiePolicy.ACCEPT_ALL));

var users: User[] ;

import com.exadel.flamingo.javafx.FlamingoServiceFactory;
import example.service.*;
...
var users: User[]  = AppServiceFactory.getUserList ();

function add () : Void {

  var newUser:User = new User ();
  AppServiceFactory.getUserManager().add(inputText.text);
  newUser.setName (inputText.text);   
  insert {newUser} into users;  
}

function remove (idx : Integer) : Void {
  AppServiceFactory.getUserManager().remove(idx);
  delete users[idx];
}

var message : String;

var messageText  : Text = Text{
        font: Font { size: 16 } 
        content: bind message    
}

HBox {
        content: [inputText , messageText] 
}

message = FlamingoServiceFactory.getHessianEntityValidator().validate("user.name", inputText.text);
  if ( message != null ){
    return;
 }