Modificando Sprite_Screen e seus aspectos no Theme Editor
Dentro do Frontend Maximus Arcade estaremos trabalhando com o Theme Editor editor de temas do pacote básico do Maximus Arcade, este software é muito vasto porém pouco intuitivo mas muito funcional. Portanto acompanhe até o final estas informações e leia atentamente pois aqui abordarei de uma maneira simplificada e objetiva porém rica em exemplos para entendimento de todos.
Bem é comum quando vamos desenvolver nossos sistemas customizarmos os temas ao nosso gosto, mas sem as informações corretas podemos nos perder facilmente e nos frustrarmos rapidamente e enfim desistirmos de nossos projetos, bem aqui falarei de um destes problemas, em particular as propriedades da exibição de Screns, Snaps e Marquees, mais precisamente do arquivo Sprite_Screen responsável por exibir Screens (Fotos) e Snaps (Vídeos), a exibição de Marquees (Títulos) fica a cargo do arquivo Sprite_marquee.
1.0 Bem abrindo o Theme Editor siga para a área Game Interface (Interface de Jogos). Note que já modifiquei alguns atributos retirando o Sprite_Cabinet redimensionando e reposicionando
as Sprites Marquee, Border Screen, mas note que a Sprite_Screen está fora de enquadramento, na próxima etapa editaremos este aspecto. Veja Imagem Abaixo!
1.1 Siga para a barra de menus no topo vá em Sprite selecione SMS_Screen (SMS_Imagens) e utilize as várias ferramentas de edição e redimensionamento existentes. Veja Imagem Abaixo!
1.2 Reparem que aqui a imagem foi redimensionada e localizada adequadamente, atenção ao canto inferior direito da imagem grifado em azul campo "Border" (Bordas) existem três aspectos se não editá-los corretamente o software entende que é assim que serão apresentados ocasionando erros no layout final, estes são os três aspectos de imagem que a Game Interface pode ter são eles:
*Default: Ativada quando não é exibido imagem ou quando ela esta faltando.
*Landscape: Este é o aspecto exibido quando o jogo possui um preview imagem ou vídeo, seu formato é para exibir estes arquivos desde que estejam em widescreen 16:9 (resoluções retangulares) 640x360 por exemplo.
*Portrait: É o aspecto correspondente por abrigar imagens com aspectos Letter Box 4:3 (resoluções verticalizadas) 800x600 por exemplo. Veja Imagem Abaixo!
1.2 Menu Border |
1.3 Para uma boa customização é prioritário que edite os três aspectos anteriores redimensionado e enquadrando as imagens, porém o aspecto Portrait não apresenta opção de modificação de borda, mas no decorrer do tutorial ensinarei como modificá-lo este é uma deficiência do Theme Editor, mas aqui vocês saberão como contorná-la, bem então trabalhem nesta opção e deixe tudo bem editado. Veja imagem Abaixo!
1.4 Aqui vai uma dica abram um bloco de notas e ao editarem o aspecto "Default" copiem e colem os atributos dos campos
Location, Width, Height e Alpha se caso utilizar, após escolher o próximo aspecto é só colar o conteúdo do Bloco de Notas nos campos correspondentes, isso agiliza e muito as coisas. Veja Imagem Abaixo!
1.4 Anotando Escala e Posição das Bordas |
1.5 Neste momento tudo deve estar editado, retorne para o aspecto Default, e aqui vou trocar o Screen padrão deste console por um que editei para este tutorial façam isto indo em Property Inspector campo "File" ou clicando com o botão direito sobre o Sprite e selecionando o arquivo em Import..Troquei também o arquivo Sprite padrão do Marquee deste console, as outras Sprites modifiquem desta mesma forma ao seu gosto e formas. Veja as Imagem Abaixo!
Ajustes Finais no Theme Editor
2.0 Salve a Skin, a seguir alguns pontos que devem ser observados para melhor finalização de sua edição:
*1- Vá até Property Inspector, na aba Info onde existem opções de cunho autoral, como nome da Skin uma descrição para ela e sua versão, em Theme Previous eleja uma imagem para ser exibida como Thumbnail de sua Skin devendo ter (240x180), no campo Resolution Select marque somente as resoluções que editou, no caso (1280x720), isso impede que ele gere as outras resoluções que não editamos, evitando possíveis dores de cabeça no Frontend em execução!
*2- Siga para a barra de menus superior, em Edit selecione Save.
*3- Perceba que o Box de confirmação exibe somente a resolução que configuramos, faça desta forma e de "OK" para comprimir os arquivos em Skin. Veja Imagem Abaixo!
2.0 Atenção aos Ajustes Finais |
Abrindo o Preferences e Arquivos da Skin
3.0 Bem Abra o Preferences.exe e siga os passos listados abaixo:
*1- Em Interface escolha a Skin que criamos para isso ela deve estar localizada na pasta Skin do Frontend.
*2- Feito isso configure rotas e caminhos para suas roms, imagens, movies, marquees e emulador.
*3- Vá para Display Order e adicione o sistema em nosso caso Sega Master System, após isso feche o Preferences.exe e abra o Maximus Arcade.exe e aguarde o carregamento da Skin. Veja Imagem Abaixo!
3.0 Preferences Apontando Emulador e Tema |
Comparando os Modos de Bordas
4.0 Aqui está um comparativo dentro do Frontend em execução observe a diferença nos modos de Borda Portrait Aspect e Default Aspect. Veja Imagem Abaixo!
*1- Notem que em meu layout o Sprite Screen ficou em 4:3 ativando assim o arquivo "border_tall".
*2- Já no aspecto Default mesmo com Sprite_Screen em 4:3 ele exibe a "border_wide" pois como já foi dito este jogo não possui imagem no set, ativando então o modo "Default" que foi modificado nos passos anteriores.
*A seguir editaremos esta borda da imagem *1 como explicado esta é uma deficiência do Editor, pois lá não apresenta este Sprite na lista de edição, mas iremos modificá-lo, para que apresente a mesma borda nos três aspectos.
Corrigindo nosso Tema Manualmente
5.0 Após fechar o Frontend siga para pasta "cache" em seu interior são descomprimidos todos os arquivos da Skin vigente, uma vez na pasta procure pelos arquivos de "Bordas" como na imagem, respectivamente "border_tall" e "border_wide". Veja Imagem Abaixo!
5.0 Interior Pasta cache Maximus Arcade |
5.1 Duplique a "border_wide" simplesmente copiando e colando, neste momento não faça nada com a "border_tall". Veja Imagem Abaixo!
5.2 Atenção neste ponto, para não haver erros, abra um bloco de notas copie o nome do arquivo "border_tall" e sem alteração cole no bloco de notas, agora exclua ou delete o mesmo arquivo. Renomeie a "border_wide" que duplicamos no passo anterior, apenas colando o conteúdo do bloco de notas sobre ela para que fiquem idênticas ao da imagem. Veja Imagem Abaixo!
5.2 Copiando o nome da "border tall" |
5.3 A partir deste ponto é necessário possuir o WinRar em seu PC e siga os passos descritos:
*1- Selecione todo conteúdo da pasta "cache" (Ctrl+A).
*2- Direito do mouse escolha "Adicionar para o arquivo...".
*3- O WinRar vai se abrir renomeie o arquivo.
*4- Selecione compressão tipo ZIP
*5- Prefira método de compressão tipo ÓTIMO e clique em Ok. Veja Imagem Abaixo!
5.3 Recomprimindo nossa Skin |
5.4 Em meio aos outros arquivos será gerado um arquivo zipado, recorte (Ctrl+X) e cole na pasta "Skin" para ser lido pelo Preferences ele reconhecerá este arquivo como uma Skin normalmente. Veja Imagem Abaixo!
5.5 Agora abra o Preferences e selecione a Skin que acabamos de alterar, acompanhe a execução desta Skin e o resultado do tutorial no vídeo anexado nesta postagem Veja Imagem Abaixo!
5.5 Selecionado nossa nova Skin |
0 comentários:
Enviar um comentário