Instant CG and BG gallery

A place for Ren'Py tutorials and reusable Ren'Py code.
Forum rules
Do not post questions here!

This forum is for example code you want to show other people. Ren'Py questions should be asked in the Ren'Py Questions and Announcements forum.
Message
Author
User avatar
leon
Miko-Class Veteran
Posts: 554
Joined: Sun Oct 09, 2011 11:15 pm
Completed: Visual Novel Tycoon, Night at the Hospital, Time Labyrinth, The Buried Moon, Left of Center, Super Otome Quest
Projects: Lemon Project, Porcelain Heart, Dream's Dénouement
Organization: Team ANARKY
Contact:

Re: Instant CG and BG gallery

#106 Post by leon »

@scorlight: You only need to define the images once. They don't need to be in the same file as the gallery. Note that image unlocking is handled automatically by Ren'Py. Could you copy the relevant lines of the code?

@Carrogath: The code looks fine to me. Could you upload the whole thing (with images included)?

@Kagehide: Firstly check that all the images cg13-cg20 are acutally defined and there are no typos.
You'll probably also want to add unlock conditions to the buttons.

Code: Select all

      if gal_item == "cg12":
            g_deus.image("cg13")
            g_deus.unlock("cg13")
            g_deus.image("cg14")
            g_deus.unlock("cg14")
            #...
Or:

Code: Select all

      if gal_item == "cg12":
            g_deus.unlock_image("cg13")
            g_deus.unlock_image("cg14")
            #...

Carrogath
Regular
Posts: 106
Joined: Wed Jan 25, 2012 12:08 pm
Completed: Basiliska, Green Eyed Monster
Tumblr: carrogath
Location: United States
Contact:

Re: Instant CG and BG gallery

#107 Post by Carrogath »

I'll PM it to you.

User avatar
nikraria
Newbie
Posts: 11
Joined: Fri Aug 29, 2014 3:53 pm
Contact:

Re: Instant CG and BG gallery

#108 Post by nikraria »

I just want to say thank you very much!

User avatar
MoonStar
Regular
Posts: 163
Joined: Mon Jun 09, 2014 10:21 am
Projects: Yggdrasil
Contact:

Re: Instant CG and BG gallery

#109 Post by MoonStar »

thanks i was looking for an easier way to do this :)

User avatar
Samurai10000
Newbie
Posts: 1
Joined: Sun Nov 23, 2014 4:33 pm
Contact:

Re: Instant CG and BG gallery

#110 Post by Samurai10000 »

First: Your code is awesome!!!!
Second: I use this in one project and it's working perfectly; but I´m use that in a new project and not working and check it often but I not find the error.

Screens.rpy:

Code: Select all

init python:
    #Las opciones de galeria empiezan acá
    #lista de las imagenes del CG gallery aquí:
    gallery_cg_items = ["Imagen01"]
    #Cuantas filas y columnas en la pantalla de la galería?
    gal_rows = 1
    gal_cols = 2
    #thumbnail size in pixels (lo cambie):
    thumbnail_x = 267
    thumbnail_y = 150
    #El ajuste anterior (267x150) va a funcionar bien con una relación de pantalla de 16:9. Asegúrese de ajustar, si es que está utilizando 4:3 o algo más.
    #Opciones de galeria terminadas
   
    gal_cells = gal_rows * gal_cols   
    g_cg = Gallery()
    for gal_item in gallery_cg_items:
        g_cg.button(gal_item + " butt")
        g_cg.image(gal_item)
        g_cg.unlock(gal_item)
            
    g_cg.transition = fade
    cg_page=0
   
init +1 python:
    #Acá nosotros hacemos la miniatura. Una imagen en miniatura, que nosotros creamos en escalas de grises para los BGs, pero creamos una imagen especial de "bloqueado" para los CGs para prevenir spoilers.
    for gal_item in gallery_cg_items:
        renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
       
