OneSpan Sign Como: Criando um Aplicativo de Área de Trabalho JavaFX Simples

JavaFX é uma biblioteca de GUI (Interface Gráfica do Usuário) que permite criar uma variedade de aplicativos de desktop. Ele está no processo atual de substituir o Swing como a biblioteca GUI padrão para Java SE, embora o Swing ainda seja muito usado atualmente. O JavaFX oferece muitas vantagens sobre o Swing, como:

1. Manipulação de evento aprimorada
2. Suporta propriedades
3. Suporta folhas de estilos em cascata (CSS)
4. Controles mais consistentes

O JavaFX e o Swing usam a manipulação de eventos para responder aos eventos de entrada do usuário. No entanto, o JavaFX é mais consistente no tratamento desses eventos do que seus equivalentes no Swing. Isso se deve principalmente ao fato de o JavaFX suportar o conceito de propriedades. Em outras palavras, uma propriedade é uma variável cujo valor pode ser observado e permite escrever código que é acionado automaticamente sempre que a propriedade é alterada. Você também pode vincular propriedades uma à outra, o que significa que, se o valor de uma propriedade for alterado, o outro valor da propriedade será alterado. Neste blog, mostrarei como criar um aplicativo de desktop JavaFX simples, no qual o usuário é obrigado a preencher um formulário e, posteriormente, assinar um contrato de amostra usando OneSpan Sign .

Exigências

Antes de mergulhar no código, você precisará configurar seu ambiente para criar seu aplicativo de desktop JavaFX. Para este blog, você precisará do NetBeans IDE, JavaFX Scene Builder 2.0 e Java SDK do OneSpan Sign.

Baixando o NetBeans 8.1

O NetBeans é o IDE oficial para Java 8. Portanto, ele suporta as mais recentes tecnologias Java. Você pode prosseguir e fazer o download de qualquer IDE que desejar, mas tudo abordado neste blog estará usando o NetBeans. Se você optar por instalar outro IDE, verifique se ele suporta JavaFX. Você também precisará instalar o JDK 8, se ainda não o fez. Você pode baixar o NetBeans e o JDK 8 no link abaixo.

Faça o download do NetBeans 8.1

Baixando JavaFX Scene Builder 2.0

O JavaFX Scene Builder é uma ferramenta de layout visual que permite projetar rapidamente interfaces de usuário (UI) sem precisar escrever nenhum código. À medida que você cria o layout da sua interface do usuário, o código FXML (mais sobre isso posteriormente) é gerado automaticamente. Você pode fazer o download do JavaFX Scene Builder no link abaixo.

Download JavaFX Scene Builder 2.0

Baixando o Java SDK do OneSpan Sign

O link abaixo o levará a uma página na qual você pode baixar o Java SDK do OneSpan Sign e também fornece um link para alguns exemplos de uso do Java SDK no GitHub. Depois de baixar o SDK, descompacte os arquivos JAR em um local de sua escolha. Faça o download do Java SDK do OneSpan Sign

Instalação e Configuração

NetBeans IDE 8.1

Depois de baixar o NetBeans, vá em frente e execute o arquivo executável. Na página Bem-vindo do assistente de instalação, clique em Avançar.

 

 

Em seguida, você verá a página do contrato de licença. Vá em frente, clique na caixa de seleção de aceitação e clique em Avançar.

 

 

Na página de instalação do NetBeans IDE, você pode aceitar o diretório padrão ou especificar um diretório próprio. Por padrão, o instalador preencherá automaticamente o diretório JDK padrão, se encontrado. Se o assistente de instalação não encontrou uma instalação compatível com o JDK para usar com o NetBeans IDE, seu JDK não está instalado no diretório padrão. Nesse caso, especifique o caminho para um JDK instalado e clique em Avançar ou cancele a instalação atual. Depois de instalar a versão JDK necessária, você pode reiniciar a instalação.

 

 

Em seguida, você será apresentado à página Resumo. Aqui, você pode escolher se deseja que o instalador verifique automaticamente as atualizações dos plug-ins instalados. Esta etapa é puramente opcional e deixarei essa etapa a seu critério. Clique em Instalar para iniciar a instalação.

 

 

Na página Instalação concluída, você pode optar por fornecer dados de uso anônimos, se desejar, e clicar em Concluir.

 

 

JavaFX Scene Builder 2.0

Após o download do JavaFX Scene Builder 2.0, vá em frente e execute o arquivo executável. Na página Bem-vindo do assistente de instalação, clique em Avançar.

 

 

Na página de instalação do JavaFX Scene Builder 2.0, você pode aceitar o diretório padrão ou especificar um diretório próprio. Depois de fazer isso, vá em frente e clique em Instalar.

 

 

