Blog

UNIVERSIDADE FEDERAL DE SANTA CATARINA PROGRAMA DE EDUCACAO TUTORIAL. – CIENCIAS DA COMPUTACAO Componentes da Interface ‘ Grafica da Linguagem Java Wanderson Rigo Vers-0 1. 1 a Florian ‘ polis, Outubro de 2004 0 Esta vers-o inicial pode conter erros que passaram despercebidos ao jula gamento do autor. Assim sendo, o mesmo pede que lhe sejam r leitor encontre. Qual cr g PACE 1 orgi encaminhada por e- S”ipe to next*ge vers-o atualizada de endere,o c http://mo por ventura o u a deve ser ou para o autor.

A ar dispon’ a Iveis no Este documento pode ser distribu- livremente em sua forma original. Ido Partes deste documento podem ser usadas em utros documentos, desde que exista indica, -o de fonte e instrus-es para obtens-o do documento completo. ca co ca O c digo b’ sico aqui apresentado pode ser usado para facilitar a estruturas -o o a ca das futuras aplicas -es do leitor. co A Este documento foi constru e formatado com L TEX 2E Ido Sum no a Pref’ cio a Considera, -es Gerais co 1 Introdua-o Concep. -o de Interfaces Gr’ ficas ca a caa 1. Analogia 3. 1. 1 JFrame … 3. 1. 2JDialog . 3. 1. 3 JApplet e 3. 3 Gerenciadores de Leiaute 3. 2 pain 3. 3. 1 FlowLayout 3. 3. 2 Borderl_ayout .. 3. 3. 3 GridLayout 3. 3. 4 BoxLayout . 3. 3. 5 CardLayout . 3. 3. 6 GridBagLayout . Componentes At- micos 0 4. 1 JLabel . 4. 2 Bot-es . 0 42. 1 JButton . 4. 2. 2 JCheckBox .. 4. 2. 3 JRadi0Button . 4. 3 JTextField 4. 4 JPasswordField . 4. 5 JTextArea JScrolIPane 4. 9 JList 4. 7 JSlider . 4. 6 . 4. 8 Jcomb0Box Interfaces Gr ‘ ficas . 4. 10JPopupMenus … 41415 19 23 24 24 25 27 28 28 31 33 38 38 41 41 444548 50 50 53 54 56 58 62 PAGF gl 5. 1 Tratamento de Evento . Ouvinte do Evento.. . 4. 11 Menus….. Eventos 5. 1. 2 0 Objeto Evento 65 5 Eventos . 5. 1. 1 A Origem do 5. 1. 3 5. 2 Tratadores de Eventos ou Ouvintes (Listeners) 5. 2. 1 ActionListener 5. 2. 2 FocusListener.. 5. 2 3 Iteml_istener 5. 2. 4 Keyl_istener . 2. 5 Mousel_istener • 5. 2 6 MouseMotionListener . _ . 5_2. 7 WindowListener . ses Lista de Figuras 1. 1 2. 1 2. 2 Apresenta, -o de alguns Componentes GUI . a8 Apar- ncia de metal (comum em todas as plataformas) . Apar* ncia personalizada com c estilo do Motif . 25 28 29 31 34 39 42 4446 48 51 54 56 59 63 66 .. 10e19 3. 1 Interface do exemplo que usa JDesktopPane e JInternalFrame 3. 2 Interface do exemplo que usa FlowLayout .. . 3. 3 Interface do exemplo que usa Borderl_ayout para gerenciar a “Ultima Carta”.. … 3. 4 Interface do exemplo que usa BoxLayout . . 3. 5 Interface do exemplo que usa CardLayout . . 3. 6 Interface do xemplo que usa GridBagLayout… . . 4. 1 4. 2 4. 3 4. 4 4. 5 4. 6 4. 7 4. 8 4. 4. 10 4. 11 5. 1 5. 2 Interface Interface Interface Interface Interface Interface Interface Interface Interface Interface Interface do do do do do do do do do do do exemplo exemplo exemplo exemplo exemplo exemplo exemplo exemplo exemplo exemplo exemplo que que que que que que que que que que que usa usa usa usa usa usa usa usa usa usa usa JLabel . JButton JCheckBox . .JRadioButton JTextField . .JTextArea . .JSlider . JComboBox . JList . . JPopupMenu . JMenu Interface do exemplo que demonstra as Atividades do Teclado 74 Interface do exemplo PAGFd gl

Interface do exemplo que demonstra as Atividades do Mouse . 77 4 Pref’ cio a Este material destina-se a usu ‘ rios da linguagem Java que pretendem a incluir interfaces gr ‘ ficas em suas aplica,-es, sejam elas aut-nomas ou apa co o plets. Salientamos que ” de grande Valla ao usu rio j’ estar familiarizado e a a com a Linguagem Java, pois o conte ” do desse material n -o explana conceiu a tos b’ sicos nem discute a sintaxe da Linguagem. Aconselhamos o leitor, caso a julgar necess ‘ rio, a buscar uma base no material Introdua-o Linguagem a ca a Java, sitiado em http://monica. inf. ufsc. br.