screen cg_gallery:
    tag menu
    use navigation
    frame background None xpos 10:
        grid gal_rows gal_cols:
            ypos 10
            $ i = 0
            $ next_cg_page = cg_page + 1           
            if next_cg_page > int(len(gallery_cg_items)/gal_cells):
                $ next_cg_page = 0
            for gal_item in gallery_cg_items:
                $ i += 1
                if i <= (cg_page+1)*gal_cells and i>cg_page*gal_cells:
                    add g_cg.make_button(gal_item + " butt", gal_item + " butt", im.Scale("gallocked.png", thumbnail_x, thumbnail_y), xalign=0.5, yalign=0.5, idle_border=None, background=None, bottom_margin=24)
            for j in range(i, (cg_page+1)*gal_cells): #necesitamos esto para llenar completamente la cuadricula
                null
        frame:
            yalign 0.97
            vbox:
                if len(gallery_cg_items)>gal_cells:
                    textbutton _("Siguiente") action [SetVariable('cg_page', next_cg_page), ShowMenu("cg_gallery")]
Some parts that is in spanish because is my lenguage, I speak a simple english.

Below I put the image with the error listed me, and in this part:

Code: Select all

(598)init +1 python:
    #Acá nosotros hacemos la miniatura. Una imagen en miniatura, que nosotros creamos en escalas de grises para los BGs, pero creamos una imagen especial de "bloqueado" para los CGs para prevenir spoilers.
    for gal_item in gallery_cg_items:
(591)       renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
PD: I use the Ren'py version 6.18.0
Attachments
Sin título2.png

User avatar
aussieducky
Regular
Posts: 31
Joined: Sat Dec 27, 2014 8:43 pm
Projects: =
Tumblr: aussiebunny
Contact:

Re: Instant CG and BG gallery

#111 Post by aussieducky »

Hey! I'm not sure if this thread is still being replied to, but I keep getting an in-game error message in red text: Image 'wCG' can't take parameters "butt" (perhaps you got the same wrong?) I know someone had this problem earlier on, but I couldn't find the actual solution in the replies :(

my screen code is:

Code: Select all

init python:
    #Galleries settings - start
    #list the CG gallery images here:
    gallery_cg_items = ["wCG", "h cg"]
    #how many rows and columns in the gallery screens?
    gal_rows = 3
    gal_cols = 3
    #thumbnail size in pixels:
    thumbnail_x = 267
    thumbnail_y = 150
    #the setting above (267x150) will work well with 16:9 screen ratio. Make sure to adjust it, if your are using 4:3 or something else.
    #Galleries settings - end
    
    gal_cells = gal_rows * gal_cols    
    g_cg = Gallery()
    for gal_item in gallery_cg_items:
        g_cg.button(gal_item + " butt")
        g_cg.image(gal_item)
        g_cg.unlock(gal_item)
    g_cg.transition = fade
    cg_page=0

    
init +1 python:
    renpy.image ("wCG", im.Scale("WandererCG.jpg", thumbnail_x, thumbnail_y))
    renpy.image ("h cg", im.Scale("HarukoCG1", thumbnail_x, thumbnail_y))
        
screen cg_gallery:
    tag menu
    use navigation
    frame background None xpos 10:
        grid gal_rows gal_cols:
            ypos 10
            $ i = 0
            $ next_cg_page = cg_page + 1            
            if next_cg_page > int(len(gallery_cg_items)/gal_cells):
                $ next_cg_page = 0
            for gal_item in gallery_cg_items:
                $ i += 1
                if i <= (cg_page+1)*gal_cells and i>cg_page*gal_cells:
                    add g_cg.make_button(gal_item + " butt", gal_item + " butt", im.Scale("gallocked.png", thumbnail_x, thumbnail_y), xalign=0.5, yalign=0.5, idle_border=None, background=None, bottom_margin=24)
            for j in range(i, (cg_page+1)*gal_cells): #we need this to fully fill the grid
                null
        frame:
            yalign 0.97
            vbox:
                if len(gallery_cg_items)>gal_cells:
                    textbutton _("Next Page") action [SetVariable('cg_page', next_cg_page), ShowMenu("cg_gallery")]