Quando a instalação estiver concluída, clique em Concluir.

 

O código

Agora estamos prontos para mergulhar no código. Vá em frente e execute o NetBeans IDE. No menu da barra de ferramentas, selecione Arquivo> Novo projeto. Na janela Novo Projeto, selecione "Aplicativo JavaFX" e pressione Avançar.

 

 

Dê um nome ao seu projeto (por exemplo, OneSpan Sign App) e clique em Concluir.

 

Em seguida, na janela Explorador de projetos, expanda a pasta "Pacotes de fontes" e clique com o botão direito do mouse no pacote padrão. Em seguida, selecione Novo> FXML vazio. Nomeie seu FXML como "Form" e Package "esl" e clique em Next.

 

 

Aqui, marque a caixa de seleção "Usar Java Controller" e clique em Concluir.

 

 

FXML é um XML (Extensible Markup Language) para descrever interfaces de usuário. Usaremos o FXML para criar um formulário. Além disso, os aplicativos JavaFX definem o contêiner da interface do usuário por meio de um estágio e uma cena. A classe Stage é o contêiner JavaFX de nível superior (ou seja, janela) enquanto a classe scene é o contêiner de todo o conteúdo.

O próximo passo é criar um arquivo "Form.java". Este arquivo incluirá o código para configurar a classe principal do aplicativo e definir o palco e a cena. Na janela Explorador de Projetos, clique com o botão direito do mouse no pacote "esl" e selecione Novo> Classe Java. Nomeie sua classe "Form" e pressione Concluir. Em seguida, adicione o seguinte código:

pacote esl;

 

importar javafx.application.Application;

importar javafx.fxml.FXMLLoader;

importar javafx.scene.Parent;

importar javafx.scene.Scene;

importar javafx.stage.Stage;

 

/ **

*

* @author hhaidary

* /

público classe Formato estende Inscrição {

 

    @Override

público vazio start (Stage primaryStage) joga Exceção {

Raiz pai = FXMLLoader.load (getClass (). GetResource ( "/esl/Form.fxml" ));

Scene scene = Novo Cena (raiz);

primaryStage.setScene (scene);

primaryStage.setTitle ( "Formulário de criação de pacote ESL" );

primaryStage.show ();

}

     

}

O código acima usa a classe FXMLLoader para carregar o arquivo de origem FXML e retornar o gráfico de objeto resultante.

Agora, editaremos o arquivo FXML criado anteriormente. Na janela Projetos Explorer, clique duas vezes em "Form.fxml". Isso abrirá o JavaFX Scene Builder.

 

 

No menu Pesquisar, digite "TextField" e arraste um contêiner de TextField do painel Library para o AnchorPane, como mostrado abaixo.

 

 

Em seguida, você precisará definir um identificador para este campo de texto para recuperar o valor de entrada do usuário. Objetos em FXML são identificados com um atributo fx: id. Clique na seção Código do painel Inspetor. Isso expandirá um menu onde você pode definir um identificador (por exemplo, firstNameTextfield).

 

 

Agora, no menu Pesquisar, adicione um Rótulo ao lado do campo de texto que você acabou de criar e altere o texto para "Nome:". Repita essas duas etapas anteriores até que seu formulário seja semelhante ao seguinte:

 

 

Como você pode ver, adicionei um botão com a ação "btnCreatePackage". Uma vez que o usuário clica no botão "Criar pacote!" (event), ele executará o método btnCreatePackage () (a ser definido em breve). Salve seu arquivo FXML.

Estamos prontos para editar nossa classe FormController. Primeiro, você precisará declarar as seguintes variáveis de classe. Essas variáveis de classe são os identificadores que definimos anteriormente no FXML.

 

@FXML

privado TextField firstNameTextfield;

    @FXML

privado TextField lastNameTextfield;

    @FXML

privado TextField emailAddressTextfield;

    @FXML

privado TextField companyTextfield;

    @FXML

privado TextField addressTextfield;

    @FXML

privado TextField cityTextfield;

    @FXML

privado TextField stateTextfield;

    @FXML

privado TextField zipTextfield;

    @FXML

privado TextField countryTextfield;

    @FXML

privado TextField phoneNumberTextfield;

    @FXML

privado TextField policyNumberTextfield;

 

o @FXML A anotação é usada para marcar campos de membros do controlador não público e métodos manipuladores para uso pela marcação FXML. Em seguida, precisaremos definir o método btnCreatePackage (). Vá em frente e adicione o código abaixo à sua classe FormController.

 