Centralizaremos nossos esfor,os de forma transmitir de aneira pr’tica c a a e sucinta o conte ‘ do, de modo que o leitor possa aprender e aplicar os t’ picos u o abordados. Assim sendo, ap “s apresentarmos uma breve explica,-o de cada o ca componente (bot-es, janelas, barras de rolagem, etc… ) usado para comporo mos nossas Interfaces, o leitor ser’ convidado a aprofundar seus conhecimena tos nos exemplos. Cap• ‘tulo 1 traz uma breve introdua-o do que ‘ e para que servem as Interca e faces Gr ficas. Tamb’ m d • bases ao entendimento por parte do leigo ae a usando uma analogia de f’ cil compreens-o. a Cap Itulo 2 apresenta a hierarquia das classes e pacotes em que o ssunto propriamente dito se estrutura. Aqui tamb’ m diferencia- se os compoe nentes em dois hemisf’ rios: Swing e A. W. T.. e Cap Itulo 3 apresenta os componentes onde toda a Interface Gr•fica deve a estar galgada, as caracter’ Isticas de cada um, bem como alguns m • todos e e constantes para o gerenciamen galgada, as caracter’ Isticas de cada um, bem como alguns m ‘todos e e constantes para o gerenciamento e distribuis -o de outros elementos ca sobre os pr ‘ prios componentes. Cap ‘tulo 4 neste cap• ‘tulo explicitamos os componentes que estamos mais habituados a utilizar, pois, de algum modo, ealizam ou disparam funs-es corriqueiras qualquer programa. co a Cap’ ‘tulo 5 mostra os t’ picos relacionados aos eventos disparados por muio tos dos componentes j • vistos nos cap• a ‘tulos precedentes. Tamb ‘m apree sentamos m ‘ todos para gerir e tratar os eventos. e Ap’ s esta breve descri, -o dos t’ picos que ser -o explicitados, sinta-se oca oa a vontade para explorar o conte ‘ do da maneira que melhor lhe convier. u Wanderson Rigo wander@inf. ufsc. r Programa de Educas -o Tutorial – PET/CCO ca pet@inf. ufsc. br 5 Considera. -es Gerais co Ressaltamos que iremos explanar aqui somente alguns m ‘todos ecess ‘ rios e aa ‘s funcionalides dos exemplos, cabendo ao leitor procurar na bibliografia indicada, se julgar necess ‘ rio, maior esclarecimento sobre os demais m ‘todos a e das classes. Cabe ainda lembrar que os exemplos mostrados aqui s -o voltaa dos ao prop sito maior, ou seja, habilltar o leitor a criar interfaces gr ‘ficas. o a A funcionalidade ou complexidade dos mesmos n -o discutida pois estes a e exemplos s’ t • m car ‘ter ilustrativo e did’tico. e aa ‘ E bem sabido que existem programas de desenvolvimento que facilitam a tarefa que aqui propomos elucidar. Al’ m de propiciarem retorno visual e imediato, eles eram o c’ digo automaticamente. Aos olhos do programador o pragm ‘tico, essas virtudes evocam produtividade e facilidade. automaticamente. Aos olhos do programador o pragm ‘ tico, essas virtudes evocam produtividade e facilidade. Porque escoa lher• lamos o caminho das pedras, que consiste num processo em que temos que pensar, compor nossos c • digas e compilar cada vez que mudamos pequeo nos detalhes?

Ora, como programador que se preze, e , com certeza , o leitor h de ser, essa via representa a continuidade do que aprendemos, ou seja, a a implementa, -o direta e sob nosso dom ‘ ca Inio, mantida sob ossa responsabilidade e compet- ncia. Al’ m do mais, quem se aventurar pelas linhas dessa e e material, tranquilamente poder’ explorar os dois caminhos de forma s’ lida a o e concisa. Obviamente aqui n -o focalizaremos a constru,-o de Interfaces no que a ca toca a sua est • tica, mas sim no como fazer.

