fltk summer course - part i - first impact

55
1 de 55 INTRODUÇÃO AO FAST LIGHT TOOLKIT - FLTK The Fast Light ToolKit Curso de Verão – Instituto de Computação & CA Computação Michel Alves dos Santos - UFAL Bolsista do Centro de Pesquisa em Matemática Computacional 1º Impacto

Upload: michel-alves

Post on 11-Jul-2015

245 views

Category:

Education


7 download

TRANSCRIPT

Page 1: FLTK Summer Course - Part I - First Impact

1 de 55INTRODUÇÃO AO FAST LIGHT TOOLKIT - FLTK

The Fast Light ToolKit

Curso de Verão – Instituto de Computação & CA ComputaçãoMichel Alves dos Santos - UFALBolsista do Centro de Pesquisa em Matemática Computacional

1º Impacto

Page 2: FLTK Summer Course - Part I - First Impact

2 de 55O QUE É GUI ?

O que é GUI ?Acrônimo para Graphical User Interface, ou seja, um tipo de interface do usuário que permite a interação com dispositivos digitais através de elementos gráficos como ícones, botões, caixas de entrada e outros indicadores visuais, em contraste a interface de linha de comando.

A interação é feita geralmente através de um mouse ou teclado, com os quais o usuário é capaz de selecionar símbolos e manipulá-los de forma a obter algum resultado prático. Esses símbolos são designados de widgets e são agrupados em kits.

 [A esquerda KDE 4.1 e a direita uma interface modificada do Desktop SUGAR para OLPC ]

Page 3: FLTK Summer Course - Part I - First Impact

3 de 55INTERAÇÕES BÁSICAS – ESTILOS DE INTERAÇÃO

Estilos de Interação

What you see is what you get (WYSIWYG) :Realimentação visual é igual ao resultado obtido.

Non-WYSIWYG :Realimentação visual difere do resultado obtido.

Manipulação Direta :Interação ocorre diretamente sobre a realimentação visual.

 [Algumas formas de interação entre usuários e sistemas computacionais]

Page 4: FLTK Summer Course - Part I - First Impact

4 de 55O QUE SÃO WIDGETS ?

O que são WIDGETs ?São componentes da interface gráfica providos de geometria (look) e comportamento (feel) próprios. São agrupados em API´s [de baixo ou alto nível] ou Kits.

 [Buttons]

 [List Box]  [Combo Box]

 [Dialog Box]

 [Scrollbars]

 [Menubar + Toolbar]  [Textboxes]

Page 5: FLTK Summer Course - Part I - First Impact

5 de 55CLASSIFICAÇÃO DOS WIDGETS

Classificação dos Widgets

Widgets de baixo nível são utilizados na confecção do sistema operacional e fazem parte do núcleo do sistema [Este núcleo é acessado por

outros widgets de alto nível que por fim montam a GUI]. Alguns exemplos são:

Windows 32/64 API; MAC Carbon; Unix X-Windows.

Widgets de alto nível seriam os objetos finais propriamente ditos. Muitas vezes fazem referências a objetos de baixo nível fornecidos pelo sistema operacional. Estes objetos são facilmente encontrados em bibliotecas de desenvolvimento (toolkit) ou em frameworks. Alguns exemplos são: WxWidgets (chamada anteriormente de WxWindows); Cocoa (MAC OS X); MFC (Microsoft Foundation Classes); WTL (Windows Template Library - utilizada como substituto para partes do MFC) Motif (usado no Common Desktop Enviroment- UNIX CDE) Lesstif (uma versão LGPL do Motif) , GTK +, AWT, Swing, SWT/JFace ...

Page 6: FLTK Summer Course - Part I - First Impact

6 de 55

API´s e Sistemas Operacionais

ESTUDO DE CASO – API´s e SISTEMAS OPERACIONAIS

Page 7: FLTK Summer Course - Part I - First Impact

7 de 55COMO PROGRAMAR PARA WINDOWS [API , MFC E WINDOW FORMS]

Programação GUI para a Família M$ Windows®

WINDOWS API

MFC [MICROSOFT FOUNDATION CLASSES]

WINDOWS FORMS [.NET GUI SYSTEM]

 Arquitetura de aplicações usando Windows Forms

Bibliotecas que “empacotam” porções da API do Windows em classes e dão aos desenvolvedores de programas um conjunto de componentes reutilizáveis escritos em C++ que encapsulam as funcionalidades necessárias para o desenvolvimento de aplicações para sistemas operacionais Windows®.

