[SOLVED] How to wrap text around image

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
User avatar
Abalone
Newbie
Posts: 5
Joined: Wed Jul 13, 2016 4:10 pm
Projects: Abenteuer mit Blech + Herz
Location: Germany - Wiesbaden
Contact:

[SOLVED] How to wrap text around image

#1 Post by Abalone »

Hello there,

I'm pretty new to Ren'py and the forums so please don't beat me if I ask a question that's as old as Methuselah :-)

I'd like to start a paragraph with an initial which is an image. Problem is, the text starts at the top of the image and at the point the line breaks the text continues below the image which leaves an ugly gap.

Image

1. What would be awesome is that the text floats around the image - is there a way to assign something like a vertical and horizontal margin to the image and the text next to the image then wraps around it?

2. Second best solution would be that the first line of text doesn't start at the top of the image but at the bottom - this would avoid the ugly gap in the paragraph.

Thanks in advance :-)
Abalone
Last edited by Abalone on Tue Aug 16, 2016 7:26 am, edited 1 time in total.

User avatar
papiersam
Veteran
Posts: 231
Joined: Fri Aug 12, 2016 2:24 pm
Completed: Gem Hunt Beta, 1/Probably, Animunch
Projects: The Panda Who Dreamed
Contact:

Re: How to wrap text around image

#2 Post by papiersam »

I don't know how you've coded the text, but you could always try image text tags (though I've never tried it myself).

User avatar
Abalone
Newbie
Posts: 5
Joined: Wed Jul 13, 2016 4:10 pm
Projects: Abenteuer mit Blech + Herz
Location: Germany - Wiesbaden
Contact:

Re: How to wrap text around image

#3 Post by Abalone »

r_sami wrote:I don't know how you've coded the text, but you could always try image text tags (though I've never tried it myself).
That's the way I did it and it doesn't work as wanted :-)

Code: Select all

label start:
    
    scene bg_book

    e "{image=images/alphabet/alphabet-d.png}{space=5}u hast ein neues Ren'Py Spiel erstellt. Sobald du eine Geschichte, Bilder und Musik hinzufügst, kannst du es für alle veröffentlichen! Sobald du eine Geschichte, Bilder und Musik hinzufügst, kannst du es für alle veröffentlichen! Sobald du eine Geschichte, Bilder und Musik hinzufügst, kannst du es für alle veröffentlichen! Sobald du eine Geschichte, Bilder und Musik hinzufügst, kannst du es für alle veröffentlichen! Sobald du eine Geschichte, Bilder und Musik hinzufügst, kannst du es für alle veröffentlichen!"
With {space} I was already able to put some space(!) between the image and the "u", but unfortunately that doesn't work with vspace (with that I tried to move the text downwards so that it lines up with the bottom of the image).

User avatar
Abalone
Newbie
Posts: 5
Joined: Wed Jul 13, 2016 4:10 pm
Projects: Abenteuer mit Blech + Herz
Location: Germany - Wiesbaden
Contact:

Re: [SOLVED] How to wrap text around image

#4 Post by Abalone »

Ok, as I said I'm new to Ren'Py - after testing around I found a solution now. I thought nothing could be placed where the text-window is located but I was wrong, thus I now place the initial-image with x- and ypos at the desired location and give the text space and vspace where necessary. It would be much easier if the text would wrap around an image automatically but oh well, since not every single paragraph starts with an image this "workaround" is acceptable :)
Only thing left is scaling down the initials so they match the height of three text-lines.

Image

Code: Select all

image bg_book = "images/bg_book.jpg"
image test:
    "images/alphabet/alphabet-d.png"
    xpos 60
    ypos 110
    xanchor 0.0
    yanchor 0.0

# Bestimmen Sie Charaktere, die in diesem Spiel verwendet werden.
define e = Character(None, window_left_margin=53, window_top_margin=60, window_right_margin=700, window_bottom_margin=60, window_yminimum=720, what_slow_cps=100)

# Hier beginnt das Spiel.
label start:
    
    scene bg_book

    e "{space=224}{size=14}{b}KAPITEL 1{/b}{/size}"
    
    show test
    
    extend "{vspace=34}{space=77}u hast ein neues Ren'Py Spiel erstellt. Sobald du eine {space=77}Geschichte, Bilder und Musik hinzufügst, kannst du es {space=77}für alle veröffentlichen! Sobald du eine Geschichte, {i}Bilder und Musik{/i} hinzufügst, kannst du es für alle veröffentlichen! Sobald du eine Geschichte, Bilder und Musik hinzufügst, kannst du es für alle veröffentlichen!"

henvu50
Veteran
Posts: 337
Joined: Wed Aug 22, 2018 1:22 am
Contact:

Re: [SOLVED] How to wrap text around image

#5 Post by henvu50 »

I'm currently trying to figure out how to do this with the say dialogue screen. I want to embed the sideImage in a way where the dialog text wraps around it.

Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Bing [Bot]