Creating character sheets using IM

[mrvico]

Hi!

Is possible and if yes, how i could make a character sheet using a certain font?

I want to recreate the below image using other typeface.



Thanks in advance!

[fmw42]

What is your platform/OS and version of ImageMagick? Please always provide that when asking questions.

[mrvico]

Sorry, forgot that.

Currently i use IM on my Raspberry pi (Raspbian headless/without DE) and i'm using the latest version available to raspbian via apt (ImageMagick 6.9.7-4 Q16 arm 20170114)

[fmw42]

One way would be to use label: with a monospaced font. Then write a script loop over each possible character and create an output for it. Then montage them together into a grid with borders if desired.

See
https://imagemagick.org/Usage/text/#label
https://imagemagick.org/Usage/montage/

[mrvico]

But what if the font isnt monospaced?

[fmw42]

Loop over each separate character image and pad it out to the maximum sized character or max width and max height from all the characters.

[GeeMack]

But what if the font isnt monospaced?

I have a Windows script that creates a character display like what you describe. I modified it a bit and tested it with ImageMagick 6.8.9-9 on a bash shell.

The first part of it uses a couple "for" loops and "sed" to create a text file containing a list of all the characters.

Code: Select all

> chars.txt

for x in 2 3 4 5 6 7 8 9 A B C D E F ;
   do for y in 0 1 2 3 4 5 6 7 8 9 A B C D E F ;
      do echo X | sed "s/.*/label:\x${x}${y}/g" >> chars.txt ;
   done ;
done

The lines in that file look like this...

Code: Select all

label: 
label:!
label:"
label:#
label:$
label:%
...

The prefix "label:" on each line lets IM read that file as if it's a long list of individual labels. IM reads that file like this "@chars.txt" to get all the images to create the character sheet. Here is the IM command that works on my bash...

Code: Select all

imfont=Times-Roman

convert -font ${imfont} -pointsize 24 -size 36x36 -gravity center -background none \
   label:"\ " @chars.txt +gravity -compose copy -bordercolor blue -shave 1 -border 1 \
   +append +repage -crop 360x36 -append +repage charsheet.png

You should be able to make the grid from any installed font by setting the variable "imfont" to your choice.

[cancerberosgx]

It's not exactly what you are asking, but often is easy to transform letter by letter and then join them, if needed. In many cases having them separately is more useful. Checkout this live example:https://cancerberosgx.github.io/demos/m ... xuJT4ifQ==

[mrvico]

But what if the font isnt monospaced?

I have a Windows script that creates a character display like what you describe. I modified it a bit and tested it with ImageMagick 6.8.9-9 on a bash shell.

The first part of it uses a couple "for" loops and "sed" to create a text file containing a list of all the characters.

Code: Select all

> chars.txt

for x in 2 3 4 5 6 7 8 9 A B C D E F ;
   do for y in 0 1 2 3 4 5 6 7 8 9 A B C D E F ;
      do echo X | sed "s/.*/label:\x${x}${y}/g" >> chars.txt ;
   done ;
done

The lines in that file look like this...

Code: Select all

label: 
label:!
label:"
label:#
label:$
label:%
...

The prefix "label:" on each line lets IM read that file as if it's a long list of individual labels. IM reads that file like this "@chars.txt" to get all the images to create the character sheet. Here is the IM command that works on my bash...

Code: Select all

imfont=Times-Roman

convert -font ${imfont} -pointsize 24 -size 36x36 -gravity center -background none \
   label:"\ " @chars.txt +gravity -compose copy -bordercolor blue -shave 1 -border 1 \
   +append +repage -crop 360x36 -append +repage charsheet.png

You should be able to make the grid from any installed font by setting the variable "imfont" to your choice.

Thanks a lot! It was very close of what i need.
But the dimensions of each box (counting the 1px border of top and left) are of 20x26px, and each character are graviting West, but with the bottom offset half of the top (eg. 4px to the bottom of the box, and 8px of the top).

I tried to change the values to suit but i got a disarranged charset.

[GeeMack]

But the dimensions of each box (counting the 1px border of top and left) are of 20x26px, and each character are graviting West, but with the bottom offset half of the top (eg. 4px to the bottom of the box, and 8px of the top).

I tried to change the values to suit but i got a disarranged charset.

You can easily change the pointsize and the dimensions of the labels, and set the gravity to west or southwest. Each font has somewhat different dimensions from another, even at a given pointsize, so you might have to adjust for that. And with a little modification to how the blue lines are applied, they can be all just one pixel wide. Here's a command that might get you closer...

Code: Select all

imfont=Helvetica

convert -font ${imfont} -background none -gravity southwest \
   -pointsize 16 -size 19x25 label:"\ " @chars.txt +gravity -delete 220--1 \
   -background \#1600f3 -splice 1x1 +append +repage -crop 200x26 -append +repage \
   -gravity southeast -splice 1x1 -background \#626b62 -flatten charsheet.png

I notice in your example image that each character's box has a single red pixel at the top which seems to indicate the width (plus two pixels) of the character in that box. If those are important to how your program reads the character sheet, they can be added in the ImageMagick command, too, but it suddenly gets a lot more complex.

[mrvico]

Yeah, i think the lack of the red pixels made the screen on the steering wheel render garbled like this:

[fmw42]

@mrvico

What does your post have to do with Creating character sheets?

Perhaps you posted to the wrong topic? If so, please delete your post and repost to the correct location. Otherwise, you post may be removed as off-topic.

[mrvico]

Seriously... I was showing GeeMack the character sheet wasnt being rendered properly ingame, all characters are being squeezed in one place, due possibly to the lack of the red point on top of the sheet image.

[fmw42]

OK. But you could have explained the connection better.

[mrvico]

Okay, I'm deeply sorry. I thought i said in OP about for what i needed this sheet, but not. I said it only on my stackoverflow question i made too.