Nova forma de “janelamento” introduzida com a plataforma .NET. Esse é o mecanismo base para desenvolvimento de aplicações que são executadas junto a CLR [Common Language Runtime]

Construção em baixo nível de todos os componentes visuais [botões, barras de status, menus] e não-visuais [gerenciamento de processos, escrita em disco, etc] pertencentes aos sistemas operacionais MS Windows®.

Page 8: FLTK Summer Course - Part I - First Impact

8 de 55COMO PROGRAMAR PARA MAC OS X [CARBON E COCOA]

Programação GUI para o MAC OS X

 [MAC X – Estrutura das API´s - nativamente são suportadas cinco : Carbon, Cocoa, POSIX, Toolbox (antigo Classic Enviroment) e Java ]

Page 9: FLTK Summer Course - Part I - First Impact

9 de 55COMO PROGRAMAR PARA MAC OS X [CARBON E COCOA]

Programação GUI para o MAC OS X

COCOA [Mac OS X]

CARBON [Mac OS 9 e Mac OS X]É um conjunto procedural de API´s em C para MAC OS X que é baseado nas “velhas” API´s do MAC OS 9. Nem todas as API´s carbon foram portadas pois existem diferenças radicais entre MAC OS X e MAC OS 9 [uma delas é a não compatibilidade total da API Carbon com aplicações de 64 bits para MAC OS 10.5]

É uma API orientada a objetos para desenvolvimento de aplicações escrita em Objective-C e Java. Cocoa é largamente baseado nos frameworks do OpenStep e consiste primariamente em duas partes : A Foundation (classes fundamentais) e a Applicatino Kit (classes para elementos GUI).

Core Foundation e outras camadas de software no Mac OS X

 Core Foundation e Carbon no Mac OS 9

Page 10: FLTK Summer Course - Part I - First Impact

10 de 55COMO PROGRAMAR PARA MAC OS X [CARBON E COCOA]

 [Exemplo de uma aplicação “carbonizada” sendo executada em MAC OS X]

Page 11: FLTK Summer Course - Part I - First Impact

11 de 55COMO PROGRAMAR PARA X WINDOW SYSTEM

Programação GUI para X Window System

X Window SystemO X-Window, X11 ou simplesmente X é um protocolo e seu software associado possibilita o emprego de uma interface gráfica com o conceito de janelas. Originalmente chamado simplesmente de X, foi desenvolvido no MIT em 1984. Atualmente está na versão 11 e por isso carrega no nome este número.

X-Window também é o toolkit e protocolo padrão para GUI nos sistemas Unix e assemelhados, como o Linux, mas existem versões para outros sistemas operacionais, como o Microsoft Windows e o Mac OS, por exemplo.

O X (como é comumente chamado) funciona segundo o modelo cliente-servidor. Este modelo de comunicação permite o uso de janelas de modo transparente através da rede.

Logotipo do X

Programas desenvolvidos na distribuição do núcleo do X : xterm, twm, xdm, xconsole, xclock, xeyes, Xserver, xclipboard entre outros ...

Captura de tela do X em execução com diversos aplicativos sendo utilizados.

Page 12: FLTK Summer Course - Part I - First Impact

12 de 55

COMO PROGRAMAR PARA X WINDOW SYSTEM

 [O TWM - Tab Window Manager – também conhecido como Tom´s Window Manager, devido ao seu principal autor]

Page 13: FLTK Summer Course - Part I - First Impact

13 de 55

Widgets de Alto Nível

ESTUDO DE CASO – WIDGETS DE ALTO NÍVEL

Page 14: FLTK Summer Course - Part I - First Impact

14 de 55LISTA DE WIDGET TOOLKITS – API´s DE ALTO NÍVEL

WIDGET TOOLKITS

EWL

E muitos outros ...

Page 15: FLTK Summer Course - Part I - First Impact

15 de 55CAPACIDADES/FUNCIONALIDADES DOS WIDGET TOOLKITS

O que os Widget Toolkits podem fazer ?

DESKTOP EQUINOX – Construído a partir de um fork do FLTK chamado eFLTK.

Page 16: FLTK Summer Course - Part I - First Impact

16 de 55

CAPACIDADES/FUNCIONALIDADES DOS WIDGET TOOLKITS

O que os Widget Toolkits podem fazer ?

DESKTOP GNOME – Construído a partir do kit GTK+

Page 17: FLTK Summer Course - Part I - First Impact

17 de 55CAPACIDADES/FUNCIONALIDADES DOS WIDGET TOOLKITS

