Añadiendo imágenes a nuestro homebrew de PS Vita

Ya es momento de hacer que nuestra aplicación sea un poco más gráfica, pero primero debemos conocer un poco la estructura y como están organizados los archivos de una aplicación para PS Vita.

Estructura de archivos de una aplicación

Supongamos que tenemos una carpeta con el nombre de nuestro homebrew (En este caso la llamaremos homebrew, XD), dentro tendremos la siguiente estructura:


homebrew
├── eboot.bin
├── resources
│   └── fondo.png
├── sce_sys
│   ├── icon0.png
│   ├── livearea
│   │   └── contents
│   │      ├── bg0.png
│   │      ├── frame_icon.png
│   │      ├── startup.png
│   │      └── template.xml
│   └── param.sfo
└── script.lua

eboot.bin: Es el archivo ejecutable para la consola.

resources: Es la carpeta donde ubicaremos nuestro contenido como el fondo y otros contenidos.

sce_sys: En esta carpeta van los contenidos del livearea de la PS Vita, es decir cosas como el icono o la imagen de fondo antes de abrir la aplicación. De momento no entraremos en detalle con el contenido de esta carpeta.

script.lua: Es el archivo que contiene nuestro código.

Imágenes

La verdad es que siempre uso imágenes en formato png y esta vez no sera la excepción, podemos escoger las imágenes que queramos buscando en internet o preferiblemente hacerlas uno mismo. personalmente uso programas como Inkscape, Pinta, GIMP, pero no entrare en detalle de como usarlos.

Estas serán las imágenes que le darán un nuevo toque a nuestra aplicación.

Código

Nuestro código cambiara con respecto al Primer programa en PS Vita, primero cargaremos todas nuestras imágenes, posteriormente dibujaremos y ubicaremos en pantalla para dar forma a nuestra aplicación.


if not files.exists("resources/") then
    os.message("No se encuentran archivos!")
end

color.loadpalette()
fondo = image.load("resources/fondo.png")

bateriasi = image.load("resources/bateria_existe.png")
bateriano = image.load("resources/bateria_no_existe.png")
bateriabaja = image.load("resources/bateriabaja.png")
cargando = image.load("resources/Cargando.png")

iconobateria20 = image.load("resources/bateria20.png")
iconobateria40 = image.load("resources/bateria40.png")
iconobateria60 = image.load("resources/bateria60.png")
iconobateria80 = image.load("resources/bateria80.png")
iconobateria100 = image.load("resources/bateria100.png")

voltaje = image.load("resources/displayc.png")
corriente = image.load("resources/displayi.png")
ciclos = image.load("resources/displayc.png")
salud = image.load("resources/displays.png")

temperatura20 = image.load("resources/temperatura20.png")
temperatura40 = image.load("resources/temperatura40.png")
temperatura60 = image.load("resources/temperatura60.png")
temperatura80 = image.load("resources/temperatura80.png")
temperatura100 = image.load("resources/temperatura100.png")

while true do
    buttons.read()
    fondo:blit(0,0)
    screen.print(100,20,"BATTVita ",1.5,color.cyan,color.shadow)

    if batt.exists() then
        bateriasi:blit(20,430)
        screen.print(100,480,"La batería esta presente en la consola ",1.2,color.black,color.gray)
    else
        bateriano:blit(20,430)
        screen.print(100,480,"La batería NO esta presente en la consola ",1.2,color.black,color.gray)
    end
    
    if batt.lifepercent() <= 20 then
        iconobateria20:blit(55,100)
        screen.print(70,200,tostring(batt.lifepercent()).." %",1.7,color.black,color.gray)
    elseif batt.lifepercent() > 20 and batt.lifepercent() <= 40 then
        iconobateria40:blit(55,100)
        screen.print(70,200,tostring(batt.lifepercent()).." %",1.7,color.black,color.gray)
    elseif batt.lifepercent() > 40 and batt.lifepercent() <= 60 then
        iconobateria60:blit(55,100)
        screen.print(70,200,tostring(batt.lifepercent()).." %",1.7,color.black,color.gray)
    elseif batt.lifepercent() > 60 and batt.lifepercent() <= 80 then
        iconobateria80:blit(55,100)
        screen.print(70,200,tostring(batt.lifepercent()).." %",1.7,color.black,color.gray)
    elseif batt.lifepercent() > 80 then
        iconobateria100:blit(55,100)
        screen.print(70,200,tostring(batt.lifepercent()).." %",1.7,color.black,color.gray)
    end

    voltaje:blit(300,100)
    screen.print(320,140,"Voltaje: "..batt.volt(),1.7,color.black,color.shadow)

    corriente:blit(300,180)
    screen.print(320,220,batt.remaincap(),1.7,color.black,color.shadow)

    ciclos:blit(300,260)
    screen.print(320,300,"Ciclos: "..tostring(batt.cycle()),1.7,color.black,color.shadow)

    salud:blit(300,340)
    screen.print(320,380,"Salud: "..tostring(batt.soh()).." %",1.7,color.black,color.shadow)

    screen.print(520,50,"tiempo restante: "..tostring(batt.lifetimemin()).." minutos",1.2,color.black,color.shadow)

    if tonumber(batt.temp()) <= 20 then
        temperatura20:blit(700,150)
        screen.print(750,250,tostring(batt.temp()).." °C",1.7,color.black,color.gray)
    elseif tonumber(batt.temp()) > 20 and tonumber(batt.temp()) <= 40 then
        temperatura40:blit(700,150)
        screen.print(750,200,tostring(batt.temp()).." °C",1.7,color.black,color.gray)
    elseif tonumber(batt.temp()) > 40 and tonumber(batt.temp()) <= 60 then
        temperatura60:blit(700,150)
        screen.print(750,200,tostring(batt.temp()).." °C",1.7,color.black,color.gray)
    elseif tonumber(batt.temp()) > 60 and tonumber(batt.temp()) <= 80 then
        temperatura80:blit(700,150)
        screen.print(750,200,tostring(batt.temp()).." °C",1.7,color.black,color.gray)
    elseif tonumber(batt.temp()) > 80 then
        temperatura90:blit(700,150)
        screen.print(750,200,tostring(batt.temp()).." °C",1.7,color.black,color.gray)
    end 

    if batt.low() then
        os.message("batería baja, por favor conecte la consola")
        bateriabaja:blit(700,430)
    end
    if batt.charging() then
        os.message("Cargando...")
        cargando:blit(700,430)
    end

    screen.flip()
end

Ahora solo basta con copiar nuestros archivos en las carpetas correspondientes y pasar el script a la consola.

Antes	Ahora

Consejos

Recuerda que la pantalla de la PS Vita tiene una resolución de 960 x 544 píxeles a 220 ppp, asi que este es el único espacio que tienes para ubicar tus elementos.
Recuerda que para ubicar un objeto en pantalla debes usar las coordenadas del área de dibujo.

Cargar todos tus recursos antes de iniciar el while, o es posible que la consola se cuelgue.

Video

This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.

Buscar en Ocitronix

OCITRONIX