I removed all the background stuff, as I only want a CG gallery. Help?

edit: I should add I know next to nothing about coding, so I apologise it the answer to my problem is very obvious :/
I am a teenager who would like, very much, to finish a visual novel ;D

I don't know much about coding, but I'll try not to be a bother.

Currently working on: "Blackout"

sharikah
Regular
Posts: 139
Joined: Sun Jun 08, 2014 1:36 am
Contact:

Re: Instant CG and BG gallery

#112 Post by sharikah »

Cousin Leon, is there a way for you to give me the character gallery code/tutorial I really wanted to make one for my Visual Novel!!Please help!!

leon wrote:Here's a code snippet to include the CG and/or BG galleries to your games without much extra effort. Just copy paste it to screens.rpy, change the settings at the top to your liking and you'll have a working gallery.

I haven't included a character gallery, because sprites usually include many variations/expressions, they come in different sizes and they require an extra background, so a simple copy/pastable sollution wouldn't work that well.

Code: Select all

init python:
    #Galleries settings - start
    #list the CG gallery images here:
    gallery_cg_items = ["cg1", "cg2", "cg3", "cg4", "cg5", "cg6", "cg7", "cg8", "cg9", "cg10"]
    #list the BG gallery images here (if a BG includes several variations, such as night version, include only one variation here):
    gallery_bg_items = ["bg kitchen", "bg road"]
    #how many rows and columns in the gallery screens?
    gal_rows = 3
    gal_cols = 3
    #thumbnail size in pixels:
    thumbnail_x = 267
    thumbnail_y = 150
    #the setting above (267x150) will work well with 16:9 screen ratio. Make sure to adjust it, if your are using 4:3 or something else.
    #Galleries settings - end
    
    gal_cells = gal_rows * gal_cols    
    g_cg = Gallery()
    for gal_item in gallery_cg_items:
        g_cg.button(gal_item + " butt")
        g_cg.image(gal_item)
        g_cg.unlock(gal_item)
    g_cg.transition = fade
    cg_page=0

    g_bg = Gallery()
    for gal_item in gallery_bg_items:
        g_bg.button(gal_item + " butt")
        g_bg.image(gal_item)
        g_bg.unlock(gal_item)
        #if BGs have variations, such as night version, uncomment the lines below and include the code for each BG with variations
#        if gal_item == "bg kitchen":
#            g_bg.image("bg kitchen dining")
#            g_bg.unlock("bg kitchen dining")
    g_bg.transition = fade
    bg_page=0
    
init +1 python:
    #Here we create the thumbnails. We create a grayscale thumbnail image for BGs, but we use a special "locked" image for CGs to prevent spoilers.
    for gal_item in gallery_cg_items:
        renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
    for gal_item in gallery_bg_items:
        renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
        renpy.image (gal_item + " butt dis", im.Grayscale(ImageReference(gal_item + " butt")))
        
screen cg_gallery:
    tag menu
    use navigation
    frame background None xpos 10:
        grid gal_rows gal_cols:
            ypos 10
            $ i = 0
            $ next_cg_page = cg_page + 1            
            if next_cg_page > int(len(gallery_cg_items)/gal_cells):
                $ next_cg_page = 0
            for gal_item in gallery_cg_items:
                $ i += 1
                if i <= (cg_page+1)*gal_cells and i>cg_page*gal_cells:
                    add g_cg.make_button(gal_item + " butt", gal_item + " butt", im.Scale("gallocked.png", thumbnail_x, thumbnail_y), xalign=0.5, yalign=0.5, idle_border=None, background=None, bottom_margin=24)
            for j in range(i, (cg_page+1)*gal_cells): #we need this to fully fill the grid
                null
        frame:
            yalign 0.97
            vbox:
                if len(gallery_cg_items)>gal_cells:
                    textbutton _("Next Page") action [SetVariable('cg_page', next_cg_page), ShowMenu("cg_gallery")]