Tamb ‘m em nenhum momento e e questionamos a qualidade dos aplicativos de linha de comando, por’ m, se e s • 01h ssemos o lindo azul do c’ u, como ir’ o a e lamos ver as demais belezas do planeta? Esperamos que o fasc’ Inio de compor janelas elegantes e funcionais o motivem a extrair o m’ ximo de proveito esse material, pois depois de toda a a evoca, -o e motiva, -o precedente, estamos aptos a iniciar o estudo. ca ca 5 Cap• [tulo 1 Introdus-o Concep,-o de ca a ca Interfaces Gr ‘ficas a not rio a todos n’ s que muitos dos programas que conhecemos interao o gem com os usu ‘ rios atrav’ s da troca de informa,-es.

O meio pelo qual a a e co parte humana solicita ao programa a execu,-o de tarefas, alguma resposta, ca ou qualquer comunica. -o entre as partes ‘ feita pela Interface. Muitas veca e zes confundida com o programa em s’ a Interface tem PAGF 7 gl pela Interface. Muitas veca e zes confundida com o programa em ‘ a Interface tem peso significativo l, na aceitas -o do softw’are,j que, com certeza, clientes s -o atra’ ca a a Idos pela facilidade de manipula, -o e de aprendizado, telas atraentes e chamativas, ca bem como pelos componentes auto-explicativos.

Essas caracter’ Isticas mencionadas s -o obtidas aliando-se criatividade, bom senso, organiza. -o l’ gica, a ca o conhecimento t’ cnico, etc.. e A interface gr ‘fica com o usu • rio (GUI – graphical user interface) fora a nece a um programa um conjunto consistente de componentes intuitivos, familiarizando o usu ‘ rio com as diversas fun,-es e diminuindo o tempo de a co a Idas a partir e aprendizado da nova ferramenta [1]. As GUIS s -o constru componetes GUI, que s -o objetos com o qual o usu rio interage atr’ ves dos a a a dispos’ Itivos de entrada, ou seja, o mouse, o teclado, a voz, etc. . 1 Analogia Recorrente Antes de iniciarmos o conte ‘ do t ‘ cnico deste material, vamos compor um u e cen rio famillar ao Ieltor, de modo que este panorma venha a esclarecer a a filosofia de trabalho que utilizaremos logo adiante. Valeremo-nos de uma analogia, que servir’ de base ao entendimento dos componentes descritos a nesse curso. Imagine que construir interfaces consiste em colar adesivos em uma tela de vidro. Antes de tudo, ‘ bvio que devemos possuir uma tela que, como eo veremos, representada pelos conteners.

Tamb ‘ m dispomos de adesivos e e de diversos tamanhos que podem ser distribu’ Idos e anexados livremente pela superf• do vidro. Tais adesivos elementares s -o os pain ‘ is. Al’ m disso, Icie ae e dispomos de adesivo vidro. Tais adesivos elementares s” o os pain ‘ is. Al’ m disso, ‘Cie a e e dispomos de adesivos mais elaborados que j ‘ est-o pr’ -definidos com figuras aa e de bot-es, r ‘tulos, etc. Eles podem ser colados diretamente no vidro, ou o o sobre os outros adesivos rudimentares (pain’ is), tal qual ‘ a nossa vontade, e e mbora limitando-se capacidade do espap f • a c Isico dispon Ivel. Na figura abaixo, a qual ilustra alguns componentes que ser -o estudados a mais a frente, vemos a concepa-o real de nossa analogia. ca Figura 1 . 1: Apresentas -o de alguns Componentes GUI ca Caro leitor, voc- h • de convir que parece ser uma tarefa demasiadae a mente f’ cil construirmos interfaces que viabilizem a intera,-o Homem x a ca M ‘ quina. Ent-o agora, sem maiores delongas, iremos nos embrenhar pelo a a mundo da programas-o utilizando as classes, pacotes e as interfaces neca cess ‘ rias solu,-o de nosso problema. a ca Cap• Itulo 2 Cria, -o de Interfaces Gr•ficas ca a Em Java, as classes nas quais nos baseamos para criar os componentes, bem como para fornecer-lhes funcionalidade, est-o agrupadas em dois grandes a pacotes: java. awt (pacote do n’ cleo) e javax. swing (pacote de extens-o). u a Os dois pacotes definem componentes com peculiaridades distintas e que ser -o discutidas logo abaixo. a 2. 1 Componentes Swing s -o escria a tos, manipulados e exibidos completamente em Java, sendo conhecidos como componentes Java puros. Isso oferece a eles um maior n’ Ivel de portabilidade e flexibilidade.

Os nomes e tais componentes recebem um “J”, como, por exemplo: JLabel, JButton, JFrame, JPanel, etc. Tal peculiaridade se justifica para diferenciar esses componentes dos que ser -o mencionados logo a adiante. S -o considerados peso-leve e fornecem funcionalidade e apar- ncia a e uniforme em todas as plataforma, sendo denominada de apar•ncia de metal e (metal look-and-feel). Figura 2. 1: Apar-ncia de metal (comum em todas as plataformas) Entretanto, muitos componentes Swing ainda s -o considerados peso-pesados. a Em particular, as subclasses de java. awt. Window, como JFrame, utilizada para exibir janelas e as de java. applet.

Applet, como JApplet originam componentes que se apoiam no sistema de janelas da plataforma local para determinar sua funcionalidade, apar” ncia e seu comportamento[l]. e Figura 2. 2: Apar•ncia personalizada com o estilo do Motif e O Swing tamb ‘m fornece flexibilidade para personalizar a apar- ncia e o e e comportamento dos componentes de acordo com o modo particular de cada plataforma, ou mesmo altera-los enquanto o programa est” sendo executado. a As opões s -o a personaliza,ao com o estilo do Microsoft Windows, do Apple co a c- Macintosh ou do Motif (UNIX). 2. 2 Componentes A. W. Os componentes GUI oriu e Abstract Windowing