Rounded text boxes

Sparkle suggestion
1

Maybe this is a silly request, but as a graphic communicator and comic book artist I find it interesting to create sites like webcomics.

Would it be possible to give the same kind of formatting to a text field as to a shape, being able to round its corners and have the inner text adapt to that shape?

So far I do it like with a normal text manager: A centred text divided into different paragraphs in such a way that it adapts to the shape of the text balloon.

The request is because automating these actions helps a lot with productivity and automatic translations, as the text could be adapted automatically according to the language.

1 Like
2

Thanks for the suggestion. I don’t disagree that this would be useful for some cases, though it’s not the highest priority for a “normal” website either.

3

Hi Saeta, I’m not sure if this is useful, or what is needed from your descriptive post. Rounded circular text as shown in the screenshot. If you would like to explore this…

  1. Create a circular box. In Arrange settings choose wrap text - contour
  2. Creat a text box and overlay the text box onto the circular box.
  3. Experiment with the alpha setting and margin of the circular box in step 1 etc.

Hope you may find this useful.

Best,
Scott

Circle Test
Circle Test812Ă—768 54.3 KB

3 Likes
4

I don’t understand how you did this. Can you share a screenshot from the Sparkle screen? Or it would be nice if you could share the Sparkle file.

5

I don’t think I can share the Sparkle File because I’m on a beta. I think I can share screenshots because I don’t think there is anything to hide in those etc.

So the background box settings are this…

Arrange - Box
Arrange - Box542Ă—882 66.1 KB

Box-style
Box-style540Ă—668 43.4 KB

Box overlay
Box overlay812Ă—766 120 KB

And then just drag a regular text box over the top of it.

1 Like
6

The real trick here is that the box is transparent and bordered.
It doesn’t work if the box is filled solid color.

Thanks for the detailed explanation.

7

Exactly because you are following the contour of the border. I should have stated that in the step by step process! Haha :slight_smile:

2 Likes
8

Well done @rimram! :slight_smile:
Sparkle has so many hidden gems which you get to know by playing!!! :slight_smile:

2 Likes
9

@FlaminFig Exactly :slight_smile: Thank you!!

1 Like
10

Hi.

Really cool effect. Unfortunately you can’t see the success on the canvas, but only in the preview. And live, I suppose, since I have not tested it.

Mr. F.

11

@Mr_Fozzie The screenshots were taken from the canvas.

Best,
rimram

12

Hello.

Got it! The trick is to make the box without text either a little smaller, or place it slightly offset. Then you can see the effect on the canvas.

I had made both boxes exactly the same size and placed them exactly on top of each other. Then, strangely, you don’t see it.

Mr. F.

13

Wow! fantastic solution.

Thank you very much Scott. I will of course put it into practice :smiley:

Thank you very much for the step by step tutorial :clap: :clap: :clap:

1 Like