screen bg_gallery:
#The BG gallery screen is more or less copy pasted from the CG screen above, I only changed "make_button" to include a grayscale thumbnail for locked items
    tag menu
    use navigation
    frame background None xpos 10:
        grid gal_rows gal_cols:
            ypos 10
            $ i = 0
            $ next_bg_page = bg_page + 1
            if next_bg_page > int(len(gallery_bg_items)/gal_cells):
                $ next_bg_page = 0
            for gal_item in gallery_bg_items:
                $ i += 1
                if i <= (bg_page+1)*gal_cells and i>bg_page*gal_cells:
                    add g_bg.make_button(gal_item + " butt", gal_item + " butt", gal_item + " butt dis", xalign=0.5, yalign=0.5, idle_border=None, background=None, bottom_margin=24)
            for j in range(i, (bg_page+1)*gal_cells):
                null
        frame:
            yalign 0.97
            vbox:
                if len(gallery_bg_items)>gal_cells:
                    textbutton _("Next Page") action [SetVariable('bg_page', next_bg_page), ShowMenu("bg_gallery")]
In the attached file is a working example; credit for the included CG of a girl touching her boobs goes to azureXtwilight.
Image

User avatar
ForTheQuin
Newbie
Posts: 1
Joined: Mon Feb 16, 2015 7:18 pm
Soundcloud: ForTheQuin
Contact:

Re: Instant CG and BG gallery

#113 Post by ForTheQuin »

Hi Leon! This code has made my life 100x easier, so thank you for that.

I had a bit of a customization related question for you. Is there a way to have thumbnail specific images? What I mean by this is that I want every button in the menu to have the same white border that my gallocked.png has. So I thought about making unique images for each button, but then I realized that I wouldn't want that version to show up in the actual zoomed image viewing (I already have a good idea of how to sneak them into the game for the sake of unlocking, it's just a matter of not including the button image in the viewer).

Hopefully that makes sense. I guess the core of what I'm trying to say is that I get annoyed at the inconsistency of button borders in my gallery, and I wanted to know if there was a way to make everything have a border without having to view the bordered image first.

User avatar
MarieRose1301
Newbie
Posts: 21
Joined: Sat Jun 13, 2015 3:25 am
Projects: Hatsune Miku no Yuuutsu
Deviantart: ConflictLuka
Contact:

Re: Instant CG and BG gallery

#114 Post by MarieRose1301 »

I'm kind of lost here: how do I set an unlocking condition for a CG art?
If U Seek Amy

User avatar
leon
Miko-Class Veteran
Posts: 554
Joined: Sun Oct 09, 2011 11:15 pm
Completed: Visual Novel Tycoon, Night at the Hospital, Time Labyrinth, The Buried Moon, Left of Center, Super Otome Quest
Projects: Lemon Project, Porcelain Heart, Dream's Dénouement
Organization: Team ANARKY
Contact:

Re: Instant CG and BG gallery

#115 Post by leon »

See the documentation. By default they get unlocked when the player views them.

cardium
Newbie
Posts: 12
Joined: Mon Nov 24, 2014 2:41 pm
Contact:

Re: Instant CG and BG gallery

#116 Post by cardium »

Hello and thank you for this great script! After some work I managed to make it work.
Although I have a question. My cg gallery contains transparent pictures (.png) without background. How can I add a background image when I click to open and enlarge a cg picture?

Thanks again!

User avatar
leon
Miko-Class Veteran
Posts: 554
Joined: Sun Oct 09, 2011 11:15 pm
Completed: Visual Novel Tycoon, Night at the Hospital, Time Labyrinth, The Buried Moon, Left of Center, Super Otome Quest
Projects: Lemon Project, Porcelain Heart, Dream's Dénouement
Organization: Team ANARKY
Contact:

Re: Instant CG and BG gallery

#117 Post by leon »

Like this:

