A linguagem de programação Python permite a adoção de várias bibliotecas e frameworks para desenvolver interfaces gráficas. Alguns são Tinker, Wxwidget e QT, plataforma na qual vimos os tutoriais:
- Aplicativos de plataforma cruzada com Python, PyQT e QT Desginer 5
- Aplicações com Sqlite Database, PyQT e QT Desginer.
Neste tutorial, veremos como desenvolver interfaces gráficas com WxWidget e a ferramenta de design wxFormBuilder. wxFormBuilder é um aplicativo para o design de interfaces gráficas de usuário, é gratuito e open source permite o uso das bibliotecas wxWidgets, é amplamente utilizado para o desenvolvimento de aplicativos multiplataforma.
wxFormBuilder é uma ferramenta de desenvolvimento visual, a grande vantagem é que pode gerar código em C ++, Python, PHP, Lua e XRC enquanto está sendo projetado. Funciona em Windows, Linux e Mac Os.
Para este tutorial faremos uma instalação no Linux e em uma máquina virtual com VirtualBox e Windows 7, a fim de provar que podemos desenvolver o aplicativo multiplataforma, da mesma forma que poderíamos instalar no Linux e ter uma máquina virtual com Linux.
Precisamos instalar as seguintes ferramentas:
PitãoÉ uma linguagem de programação de alto nível, o principal objetivo do python é facilitar a legibilidade do código e permitir que os programadores desenvolvam aplicativos em menos linhas de código em comparação com linguagens de programação como C ++, C # ou Java.
Uma das vantagens do Python é que ele suporta múltiplos paradigmas de programação, como programação orientada a objetos, imperativa e funcional ou procedural. Podemos baixar Python do site oficial.
wxPythonÉ multiplataforma, pode ser executado em Windows, Linux e Mac OS sem modificações. O resultado do design da interface é uma aparência nativa do aplicativo, dependendo do sistema operacional em execução.
É um conjunto de bibliotecas que permite que a biblioteca gráfica wxWidgets seja portada e usada usando a linguagem de programação Python. A biblioteca wxWidgets é caracterizada por ser multiplataforma.
Ele pode ser baixado do site oficial do WxPython, em Linux ele vem nos repositórios ou pode ser adicionado
wxFormBuilderÉ um IDE gratuito, multiplataforma e de código aberto. É utilizado para projetar interfaces gráficas GUI wxWidgets ou neste caso wxPython, permite a criação de aplicações multiplataforma. Como o Qt Designer, a ferramenta wxFormBuilder é usada para desenvolvimento visual.
wxFormbuilder permite gerar código em C ++, Python, PHP, Lua e código XRC. O código é criado conforme projetamos.
Podemos baixá-lo de seu site oficial, devemos instalar uma versão superior a 3.4 que seja a que suporte todos os idiomas mencionados acima.
Exemplos de aplicativos com wxPython e wxFormBuilder
Neste tutorial iremos desenvolver o aplicativo no Linux e depois também executá-lo no Windows. No Linux, o python já está instalado, então vamos instalar wxPython e wxFormbuilder, a partir de uma janela de terminal, escrevemos o seguinte comando:
sudo add-apt-repository -y ppa: wxformbuilder / wxwidgets sudo apt-get update sudo apt-get install libwxgtk3.0-0 libwxgtk-media3.0-0 sudo add-apt-repository -y ppa: wxformbuilder / release sudo apt -get update sudo apt-get install wxformbuilderEm seguida, devemos adicionar wxpython como uma variável de ambiente para poder usá-lo a partir de qualquer diretório:
export PYTHONPATH = "$ PYTHONPATH": / usr / lib / python2.7 / dist-packages / wx-2.8-gtk2-unicode /Em seguida, abrimos wxFormbuilder no menu principal:
wxFormBuilder apresenta um desktop com uma coluna à esquerda onde o projeto ou tela e os componentes que estamos usando estarão localizados, no centro a guia de design e uma guia para cada idioma, à direita teremos as propriedades do projeto e do componentes que usamos.
A primeira coisa que teremos que configurar será o projeto, para isso clicamos no nome do projeto e depois vamos às propriedades onde atribuiremos um nome e a linguagem que utilizaremos.
Em seguida, vamos para a guia Formulário e adicionamos um formulário que será o contêiner da tela.
Então, a partir das propriedades, podemos modificar o nome do formulário ao qual atribuímos MyForm e o título que será Exemplo01- TutorialAlém disso, podemos modificar muitas opções, como a cor de fundo, o tamanho, o tipo de janela e muito mais.
Podemos ir para a guia Python e ver como o código está sendo gerado.
Para gerar o código em um arquivo, devemos primeiro salvar o projeto do menu Arquivo> Salvar como, e o salvamos como example01.fbp
Em seguida, vamos para a opção do menu Arquivo> Gerar código, então vamos para o diretório onde salvamos o arquivo do projeto e veremos o arquivo noname.py
Este arquivo noname.py contém o código Python gerado com o design da interface, podemos renomear o arquivo para example01.py
A seguir devemos adicionar o código para que este desenho seja mostrado quando a aplicação for executada, para isso abrimos o arquivo e adicionamos o seguinte código abaixo, permanecendo da seguinte forma:
import wx import wx.xrc class MyForm (wx.Frame): def __init __ (self, parent): wx.Frame .__ init__ (self, parent, id = wx.ID_ANY, title = u "Example01 - Tutorial", pos = wx .DefaultPosition, size = wx.Size (500,300), style = wx.DEFAULT_FRAME_STYLE | wx.TAB_TRAVERSAL) self.SetSizeHintsSz (wx.DefaultSize, wx.DefaultSize) self.Centre (wx.BOTH) def __del_ (self) _ : Passe # Código de design do fim do formulário ## Código que mostra o aplicativo ao executar app = wx.App (False) frame = MyForm (Nenhum) frame.Show (True) app.MainLoop ()Em seguida, de uma janela de terminal, vamos para o diretório do aplicativo e executamos python example01.py
Em seguida, vamos para wxFormbuilder e começamos a projetar a tela. Os componentes são distribuídos na tela usando Layout e grades, neste caso vamos selecionar um wxBoxSizer vertical, o que ele faz é dividir a tela em três fileiras, onde adicionaremos os componentes.
Em seguida, adicionaremos um menu, para isso vamos para a guia Menu / Barra de ferramentas, primeiro adicionaremos o componente MenuBar que será o menu principal. Em seguida, adicionaremos hierarquicamente um Menutitem aberto, um separador e outro Menuitem com o nome Exit.
Podemos ver que os objetos estão dispostos de acordo com uma hierarquia onde o mais alto engloba o mais baixo, podemos trocar de posição apenas arrastando. Então iremos para a aba Dados e vamos adicionar um controle wxGrid Para mostrar uma grade de dados, para eles nos colocamos no Layout para que o próximo controle fique localizado abaixo do menu.
Geramos o novo código e o arquivo será modificado noname.py, podemos renomeá-lo como example02.py, adicionando as alterações feitas. Em seguida, executamos a partir de uma janela de terminal usando o comando:
python example02.py
Agora vamos wxFormbuilder e vamos adicionar uma barra separadora abaixo da grade, do Aba comum e selecione o componente wxStaticLine.
A seguir criaremos campos para fazer um detalhe mestre, para isso nos colocaremos no Layout e adicionaremos um componente.
Além de desenhar interfaces gráficas podemos adicionar eventos, por exemplo clicamos no botão gravar e vamos para a aba Eventos, procuramos o tipo de evento, neste caso OnLeftDown, clique com o botão esquerdo do mouse pressionado.
Neste caso escrevemos o nome da função que irá invocar o evento, ao gerar o código ela apenas criará a função para nós, então teremos que escrever o código com a funcionalidade. Quando tivermos gerado o arquivo, adicionaremos o seguinte código completo ao final:
import wx import wx.xrc import wx.grid ######################################## ############################################### Class MyFrame1 ############ ############################################################### ############# class MyForm (wx.Frame): def __init __ (self, parent): wx.Frame .__ init__ (self, parent, id = wx.ID_ANY, title = wx. EmptyString, pos = wx.DefaultPosition, size = wx.Size (417.350), style = wx.DEFAULT_FRAME_STYLE | wx.TAB_TRAVERSAL) self.SetSizeHintsSz (wx.DefaultSize, wx.DefaultSize) bSizerVER1 = wx.Box). m_grid1 = wx.grid.Grid (self, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, 0) # Grid self.m_grid1.CreateGrid (4, 4) self.m_grid1.EnableEditing (True) self.m_grid1.EnableGridLines ( True) self.m_grid1.EnableDragGridSize (False) self.m_grid1.SetMargins (0, 0) # Columns self.m_grid1.EnableDragColMove (False) self.m_grid1.EnableDragColSize (True) self.m_grid1.SetCabel1. SetColLabel.mSize (.SetColLabelAlignment (wx.ALIGN_CENTRE, wx.ALIGN_CENTRE) # Rows self.m_grid1.EnableDragRowSize (True) self.m_grid1.SetRowLabelSize (80) self.m_grid1.SetRowLabelAlignment (wx.ALIGN_CENTRE, wx.ALIGN_CENTRE) # Label Appearance # Cell Defaults self.m_grid wefault1.SetLIGN1 / wefaultC .SetLignment_OPELL, w / w Padrões com wm_grid1.SetLIGNDefaultCell_FT) bSizer1.Add (self.m_grid1, 0, wx.ALL, 5) self.m_staticline4 = wx.StaticLine (self, wx.ID_ANY.DefaultSize, wx.DefaultSize, wx.DefaultSize, , wx.LI_HORIZONTAL) bSizer1.Add (self.m_staticline4, 0, wx.EXPAND | wx.ALL, 5) fgSizer1 = wx.FlexGridSizer (0, 4, 0, 0) fgSizer1.SetFlexibleDirection (wx.BOTH) fgMonodelexible.SetN (wx.FLEX_GROWMODE1_SPECIFIED) selfText.SelfText. (self, wx.ID_ANY, u "Product", wx.DefaultPosition, wx.DefaultSize, 0) self.m_staticText1.Wrap (-1) fgSizer1.Add (self.m_staticText1, 0 wx.ALL | wx.ALIGN_CENTER_VERTICAL, 5) self.m_textCtrl1 = wx.TextCtrl (self, wx.ID_ANY, wx.EmptyString, wx.DefaultPosition, wx.DefaultSize, 0) fgSizer1.Add (self.m_textCtrl1, 1, wx. ALL | wx.EXPAND, 5) self .m_staticText2 = w x.StaticText (self, wx.ID_ANY, u "Code", wx.DefaultPosition, wx.DefaultSize, 0) self.m_staticText2.Wrap (-1) fgSizer1.Add (self.m_staticText2, 0, wx.ALL | wx. ALIGN_CENTER_VERTICAL, 5) self.m_textCtrl2 = wx.TextCtrl (self, wx.ID_ANY, wx.EmptyString, wx.DefaultPosition, wx.DefaultSize, 0) fgSizer1.Add (self.m_textCtrl2, 1, wx.EXPAND | wx.EXPAND | wx.ALLPAND | wx.ALIGN_BOTTOM, 5) self.m_staticText3 = wx.StaticText (self, wx.ID_ANY, u "Category", wx.DefaultPosition, wx.DefaultSize, 0) self.m_staticText3.Wrap (-1) fgSizer1. Adicionar (self. M_staticText3, 0, wx.ALL | wx.ALIGN_CENTER_VERTICAL, 5) m_comboBox1Choices = [] self.m_comboBox1 = wx.ComboBox (self, wx.ID_ANY, u "Select", wx.DefaultPosition, wx.DefaultSize1, m_comboBox1 ) .Add (self.m_comboBox1, 0, wx.ALL, 5) self.m_staticText4 = wx.StaticText (self, wx.ID_ANY, u "Data de entrada", wx.DefaultPosition, wx.DefaultSize, 0) self.m_staticText4 . Wrap (-1) fgSizer1.Add (self.m_staticText4, 0, wx.ALL | wx.ALIGN_CENTER_HORIZONTAL | wx.ALIGN_CENTE R_VERTICAL, 5) self.m_datePicker1 = wx.DatePickerCtrl (self, wx.ID_ANY, wx.DefaultDateTime, wx.DefaultPosition, wx.DefaultSize, wx.DP_DEFAULT) fgSizer1.Add (self.m_datex. WickerALL1, 1, wx.DefaultPosition, wx.DefaultSize, wx.DP_DEFAULT) fgSizer1.Add (self.m_datex. WickerALL1, 1. EXPAND, 5) bSizer1.Add (fgSizer1, 1, wx.EXPAND | wx.ALL, 5) self.m_staticline3 = wx.StaticLine (self, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.LI_HORIZONTAL) bSizer1. Adicionar (self.m_staticline3, 0, wx.EXPAND | wx.ALL, 5) bSizer2 = wx.BoxSizer (wx.HORIZONTAL) bSizer2.AddSpacer ((0, 0), 1, wx.EXPAND, 5) self.m_button4 = wx.Button (self, wx.ID_ANY, u "Burn", wx.DefaultPosition, wx.DefaultSize, 0) bSizer2.Add (self.m_button4, 0, wx.ALL, 5) self.m_button5 = wx.Button (self , wx.ID_ANY, u "Delete", wx.DefaultPosition, wx.DefaultSize, 0) bSizer2.Add (self.m_button5, 0, wx.ALL, 5) bSizer1.Add (bSizer2, 1, wx.EXPAND | wx. ALL, 5) self.SetSizer (bSizer1) self.Layout () self.m_menubar1 = wx.MenuBar (0) self.m_menu1 = wx.Menu () self.m_menuItem1 = wx.MenuItem (self.m_menu1, wx.ID_ANY, u "Abrir", wx .EmptyString, wx.ITEM_NORMAL) self.m_menu1.AppendItem (self.m_menuItem1) self.m_menu1.AppendSeparator () self.m_menuItem3 = wx.MenuItem (self.m_menu1, wx.IDStrty, u "Sair". Vazio .ITEM_NORMAL) self.m_menu1.AppendItem (self.m_menuItem3) self.m_menubar1.Append (self.m_menu1, ou "Arquivos") self.SetMenuBar (self.m_menubar1) self.Centre (wx.BOTH) # clique no evento que invoca o registro de função self.m_button4.Bind (wx.EVT_LEFT_DOWN, self.Record) def __del __ (self): pass # cria uma mensagem personalizada ou caixa de diálogo def Message (self, msg, title, style): dlg = wx.MessageDialog ( parent = None, message = msg, caption = title, style = style) dlg.ShowModal () dlg.Destroy () # Função de registro que responde ao evento click def Record (self, event): self.Message ("Isto é a click! event "," Information - Tutorial ", wx.OK | wx.ICON_INFORMATION) app = wx.App (False) frame = MyForm (None) frame.Show (True) app.MainLoop ()
A seguir, vamos testar o mesmo aplicativo em uma instalação do Windows 7 com Python e wxpython instalados anteriormente e o resultado é o seguinte:
Quando terminarmos nosso desenvolvimento completo, o aplicativo pode ser distribuído usando um software como o InnoSetup como vimos nos tutoriais:
- Crie instaladores com o Inno Setup
- Instalador personalizado para distribuir nosso software.
wxFormBuilder é um ambiente visual que nos permite gerar código Python com a plataforma wxPython, outra alternativa para desenvolver interfaces gráficas para Python ficará a critério do usuário usar PyQt ou wxPython.
Uma das grandes vantagens do wxFormBuilder é que ele contém muitos componentes e widgets, altamente personalizáveis ainda mais do que em outros ambientes mais populares. Podemos ver os resultados à medida que criamos os aplicativos, portanto, podemos ter diferentes versões da interface gráfica e do código que adicionamos. Ao contrário do Qt Designer, wxFormBuilder permite gerar eventos e então invocar uma determinada funcionalidade.
.
