eepp é uma estrutura de desenvolvimento de jogos e aplicativos de plataforma cruzada de código aberto fortemente focada no desenvolvimento de interfaces gráficas de usuário ricas.
Suporte oficial para Linux, Windows, macOS, Android e iOS.
Exporta para HTML5 usando emscripten com algumas pequenas limitações.
Também funciona em BSD e Haiku.
Widgets básicos para gerenciar os objetos do aplicativo/jogo como nós, com todos os eventos básicos de interação de entrada (cliques, pressionamento de tecla, passagem do mouse, foco, etc.).
Sistema de UI completo, suporte para animação, dimensionamento, rotação, recorte, eventos, mensagens, etc.
Suporte a temas e skins/decorações.
Suporte à densidade de pixels (escalonamento dos elementos da UI definidos pela densidade de pixels da tela).
Todos os widgets básicos são implementados (botão, caixa de texto, caixa de combinação, caixa de entrada, menu, caixa de listagem, barras de rolagem, etc).
Suporte para invalidação de desenho. Ele pode ser usado para fazer aplicativos reais, com baixo uso de recursos (só redesenha quando necessário).
Sistema de layout semelhante aos layouts do Android (LinearLayout, RelativeLayout, GridLayout).
Recursos avançados como seleção de texto, copiar e colar e atalhos de teclado.
Carregar e estilizar layouts de XMLs
Estilizando com folhas de estilo em cascata
Renderizadores para OpenGL 2 (pipeline fixo), OpenGL 3 (pipeline programável), OpenGL ES 2, OpenGL ES 1 e OpenGL Core Profile.
Renderizador em lote (toda a renderização é automaticamente agrupada em lote pelo mecanismo).
Suporte a fontes (fontes TrueType, BMFont e XNA).
Suporte para buffer de quadros.
Suporte a shaders (com shaders de pipeline fixos automáticos para conversor programável).
Suporte ao objeto Vertex Buffer.
Sistema de Partículas.
Console extensível.
Sprites animados.
Suporte para Texture Atlas (criação e atualização automática do atlas de textura, editor incluído).
Máscaras de recorte (estêncil, tesoura, aviões)
Suporte a bitmaps redimensionáveis de nove patches.
Drawables primitivos.
Muitos formatos de imagem suportados (incluindo SVG rasterizado), suporte a texturas compactadas (upload direto para a GPU quando possível).
Módulo baseado em backend, isso significa que você pode facilmente criar um backend para o tratamento de janelas/entradas.
Atualmente oferece suporte a SDL 2 como back-end.
Suporte para área de transferência.
Cursores de hardware.
Gerenciador de exibição
Suporte para joystick.
Fornece todos os itens básicos para suporte completo a multi-threading da biblioteca, suporte a formatos de arquivo para empacotamento, relógios, gerenciador de recursos, tradutor e muito mais.
Classe Virtual File System (provedores de ativos abstratos em um único sistema de arquivos virtual, abstraindo arquivos zip e sistema de arquivos local em um para carregamento transparente de recursos, semelhante ao PhysicsFS).
Gerenciador de memória personalizável. Usado por padrão no modo de depuração para rastrear vazamentos de memória.
Suporte a UTF8, UTF-16, UTF-32, Ansi, Wide Char.
Classe String usando caracteres UTF-32 internamente.
Macros de depuração
Funções e modelos de uso geral (vetor, quad, polígono, etc).
Aulas de interpolação com atenuação.
Alguns utilitários matemáticos menores incluem implementação de gerador de números aleatórios Mersenne Twister, ruído perlin e muito mais.
Solicitações Web com cliente HTTP, com suporte TLS (fornecido por mbedtls ou openssl).
Solicitações HTTP assíncronas.
Transferências de arquivos com cliente FTP e cliente FTPS (FTP com TLS explícito).
Soquetes TCP e UDP.
Suporte para codificação de conteúdo HTTP e codificação de transferência.
Suporte a proxy HTTP.
Suporte a resposta compactada HTTP.
Também suporte para retomar/continuar download HTTP e redirecionamentos automáticos.
Sistema baseado em nós para fácil gerenciamento de cenas.
Controle total dos eventos do nó (cliques, mouse over, foco, etc).
Sistema de eventos.
Sistema de mensagens do nó.
Ações programáveis para nós (desaparecer, girar, mover, dimensionar, etc).
Mapas lado a lado com luzes dinâmicas de software.
Editor de mapas completo.
Editor de UI muito simples. Carregue layouts de um arquivo XML e veja as alterações sendo feitas em tempo real.
Editor de Atlas de Textura. Uma ferramenta muito simples que permite ao desenvolvedor criar e editar atlas de texturas.
Editor de Mapas: Um editor de mapas avançado, mas simples, para o mecanismo de jogo. Faltam vários recursos já que não tive tempo para trabalhar nisso, esta ferramenta em particular provavelmente morrerá em favor do suporte ao mapa TMX em um futuro próximo (mas não sou fã de mapas TMX, então não há decisão para o momento).
A documentação está localizada aqui. Atualmente estou trabalhando para melhorá-lo. Cerca de 50% do projeto está atualmente documentado, então ainda precisa de muito trabalho. Por favor, verifique os exemplos de código localizados em src/examples
e você também pode verificar o teste ( src/test
) e as ferramentas ( src/tools
).
Estou me esforçando para melhorar a documentação do módulo UI, já que atualmente é o módulo mais importante e complexo, mas carece de documentação adequada. Se você tiver alguma dúvida, pode entrar em contato comigo a qualquer momento.
O repositório usa submódulos git, então você precisará clonar o repositório e seus submódulos. Para conseguir isso facilmente, você pode simplesmente clonar com:
git clone --recurse-submodules https://github.com/SpartanJ/eepp.git
ecode é um editor de código inspirado no Lite. Ele está usando o mais novo tema CSS puro baseado no tema escuro padrão do Plasma: Breeze Dark.
Editor que exibe em tempo real as alterações em qualquer layout e CSS para ajudar a agilizar o desenvolvimento de interfaces de usuário. Na captura de tela estão exibindo alguns dos widgets padrão disponíveis no eepp.
Pequena ferramenta, usada para criar e editar atlas de texturas.
Editor de mapas 2D usando o tema padrão (usando um único atlas de textura com imagens de 9 patches).
Deve parecer muito familiar para qualquer desenvolvedor Android. Esta é uma janela com os widgets mais básicos em uma exibição de layout linear vertical.
< window layout_width = " 300dp " layout_height = " 300dp " window-flags = " default|maximize|shadow " >
< LinearLayout id = " testlayout " orientation = " vertical " layout_width = " match_parent " layout_height = " match_parent " layout_margin = " 8dp " >
< TextView text = " Hello World! " gravity = " center " layout_gravity = " center_horizontal " layout_width = " match_parent " layout_height = " wrap_content " backgroundColor = " black " />
< PushButton text = " OK! " textSize = " 16dp " icon = " ok " gravity = " center " layout_gravity = " center_horizontal " layout_width = " match_parent " layout_height = " wrap_content " />
< Image src = " thecircle " layout_width = " match_parent " layout_height = " 32dp " flags = " clip " />
< Sprite src = " gn " />
< TextInput text = " test " layout_width = " match_parent " layout_height = " wrap_content " />
< DropDownList layout_width = " match_parent " layout_height = " wrap_content " selectedIndex = " 0 " >
< item >Test Item</ item >
< item >@string/test_item</ item >
</ DropDownList >
< ListBox layout_width = " match_parent " layout_height = " match_parent " layout_weight = " 1 " >
< item >Hello!</ item >
< item >World!</ item >
</ ListBox >
</ LinearLayout >
</ window >
A introdução da UI pode ser encontrada aqui .
Como fica com código real?
UITextView::New ()->setText( " Text on test 1 " )
->setCharacterSize( 12 )
->setLayoutMargin( Rect ( 10 , 10 , 10 , 10 ) )
->setLayoutSizePolicy( SizePolicy::MatchParent, SizePolicy::WrapContent )
->setParent( layout );
O estilo dos elementos pode ser feito com uma implementação personalizada de Cascading Style Sheets, as regras CSS2 mais comuns estão disponíveis, além de várias regras CSS3 (alguns exemplos: animações, transições, propriedades personalizadas, consultas de mídia, @font-face na regra, :elemento root) . Aqui está um pequeno exemplo de como o CSS se parece:
@font-face {
font-family : "OpenSans Regular" ;
src : url ( "https://raw.githubusercontent.com/SpartanJ/eepp/develop/bin/assets/fonts/OpenSans-Regular.ttf" );
}
@import url ( "assets/layouts/imported.css" ) screen and ( min-width : 800 px );
: root {
--font-color : black;
--background-input-color : rgba ( 255 , 255 , 255 , 0.7 );
--border-color : black;
--border-width : 1 dp ;
}
. screen TextView {
color : var ( --font-color );
}
. form {
background-image : @drawable /back;
background-repeat : no-repeat;
background-size : cover;
}
. form . form_inputs {
background-color : var ( --non-existent , var ( --background-input-color ));
margin-left : 100 dp ;
margin-right : 100 dp ;
padding-top : 72 dp ;
padding-left : 57 dp ;
padding-right : 57 dp ;
padding-bottom : 115 dp ;
}
. screen TextView . input ,
. screen TextInput . input {
font-family : AkzidenzGroteskBQ-Cnd;
layout-width : match_parent;
layout-height : 80 dp ;
border-color : var ( --border-color );
border-width : var ( --border-width );
color : var ( --font-color );
padding-left : 40 dp ;
padding-right : 40 dp ;
margin-bottom : 32 dp ;
skin : none;
hint-font-family : AkzidenzGroteskBQ-Cnd;
hint-font-size : 46 dp ;
hint-color : # 818285 ;
background-color : # FFFFFF00 ;
transition : all 0.125 s ;
}
. screen TextInput . input : focus {
background-color : # FFFFFF66 ;
border-color : # 796500 ;
}
. screen TextInput . input : hover {
background-color : # FFFFFF66 ;
}
@media screen and ( max-width : 1024 px ) {
. form . form_inputs {
background-color : red;
}
}
A especificação CSS completa pode ser encontrada na documentação: aqui.
Você também pode verificar a aparência de um tema CSS puro no eepp: aqui.
Como o eepp suporta emscripten, você pode dar uma olhada rápida em alguns dos exemplos, demonstrações e ferramentas que a biblioteca oferece atualmente. Esteja ciente de que você encontrará algumas diferenças com base nas limitações que o emscripten tem no momento (sem acesso ao sistema de arquivos, sem cursores personalizados, etc.) e também as demos não são otimizadas para tamanho e são maiores do que deveriam ser. Nota: Use um navegador moderno com bom suporte a WebGL e WASM (Chrome/ium 70+ ou Firefox 80+).
ecode - Editor de código
Editor de IU
UI Olá Mundo
Editor de Atlas de Textura
Editor de mapas
Exemplo de fontes
Demonstração do módulo de física
Exemplo de Sprite
Teste Completo
7GUIs é conhecido como "Benchmark de programação GUI" e é usado para comparar diferentes bibliotecas GUI e explorar cada abordagem de biblioteca para programação GUI. Todas as 7 tarefas propostas em 7GUIs foram implementadas para eepp. As tarefas representam muito bem o que pode ser alcançado com a GUI do eepp e também são muito úteis para demonstrar como implementar diferentes tarefas com a biblioteca.
As 7GUIs são compostas pelas seguintes tarefas:
Contador: Demonstração e implementação de código.
Conversor de temperatura: demonstração e implementação de código.
Flight Booker: Demonstração e implementação de código.
Cronômetro: Demonstração e implementação de código.
CRUD: Demonstração e implementação de código.
Circle Drawer: Demonstração e implementação de código.
Células: Demonstração e implementação de código.
A biblioteca possui apenas uma dependência externa. Você só precisará da biblioteca SDL2 com os cabeçalhos instalados. Também premake5 ou premake4 é necessário para gerar os Makefiles ou arquivos de projeto para construir a biblioteca. Presumirei que você sabe o que está fazendo e pularei o básico.
Aviso: eepp usa mojoAL por padrão como um substituto imediato do OpenAL. OpenAL está opcionalmente disponível como backend de áudio. Se quiser usá-lo, você tem a alternativa de habilitá-lo. Para habilitá-lo e desabilitar a substituição drop-in do mojoAL, você precisa adicionar o parâmetro --without-mojoal
a qualquer chamada premake
(ex: premake5 --without-mojoal gmake2
).
Em um sistema Ubuntu seria algo como (você também precisará do gcc, mas ele será instalado de qualquer maneira):
sudo apt-get install premake5 libsdl2-2.0-0 libsdl2-dev libopenal1 libopenal-dev
Clone o repositório e execute no diretório raiz do repositório:
premake5 gmake2
ou se você tiver o premake4 instalado, você pode executar:
premake4 gmake
Depois é só construir a biblioteca:
make -C make/linux
É isso. Isso construirá todo o projeto.
Você tem duas opções: construir com Visual Studio ou com MinGW. Para poder construir o projeto com qualquer uma dessas opções primeiro você precisará gerar os arquivos do projeto com premake4 ou premake5. Então você precisará adicionar o arquivo binário a qualquer um dos caminhos executáveis definidos em PATH
(ou adicionar um, ou usá-lo a partir de um caminho local). Baixe arquivos do Visual Studio ou MinGW dependendo de suas necessidades.
Você precisará usar premake5 e executar:
premake5.exe --windows-vc-build vs2022
Então os arquivos do projeto devem ser encontrados em make/windows/
. Uma solução completa e todo o projeto estarão disponíveis. Depois de instalar tudo, você poderá criar a solução Visual Studio como qualquer outro projeto.
Usar o argumento de linha commnad --windows-vc-build
fará o download da dependência SDL2 automaticamente e adicionará os caminhos ao processo de construção para vincular a ele sem a necessidade de baixar manualmente qualquer dependência externa.
Em seguida, basta criar a solução no Visual Studio ou executar MSBuild
manualmente em um console:
"%MSBUILD_PATH%MSBuild.exe" .makewindowseepp.sln -m
Onde %MSBUILD_PATH%
é o caminho MSBuild.exe do Visual Studio, por exemplo, para VS2022 Community Edition, o caminho geralmente é:
C:Program FilesMicrosoft Visual Studio2022CommunityMSBuildCurrentBin
As compilações do Windows MinGW estão sendo produzidas e testadas com a distribuição w64devkit. Atualmente, o MSYS não é oficialmente suportado devido a alguns problemas encontrados no processo de construção (mas é possível compilar com algumas etapas extras).
Se você estiver usando w64devkit você terá que baixá-lo e extraí-lo, assumiremos que ele foi extraído em C:w64devkit
.
Execute C:w64devkitw64devkit.exe
como administrador ( right click
-> Run as administrator
).
Em seguida, vá para o diretório do repositório clonado eepp
e execute:
premake5.exe --windows-mingw-build gmake2
--windows-mingw-build
baixará e vinculará automaticamente dependências externas (SDL2).
Depois é só compilar o projeto localizado em make/windows/
com mingw32-make.exe
ou qualquer equivalente:
mingw32-make.exe -C make\windows config=release_x86_64
Para construir uma execução de depuração:
mingw32-make.exe -C make\windows config=debug_x86_64
E então certifique-se de copiar o arquivo SDL2.dll
localizado em src/thirdparty/SDL2-2.XX.X/x86_64-w64-mingw32/bin/SDL2.dll
para bin
. Se por algum motivo eepp.dll
(ou eepp-debug.dll
) não tiver sido copiado automaticamente, você poderá copiá-los de libs/windows/x86_64/
para bin
.
Você precisará dos binários pré-construídos e das bibliotecas de desenvolvimento do SDL2, o OpenAL está incluído no sistema operacional. Instale a estrutura SDL2 e você poderá construir o projeto.
Você tem duas opções para construir o projeto: com XCode ou com Makefiles . Para construir com qualquer uma das duas opções primeiro você também precisará construir os arquivos do projeto com premake4 ou premake5.
Gere o projeto:
premake5 --use-frameworks gmake2
E construa:
make -C make/macosx
Você pode usar o script projects/osx/make.sh
, que gera os Makefiles e constrói o projeto.
Correr:
premake5 --use-frameworks xcode4
E abra o projeto XCode gerado em make/macosx/
ou simplesmente construa a partir da linha de comando com:
xcodebuild -project make/macosx/project-name.xcodeproj
Há um projeto gradle em projects/android-project/
. Ele construirá a biblioteca com todas as dependências incluídas. Use o projeto de exemplo como base para seu projeto. Observe que há um arquivo de projeto eepp.mk
que cria a biblioteca. Esse arquivo pode ser usado em seus projetos.
O projeto fornece dois arquivos para construir a biblioteca e as demos. Você pode usar qualquer um deles dependendo de suas necessidades. Os arquivos estão localizados em projects/ios
:
Este script pode ser usado para gerar os projetos xcode e solução de todos os projetos incluídos no eepp (demos, ferramentas, biblioteca compartilhada, biblioteca estática, etc). Ele também baixará e construirá a biblioteca estática gorda SDL2 para poder referenciar a biblioteca para o projeto. Depois de construir os projetos, infelizmente você precisará fazer algumas pequenas alterações em qualquer/todos os projetos que você não deseja construir ou testar, já que o projeto gerado carece de algumas configurações menores. Depois de executar este script, você precisará abrir a solução localizada em make/ios/eepp.xcworkspace
. Para construir as bibliotecas estáticas você não encontrará nenhum problema (isso funcionará imediatamente). Mas para testar alguns dos exemplos é necessário:
Selecione (clique no nome do projeto) o projeto que deseja testar, por exemplo eepp-empty-window
. Você verá várias abas/opções, vá em Build Settings e localize a opção Info.plist file, clique duas vezes para editar e escreva: Info.plist
. Isso indicará a leitura daquele arquivo que está localizado no mesmo diretório do projeto. Vá até a aba Geral e preencha o Bundle Identifier com um nome identificador do app bundle que será gerado, para este exemplo você pode usar algo como: eepp-empty-window
. Isso permitirá que você construa e execute o projeto.
Esta demonstração eepp-empty-window
não usa nenhum ativo/recurso, mas outras demonstrações precisarão carregar ativos, e esses ativos precisam ser adicionados ao projeto para estarem disponíveis para o pacote de aplicativos. Por exemplo, o projeto eepp-ui-hello-world
exigirá que você adicione a pasta assets
ao projeto. O que você precisa fazer é: selecionar o projeto e ir até a aba Build Phases , em Copy Bundles Resources clicar no ícone de adição (+), depois ir em Add Other... e localizar e selecionar a pasta bin/assets/
e Terminar . Isso deveria ser suficiente.
Este script pode ser usado para construir o SDL2 e o eepp como duas bibliotecas estáticas gordas com arquiteturas arm64 e x86_64 (arm64 para iPhone/iPad e x86_64 para os simuladores). Para gerar uma compilação de versão, passe config=release
como parâmetro do script ( sh compile-all.sh config=release
). Os arquivos compilados estarão localizados em libs/ios/
, como libSDL2.a
e libeepp.a
(ou libeepp-debug.a
para compilação de depuração). Esses dois arquivos podem ser integrados ao seu projeto.
Primeiro você precisará baixar e instalar o emscripten. Depois, há um script para construir o projeto emscripten em projects/emscripten/make.sh
. Antes de executar este script, lembre-se de definir o ambiente emsdk, deve ser algo como: source /path/to/emsdk/emsdk_env.sh
. Isso deve ser suficiente no GNU/Linux ou macOS (testei isso apenas no GNU/Linux).
Todos os binários estão localizados no diretório bin
após a construção. Os binários requerem dois arquivos: a biblioteca eepp e a biblioteca SDL2. A biblioteca eepp estará localizada em libs/{OS}/
. O script de construção tentará vincular simbolicamente a biblioteca eepp em bin
; se isso falhar, deverá ser copiado ou vinculado manualmente. Em relação à biblioteca SDL2 não é fornecida no repositório, portanto, para executar as demonstrações você precisará baixar a versão e arquitetura corretas do sistema operacional da biblioteca SDL2.
A biblioteca vem sendo desenvolvida há vários anos, sofreu muitas alterações desde o seu início, estou fazendo as alterações que considero necessárias para melhorá-la, portanto a API ainda não está totalmente estável (mas perto de estar). Está sendo utilizado em diversas aplicações voltadas para campanhas publicitárias desenvolvidas principalmente para dispositivos Android e PCs com Windows.
Eu pessoalmente nunca tive tempo de usá-lo para desenvolver um jogo complexo com a biblioteca (vários projetos frustrados), mas fiz vários jogos orientados à UI para clientes.
O foco do projeto atual está no módulo UI. E continuarei trabalhando colocando meu foco nisso.
O plano é fornecer um kit de ferramentas de UI alternativo totalmente acelerado por hardware semelhante ao kit de ferramentas Android, mas mais simples (como fácil de usar) e também orientado para aplicativos de desktop.
Os módulos de Áudio e Rede foram baseados nos módulos em SFML com diversas diferenças importantes mencionadas acima.
Gosto de usar o que está bem feito e se adapta às minhas necessidades, mas como tenho minha opinião pessoal sobre como implementar algumas coisas prefiro pegar o código, para ter total controle sobre ele.
Também muitas ideias foram/são tiradas de outros projetos. Posso pensar em alguns: cocos2d-x , raylib , Android SDK , libGDX , Godot , XNA , LÖVE e muitos outros projetos.
Se tudo isso lhe parece interessante por algum motivo maluco, entre em contato comigo e me diga se posso ajudá-lo a entrar na biblioteca, e pode ser que, se quiser, você possa contribuir com isso no futuro. Este projeto precisa de colaboradores mais do que qualquer outra coisa.
O estado atual da biblioteca é decente. Em termos de recursos deve estar em uma posição semelhante aos motores de jogos 2D mais usados que existem. Mas é claro que falta o suporte + comunidade que você pode obter de Godot ou cocos2d-x, para mencionar alguns.
A ideia principal desta biblioteca é focar em uma abordagem geral melhor para desenvolver aplicativos e jogos fortemente baseados em UI do que as outras opções, com código e implementação mais limpos.
A principal razão pela qual desenvolvi a biblioteca é para me divertir e aprender novas tecnologias. Adoro passar tempo trabalhando na biblioteca, mas sei que provavelmente não há razão real para desenvolver algo assim com o imenso número de alternativas semelhantes.
Quanto à qualidade do código: este projeto começou há muito tempo e sofreu muitas modificações ao longo do tempo. Uma boa parte da base de código ainda usa práticas antigas de C++ (por exemplo: ponteiros brutos, implementação própria de thread, mutex, etc). Algumas dessas coisas podem ser “modernizadas”, mas outras não fazem muito sentido ou reformulá-las levaria muito tempo para justificar o esforço. Estou trabalhando na "modernização" de algumas partes do código, e o novo código geralmente tende a parecer mais moderno.
Continue melhorando o sistema UI, adicionando novos widgets e layouts e melhorando o suporte CSS.
Simplifique e melhore o suporte a skins/temas dos widgets da UI.
Melhorar/criar documentação para o módulo UI.
Adicione mais exemplos e algumas ferramentas.
Adicionei suporte a scripts, mas primeiro gostaria de estabilizar a biblioteca, mas estou chegando lá.
Adicione suporte a animações esqueléticas 2D (provavelmente Spine2D, não deve dar muito trabalho para implementar).
Provavelmente descontinuará o módulo Maps, já que concentrarei meus esforços no sistema de UI.
Sean Barrett por stb_image e todas as bibliotecas stb.
Sam Latinga para camada Simple DirectMedia.
Jonathan Dummer pela Biblioteca de Imagens Simple OpenGL.
Laurent Gomila para SFML
Yuri Kobets para LiteHTML
Michael RP Ragazzon para RmlUI
rxi para leve
Andreas Kling para SerenityOS
Ryan C. Gordon para mojoAL
David Reid para dr_libs
Lion (Lieff) para minimp3 e mais
Lewis Van Winkle para PlusCallback
Dieter Baron e Thomas Klausner pela libzip
Jean-loup Gailly e Mark Adler para zlib
Milan Ikits e Marcelo Magallon para GLEW
Mikko Mononen para nanosvg
Scott Lembcke por Chipmunk2D
Christophe Riccio para glm
Rich Geldreich para imageresampler e jpeg-compressor
Arseny Kapoulkine para pugixml
Jason Perkins para pré-fabricação
Martín Lucas Golini (eu) e todos os colaboradores do SOIL2 e efsw
A comunidade de código aberto Xiph para libogg e libvorbis
A comunidade ARMmbed para mbed TLS
kcat para openal-soft
O Projeto FreeType
E muito mais gente!
Licença MIT