Code: Select all

g_cg.image(background_image, gal_item)

cardium
Newbie
Posts: 12
Joined: Mon Nov 24, 2014 2:41 pm
Contact:

Re: Instant CG and BG gallery

#118 Post by cardium »

Exactly like that! Thank you so much for your help!
I know it was too obvious, but I am a starter in renpy scripting! Cheers ;) !

User avatar
Batensan
Regular
Posts: 74
Joined: Fri Jul 22, 2011 11:43 pm
Completed: Moon Observatory (Ciel, Anholly, Iris), Pizzaro Project Deep Dish
Tumblr: batensan
Deviantart: batensan
itch: batensan
Contact:

Re: Instant CG and BG gallery

#119 Post by Batensan »

Hello! My code is working completely fine, but I was wonder if there's a way to add a white or custom border onto the unlocked CG's in the gallery just to fancy it up a bit?

Edit: Nevermind, I figured it out.
Last edited by Batensan on Mon Aug 10, 2015 2:43 pm, edited 1 time in total.
Developer of Moon Observatory.

Rene
Newbie
Posts: 2
Joined: Sun Aug 09, 2015 2:56 am
Contact:

Re: Instant CG and BG gallery

#120 Post by Rene »

For some reason, I can't get it working, though the code should be ok. I keep getting the following error:

I'm sorry, but an uncaught exception occurred.

While running game code:
File "game/gallery.rpy", line 43, in script
init +1 python:
File "game/gallery.rpy", line 48, in <module>
renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
Exception: Expected an image, but got a general displayable.

-- Full Traceback ------------------------------------------------------------

Full traceback:
File "game/gallery.rpy", line 43, in script
init +1 python:
File "N:\Downloads\Programs\renpy-6.99.5-sdk\renpy\ast.py", line 797, in execute
renpy.python.py_exec_bytecode(self.code.bytecode, self.hide, store=self.store)
File "N:\Downloads\Programs\renpy-6.99.5-sdk\renpy\python.py", line 1448, in py_exec_bytecode
exec bytecode in globals, locals
File "game/gallery.rpy", line 48, in <module>
renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
File "N:\Downloads\Programs\renpy-6.99.5-sdk\renpy\display\im.py", line 668, in __init__
im = image(im)
File "N:\Downloads\Programs\renpy-6.99.5-sdk\renpy\display\im.py", line 1564, in image
return image(arg.target, loose=loose, **properties)
File "N:\Downloads\Programs\renpy-6.99.5-sdk\renpy\display\im.py", line 1579, in image
raise Exception("Expected an image, but got a general displayable.")
Exception: Expected an image, but got a general displayable.

Windows-7-6.1.7601-SP1
Ren'Py 6.99.5.602
Mistress Elvira 0.0

Here's the code of the gallery, which was put in a seperate file (gallery.rpy)
Currently only BG's are to be displayed:

init python:
#Galleries settings - start
#list the CG gallery images here:
# gallery_cg_items = ["xinxin"]
#list the BG gallery images here (if a BG includes several variations, such as night version, include only one variation here):
gallery_bg_items = ["bg xinxin"]
#how many rows and columns in the gallery screens?
gal_rows = 3
gal_cols = 3
#thumbnail size in pixels:
thumbnail_x = 267
thumbnail_y = 150
#the setting above (267x150) will work well with 16:9 screen ratio. Make sure to adjust it, if your are using 4:3 or something else.
#Galleries settings - end

gal_cells = gal_rows * gal_cols
# g_cg = Gallery()
# for gal_item in gallery_cg_items:
# g_cg.button(gal_item + " butt")
# g_cg.image(gal_item)
# g_cg.unlock(gal_item)
# #if BGs have variations, such as night version, uncomment the lines below and include the code for each BG with variations
# if gal_item == "xinxin":
# g_cg.image("funhouse1")
# g_cg.unlock("funhouse1")
# g_cg.transition = fade
# cg_page=0