@FXML privado vazio btnCreatePackage (evento ActionEvent) joga Exceção {           String packageId = ESLSDK.createPackage (firstNameTextfield.getText (), lastNameTextfield.getText (), emailAddressTextfield.getText (), companyTextfield.getText (), addressTextfield.getText (), cityTextfield.getText (), stateTextfield.getText (), zipTextfield.getText (), countryTextfield.getText (), phoneNumberTextfield.getText (), policyNumberTextfield.getText ());     String sessionToken = ESLSDK.createSessionToken (packageId);           ((Nó) (event.getSource ())). GetScene (). GetWindow (). Hide ();           Estágio Estágio = Novo Palco(); stage.setWidth ( 1000,0 ); stage.setHeight ( 1000,0 ); Scene scene = Novo Cena( Novo Grupo());           final Navegador WebView = Novo WebView (); final WebEngine webEngine = browser.getEngine ();           ScrollPane scrollPane = Novo ScrollPane (); scrollPane.setFitToHeight ( verdadeiro ); scrollPane.setFitToWidth ( verdadeiro ); scrollPane.setContent (navegador);           webEngine.load ( " <a href="https://sandbox.esignlive.com/access?sessionToken="> https://sandbox.esignlive.com/access?sessionToken= </a> " + sessionToken);           scene.setRoot (scrollPane);       stage.setScene (cena); stage.setTitle ( "Obrigado por preencher o formulário! Por favor assine o documento abaixo." ); stage.show ();           }

 

As duas primeiras linhas chamam os métodos createPackage () e createSessionToken () da classe ESLSDK, que serão criados em breve, para criar um pacote no eSignLive usando as entradas dos campos de texto.

String packageId = ESLSDK.createPackage (firstNameTextfield.getText (), lastNameTextfield.getText (), emailAddressTextfield.getText (), companyTextfield.getText (), addressTextfield.getText (), cityTextfield.getText (), stateTextfield.getText (), zipTextfield.getText (), countryTextfield.getText (), phoneNumberTextfield.getText (), policyNumberTextfield.getText ());     String sessionToken = ESLSDK.createSessionToken (packageId);

 

As próximas linhas ocultarão a janela atual e abrirão uma nova.

 

((Nó) (event.getSource ())). GetScene (). GetWindow (). Hide ();

 

Estágio Estágio = Novo Palco();

stage.setWidth ( 1000,0 );

stage.setHeight ( 1000,0 );

Scene scene = Novo Cena( Novo Grupo());

 

Em seguida, usaremos a classe WebView e WebEngine para carregar a URL que redirecionará o usuário para a cerimônia de assinatura usando o token de autenticação do assinante criado anteriormente.

 

final Navegador WebView = Novo WebView (); final WebEngine webEngine = browser.getEngine ();           ScrollPane scrollPane = Novo ScrollPane (); scrollPane.setFitToHeight ( verdadeiro ); scrollPane.setFitToWidth ( verdadeiro ); scrollPane.setContent (navegador);           webEngine.load ( " https://sandbox.esignlive.com/access?sessionToken= " + sessionToken);           scene.setRoot (scrollPane); stage.setScene (cena); stage.setTitle ( "Obrigado por preencher o formulário! Por favor assine o documento abaixo." ); stage.show ();

 

A etapa final é criar sua classe "ESLSDK". Depois de fazer isso, você pode copiar o seguinte código:

 

/ * * Para alterar este cabeçalho da licença, escolha Cabeçalhos da licença em Propriedades do projeto. * Para alterar este arquivo de modelo, escolha Ferramentas | Modelos * e abra o modelo no editor. * / pacote esl;   importar java.io.FileInputStream; importar java.io.FileNotFoundException; importar java.io.InputStream; importar org.joda.time.DateTime;   importar com.silanis.esl.sdk.DocumentPackage; importar com.silanis.esl.sdk.DocumentType; importar com.silanis.esl.sdk.EslClient; importar com.silanis.esl.sdk.PackageId; importar com.silanis.esl.sdk.SessionToken; importar com.silanis.esl.sdk.builder.CeremonyLayoutSettingsBuilder; importar com.silanis.esl.sdk.builder.DocumentBuilder; importar com.silanis.esl.sdk.builder.DocumentPackageSettingsBuilder; importar com.silanis.esl.sdk.builder.FieldBuilder; importar com.silanis.esl.sdk.builder.PackageBuilder; importar com.silanis.esl.sdk.builder.SignerBuilder;   público classe ESLSDK {       privado estático String CUSTOM_ID = "Signer1" ; privado estático String API_KEY = "Chave API" ; privado estático String BASE_URL = "https://sandbox.esignlive.com/api" ;   público estático String createPackage (String firstName, String lastName, String emailAddress, String company, Endereço da string, Cidade da string, Estado da string, Zip da string, País da string, String phoneNumber, String policyNumber) joga FileNotFoundException {   Cliente EslClient = Novo EslClient (API_KEY, BASE_URL);   InputStream fs = Novo FileInputStream ( "DOC_FILE_PATH" );   // Construa o objeto DocumentPackage DocumentPackage documentPackage = PackageBuilder.newPackageNamed ( "Pacote de formulários Java" + DateTime.now ())   // Personalizar configurações do pacote .withSettings (DocumentPackageSettingsBuilder.newDocumentPackageSettings (). withDecline (). withOptOut () .withDocumentToolbarDownloadButton ()   // Personaliza as configurações da cerimônia de assinatura .withCeremonyLayoutSettings (CeremonyLayoutSettingsBuilder.newCeremonyLayoutSettings () .withoutGlobalNavigation (). withoutBreadCrumbs (). withoutSessionBar (). withTitle ()))   // Definir o nome e o sobrenome do segurado .withSigner (SignerBuilder.newSignerWithEmail (emailAddress) .withCustomId (CUSTOM_ID) .withFirstName (firstName) .withLastName (lastName) .wComCompany (company))   // Definir remetente .withSigner (SignerBuilder.newSignerWithEmail ( "remetente @example .com " ) .withCustomId ( "Remetente1" ) .withFirstName ( "Haris" ) .withLastName ( "Haidary" ) .withTitle ( "Evangelista Técnico" ) .acompanhado( "eSignLive" )))   // Defina o documento .withDocument (DocumentBuilder.newDocumentWithName ( "Formato" ) .fromStream (fs, DocumentType.PDF) .enableExtraction () .withInjectedField (FieldBuilder.textField (). withName ( "primeiro nome" ) .withValue (firstName)) .withInjectedField (FieldBuilder.textField (). withName ( "último nome" ) .withValue (lastName)) .withInjectedField (FieldBuilder.textField (). withName ( "endereço" ) .withValue (endereço)) .withInjectedField (FieldBuilder.textField (). withName ( "cidade" ) .withValue (cidade)) .withInjectedField (FieldBuilder.textField (). withName ( "Estado" ) .withValue (state)) .withInjectedField (FieldBuilder.textField (). withName ( "fecho eclair" ) .withValue (zip)) .withInjectedField (FieldBuilder.textField (). withName ( "país" ) .withValue (país)) .withInjectedField (FieldBuilder.textField (). withName ( "número de telefone" ) .withValue (phoneNumber)) .withInjectedField (FieldBuilder.textField (). withName ( "companhia" ) .withValue (empresa)) .withInjectedField (FieldBuilder.textField (). withName ( "o email" ) .withValue (emailAddress)) .withInjectedField (FieldBuilder.textField (). withName ( "Número da polícia" ) .withValue (policyNumber))   ).Construir();   // Emita a solicitação ao servidor e-SignLive para criar o // DocumentPackage PackageId packageId = client.createPackage (documentPackage); client.sendPackage (packageId);                  // Remetente assina documento client.signDocuments (packageId);   Retorna packageId.toString (); }   público estático String createSessionToken (String packageId) { Cliente EslClient = Novo EslClient (API_KEY, BASE_URL);   SessionToken sessionToken = client.getSessionService (). CreateSessionToken (packageId, CUSTOM_ID); //System.out.println(" Token de sessão: "+ sessionToken.getSessionToken ());   Retorna sessionToken.getSessionToken (); } }

 

Como você provavelmente notará, o compilador lançará um erro. Isso ocorre porque não referenciamos o OneSpan Sign Java SDK. Clique com o botão direito do mouse na pasta Libraries no Projects Explorer e selecione Add JAR / Folder. Navegue até o local em que você salvou os arquivos JAR, selecione-os e clique em Abrir. Além disso, certifique-se de substituir os espaços reservados da chave api e do caminho do arquivo do documento por seu próprio valor.

Executando seu código

Agora você está pronto para executar seu aplicativo de desktop JavaFX. Clique em Executar na barra de ferramentas. Você poderá ver seu formulário, conforme mostrado abaixo.

 

 

Após preencher algumas informações de exemplo, clique no botão "Criar pacote!" botão. Você deve ser redirecionado para a cerimônia de assinatura do OneSpan Sign e o documento pronto para ser assinado.

 

 

Você pode fazer o download do projeto completo no Developer Community Code Share, aqui .

Se você tiver dúvidas sobre este blog ou qualquer outra coisa relacionada à integração OneSpan Sign em seu aplicativo, visite os fóruns da comunidade de desenvolvedores: https://developer.esignlive.com . É isso de mim. Obrigado pela leitura! Se você achou esta publicação útil, compartilhe-a no Facebook, Twitter ou LinkedIn.

Haris Haidary
Evangelista Técnico Júnior
LinkedIn | Twitter