O que os Widget Toolkits podem fazer ?

DESKTOP KDE – Construído a partir das classes do kit QT da trolltech.

Page 18: FLTK Summer Course - Part I - First Impact

18 de 55CAPACIDADES/FUNCIONALIDADES DOS WIDGET TOOLKITS

O que os Widget Toolkits podem fazer ?

DESKTOP Enlightenment – Construído a partir do kit EWL.

Page 19: FLTK Summer Course - Part I - First Impact

19 de 55FERRAMENTAS DE PRODUÇÃO – IDE´s E EDITORES AVANÇADOS

Ferramentas de Produção

FERRAMENTAS UTILIZADAS NA PRODUÇÃO DE APLICATIVOS GRÁFICOS.

Page 20: FLTK Summer Course - Part I - First Impact

20 de 55IDE´S E EDITORES

IDE´S

EditoresO problema com IDE´s algumas vezes está localizado em seus editores que por sua vez pecam por falta de funcionalidades específicas. Por isso alguns programadores preferem usar editores robustos. Abaixo segue uma lista :

VIM [http://vim.sourceforge.net/] – Linux – Unix - WindowsNOTEPAD++ [http://notepad-plus.sourceforge.net/] - Win32 only

Quando programamos em C++ o uso de uma IDE facilita consideravelmente o trabalho. Abaixo segue uma pequena lista :

GEANY [http://www.geany.org/] – Cross-Plataform

DevC++ [http://www.bloodshed.net/devcpp.html ] – Win32 e LinuxKDevelop [http://www.kdevelop.org/] – Linux/UnixAnjuta [http://anjuta.sourceforge.net/] – Linux/Unix

Microsoft Visual C++, Borland C++ Builder, Eclipse, CodeBlocks, NetBeans, etc.

Emacs, EditPlus, UltraEdit, Scite, Gedit, Kate, Nedit, etc.

Page 21: FLTK Summer Course - Part I - First Impact

21 de 55

IDE´s

IDE´S

Page 22: FLTK Summer Course - Part I - First Impact

22 de 55

DevC++

DEVC++

Homepage : http://www.bloodshed.net/

Linguagens : C, C++

Características :

- Leve, rápido e sem ostentação, recomendado para iniciantes ...- Frontend para o “Minimalist GNU for Windows” [MinGW]- Pode ser usado com Cygwin - Criação de executáveis Win32 nativos [console, GUI, Dll´s, OpenGL]- Gerenciador de pacotes integrado - Repositório on-line em www.devpaks.org

Page 23: FLTK Summer Course - Part I - First Impact

23 de 55DEVC++

 [DevC++ - um frontend leve para o MinGW]

Page 24: FLTK Summer Course - Part I - First Impact

24 de 55

KDevelop

KDEVELOP

Homepage : http://www.kdevelop.org/

Linguagens : Python, PHP, JavaScript, Perl, HTML, C, C++, ...

Características [KDevelop] :

- Ferramenta RAD, Frontend para o GCC, GDB, controle de versões- Editor de códigos fontes (Kate)

Características [QtDesigner] :

- Ferramenta RAD, Integração com o MS Visual Studio, Kdevelop- Interface amigável

Page 25: FLTK Summer Course - Part I - First Impact

25 de 55KDEVELOP

 [KDevelop - visão do code completion da ferramenta em ação]

Page 26: FLTK Summer Course - Part I - First Impact

26 de 55KDEVELOP + QTDESIGNER

 [QtDesigner - ferramenta para construção e diagramação de interfaces gráficas baseadas no pacote Qt]

Page 27: FLTK Summer Course - Part I - First Impact

27 de 55

Anjuta

ANJUTA

Homepage : http://anjuta.sourceforge.net

Linguagens : C, C++, C#, Java, Python, ...

Características [Anjuta] :

- Interface amigável, Plugins, Debugger (gdb, valgrid)- Integração com Glade, Ótima edição de códigos fontes - Dependência do GNOME e UNIX/Linux

Características [Glade] :

- Ferramenta RAD para desenvolvimento de interfaces gráficas para GTK+ toolkit e GNOME, Multiplataforma

Page 28: FLTK Summer Course - Part I - First Impact

28 de 55ANJUTA

 [Anjuta – editor de código da ferramenta anjuta]

Page 29: FLTK Summer Course - Part I - First Impact

29 de 55ANJUTA + GLADE

 [Anjuta – Uso do Glade - ferramenta para construção e diagramação de interfaces gráficas]

Page 30: FLTK Summer Course - Part I - First Impact

30 de 55

Microsoft Visual C++

MICROSOFT VISUAL C++

Homepage : http://go.microsoft.com/fwlink/?LinkId=47810&clcid=409

Linguagens : C, C++

Características :

- Parte integrante do pacote Microsoft Visual Studio- Ambiente de desenvolvimento de aplicações padrão da Microsoft- Vasta gama de bibliotecas e pacotes de desenvolvimento - Desenvolvimento GUI usando a Windows API, a MFC ou Windows Forms- Arquivos de ajuda densos e bem documentados [MSDN]

Page 31: FLTK Summer Course - Part I - First Impact

31 de 55MICROSOFT VISUAL C++

 [MS Visual C++ - editor de código do pacote Microsoft Visual Studio]

Page 32: FLTK Summer Course - Part I - First Impact

32 de 55

Borland C++ Builder

BORLANDO C++ BUILDER

Homepage : http://www.borland.com/

Linguagens : C, C++

Características :

- Ambiente visual para o desenvolvimento de aplicativos.- Criação de aplicativos C++ para Windows [e Linux a partir da versão 6]- A construção das interfaces gráficas é feita com a filosofia WYSIWYG- Paradigma baseado na organização dos componentes de software em objetos- A VCL é a biblioteca de classes do C++ Builder [componentes visuais e não-visuais]- CLX para desenvolvimento de aplicações cross-plataform.

Page 33: FLTK Summer Course - Part I - First Impact

33 de 55BORLANDO C++ BUILDER

 [Borland C++ Builder – editor de código, paleta de componentes e construtor de interfaces WYSIWYG]

Page 34: FLTK Summer Course - Part I - First Impact

34 de 55

Eclipse

ECLIPSE

Homepage : http://www.eclipse.org/

Linguagens : C, C++, Java, PHP, UML, ...

Características :

- Altamente utlizado pela comunidade- Investimento inicial de 40 milhões pela IBM- Controle de versões, plugins disponíveis para diversas linguagens- Multiplataforma

Page 35: FLTK Summer Course - Part I - First Impact

35 de 55ECLIPSE

 [Eclipse Ganymede – editor de código e plugin CDT para desenvolvimento em C/C++]

Page 36: FLTK Summer Course - Part I - First Impact

36 de 55

CodeBlocks

CODEBLOCKS

Homepage : http://www.codeblocks.org

Linguagens : C, C++

Características :

- Open Source- Suporta vários compiladores [GCC, Visual C++ Toolkit, Borland C++, Intel C/C++, Watcom,etc]- Construído a partir do toolkit WxWidgets- Multiplataforma

Page 37: FLTK Summer Course - Part I - First Impact

37 de 55CODEBLOCKS

 [CodeBlocks – ferramenta construída com os componentes WxWidgets]

Page 38: FLTK Summer Course - Part I - First Impact

38 de 55

NetBeans

NETBEANS

Homepage : http://www.netbeans.org/

Linguagens : C, C++, Java, Python, UML, Ruby, Linguagens de script, ....

Características :

- Ferramenta RAD, Plugins, Multiplataforma

Page 39: FLTK Summer Course - Part I - First Impact

39 de 55NETBEANS

 [NetBeans – versão para desenvolvimento em C/C++]

Page 40: FLTK Summer Course - Part I - First Impact

40 de 55

Editores

EDITORES

Page 41: FLTK Summer Course - Part I - First Impact

41 de 55VIM

Vi IMproved

 [VIM – poderoso editor para manipulação de arquivos em modo texto]

Page 42: FLTK Summer Course - Part I - First Impact

42 de 55NOTEPAD++

Notepad++

 [Notepad++ – editor sendo usado no modo C/C++]

Page 43: FLTK Summer Course - Part I - First Impact

43 de 55GEANY

Geany

 [Geany – editor cross-plataform feito em GTK]

Page 44: FLTK Summer Course - Part I - First Impact

44 de 55

Finalmente FLTK

UM PASSEIO RÁPIDO PELO FAST LIGHT TOOLKIT

Page 45: FLTK Summer Course - Part I - First Impact

45 de 55O QUE É FLTK ?

The Fast Light ToolKit

O FLTK (sigla de Fast Light ToolKit), pronunciado como "fulltick", é um kit de desenvolvimento de interfaces gráficas para a linguagem C++, disponível para diversos sistemas operacionais (GNU/Linux – através do sistema gráfico X11, M$ Windows®, Mac OS X, OS/2 e Solaris).

Suporta gráficos 3D via OpenGL®, bem como provê emulação à biblioteca GLUT.

Fornece um rico conjunto de componentes gráficos porém, visando se manter sempre enxuto e modular, prezando pela eficiência sem ostentação.

Software Livre distribuído sob a licença LGPL (GNU Library General Public License).

Possui uma ferramenta chamada FLUID, que permite de maneira fácil e visual a construção de todo o esqueleto de uma interface gráfica.

Page 46: FLTK Summer Course - Part I - First Impact

46 de 55

Hierarquia de objetos do pacote FLTK

HIERARQUIA DAS CLASSES DO PACOTE FLTK

Page 47: FLTK Summer Course - Part I - First Impact

47 de 55FLUID - FLTK USER INTERFACE DESIGNER/FAST LIGHT USER INTERFACE DESIGNER

FLUID

O FLUID (sigla de FLTK User Interface Designer) é um editor visual de interfaces gráficas, uma ferramenta integrante do pacote FLTK, responsável pela geração automática do código fonte (na linguagem C++) da interface gráfica construída.

Page 48: FLTK Summer Course - Part I - First Impact

48 de 55SUPORTE A GRÁFICOS 3D VIA OPENGL E A KITS COMO O GLUT

Suporte a OpenGL®

Page 49: FLTK Summer Course - Part I - First Impact

49 de 55UM “HELLO WORLD !” EM FLTK

Um “Hello World !” em FLTK

Observe como é fácil e rápido construir um simples “Hello World !” usando FLTK, apenas 3 linhas !

Page 50: FLTK Summer Course - Part I - First Impact

50 de 55UM “HELLO WORLD !” USANDO O CONCEITO DE ORIENTAÇÃO A OBJETOS

Um “Hello World !” usando Orientação a Objetos

Usando o conceito de “Programação Orientada a Objetos” tudo se torna ainda mais fácil pois podemos compor ou estender os nossos próprios objetos a partir das classes nativas do pacote FLTK.

Page 51: FLTK Summer Course - Part I - First Impact

51 de 55OBTENDO E COMPILANDO OS FONTES DO FLTK

Obtenha os fontes do pacote FLTK através da URL www.fltk.org [escolha a versão mais estável, atualmente é a série 1.1.x]

Download

Usando Unix/Linux [com o pacote gcc]

Compile e instale o pacote com os seguintes comandos:

#tar –xzvf fltk-1.1.x-source.tar.gz#cd fltk-1.1.x#./configure#make #make install

Usando a Família M$ Windows®

Podem ser usadas as diversas opções de projeto e makefiles que acompanham o pacote FLTK [projetos para M$ Visual C++, C++ Builder, DevC++, entre outros], ou simplesmente o uso do MSys + MinGW.

Observação

Você deve ter privilégios de super-usuário ou as permissões adequadas para instalação desse pacote.

Page 52: FLTK Summer Course - Part I - First Impact

52 de 55COMPILANDO O PRIMEIRO PROGRAMA

Usando a Família M$ Windows®

Usando Unix/Linux [com o pacote gcc]

Se o arquivo hello.cxx depende das bibliotecas FLTK poderemos compilá-lo com o seguinte comando :

g++ hello.cxx -o hello -I/path/to/fltk/includes -L/path/to/fltk/libs -lfltk -lXext -lX11 –lm

ou

fltk-config --compile hello.cxx

Com o auxílio de IDE´s como o M$ Visual C++ ou Borland C++ Builder nos parâmetros de vinculação/“linkagem” acrescente as bibliotecas uuid.lib, ole32.lib, comctl32.lib, wsock32.lib.

Com o auxílio de IDE´s como o DevC++, Geany, Eclipse, NetBeans (entre outras) [e o pacote MinGW] devemos executar a vinculação com as seguintes bibliotecas: -lfltk –luuid -lole32 –lcomctl32 –lwsock32

Observação

Verifique se os pacotes libxext-dev e libx11-dev foram previamente instalados !

Page 53: FLTK Summer Course - Part I - First Impact

53 de 55DÚVIDAS ?

Dúvidas ?

Page 54: FLTK Summer Course - Part I - First Impact

54 de 55PENSAMENTO DO DIA !

Provérbio japonês

“Não adianta ir para o rio apenas com a intenção de pescar, deve-se sobretudo carregar consigo a isca e o anzol ...”

Page 55: FLTK Summer Course - Part I - First Impact

55 de 55FIM !!!