g_bg = Gallery()
for gal_item in gallery_bg_items:
g_bg.button(gal_item + " butt")
g_bg.image(gal_item)
g_bg.unlock(gal_item)
#if BGs have variations, such as night version, uncomment the lines below and include the code for each BG with variations
if gal_item == "bg xinxin":
g_bg.image("bg funhouse1")
g_bg.unlock("bg funhouse1")
g_bg.image("bg funhouse3")
g_bg.unlock("bg funhouse3")
g_bg.transition = fade
bg_page=0

init +1 python:
#Here we create the thumbnails. We create a grayscale thumbnail image for BGs, but we use a special "locked" image for CGs to prevent spoilers.
# for gal_item in gallery_cg_items:
# renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
for gal_item in gallery_bg_items:
renpy.image (gal_item + " butt", im.Scale(ImageReference(gal_item), thumbnail_x, thumbnail_y))
renpy.image (gal_item + " butt dis", im.Grayscale(ImageReference(gal_item + " butt")))

#screen cg_gallery:
# tag menu
# use navigation
# frame background None xpos 10:
# grid gal_rows gal_cols:
# ypos 10
# $ i = 0
# $ next_cg_page = cg_page + 1
# if next_cg_page > int(len(gallery_cg_items)/gal_cells):
# $ next_cg_page = 0
# for gal_item in gallery_cg_items:
# $ i += 1
# if i <= (cg_page+1)*gal_cells and i>cg_page*gal_cells:
# add g_cg.make_button(gal_item + " butt", gal_item + " butt", im.Scale("gallocked.png", thumbnail_x, thumbnail_y), xalign=0.5, yalign=0.5, idle_border=None, background=None, bottom_margin=24)
# for j in range(i, (cg_page+1)*gal_cells): #we need this to fully fill the grid
# null
# frame:
# yalign 0.97
# vbox:
# if len(gallery_cg_items)>gal_cells:
# textbutton _("Next Page") action [SetVariable('cg_page', next_cg_page), ShowMenu("cg_gallery")]

screen bg_gallery:
#The BG gallery screen is more or less copy pasted from the CG screen above, I only changed "make_button" to include a grayscale thumbnail for locked items
tag menu
use navigation
frame background None xpos 10:
grid gal_rows gal_cols:
ypos 10
$ i = 0
$ next_bg_page = bg_page + 1
if next_bg_page > int(len(gallery_bg_items)/gal_cells):
$ next_bg_page = 0
for gal_item in gallery_bg_items:
$ i += 1
if i <= (bg_page+1)*gal_cells and i>bg_page*gal_cells:
add g_bg.make_button(gal_item + " butt", gal_item + " butt", gal_item + " butt dis", xalign=0.5, yalign=0.5, idle_border=None, background=None, bottom_margin=24)
for j in range(i, (bg_page+1)*gal_cells):
null
frame:
yalign 0.97
vbox:
if len(gallery_bg_items)>gal_cells:
textbutton _("Next Page") action [SetVariable('bg_page', next_bg_page), ShowMenu("bg_gallery")]

And in the script.rpy:

image bg xinxin = "images/gallery/xinxin/xinxin.png"
image bg funhouse1 = "images/backgrounds/funhouse_anasophie_xinxin_1.png"
image bg funhouse2 = "images/backgrounds/funhouse_anasophie_xinxin_2.png"
image bg funhouse3 = "images/backgrounds/funhouse_anasophie_xinxin_3.png"
image bg funhouse4 = "images/backgrounds/funhouse_anasophie_xinxin_4.png"

Also the BG Gallery option won't show in the main menu:

textbutton _("Start Game") action Start()
textbutton _("Load Game") action ShowMenu("load")
textbutton _("BG Gallery") action ShowMenu("bg_gallery")
textbutton _("Preferences") action ShowMenu("preferences")
textbutton _("Help") action Help()
textbutton _("Quit") action Quit(confirm=False)

Post Reply

Who is online

Users browsing this forum: No registered users