Aligning Text In A Button

Post Reply
the_wesley_watkins
Posts: 42
Joined: Wed Jul 29, 2015 3:53 pm
My devices: Ipad
Iphone

Aligning Text In A Button

Post by the_wesley_watkins »

I have a column of buttons and I need all of the text to be aligned so it looks neat.

I have all the text that is suppose to go within the button in a string variable and I've attempted to use the TEXT_WIDTH() and LEN() commands to manipulate these aspects of the string in order to make each have the same text width and length.

Right now, I have a variable called "space" in a specific spot within the string which I use to manipulate the string.

If TEXT_WIDTH(str$) < maxstringwidth THEN
space$ &= " "
str$ = "blah blah" & space$ & "blah blah blah"
END IF

Any help?

User avatar
Dutchman
Posts: 851
Joined: Mon May 06, 2013 9:21 am
My devices: iMac, iPad Air, iPhone
Location: Netherlands
Flag: Netherlands

Re: Aligning Text In A Button

Post by Dutchman »

On 09 Feb 2015, 16:37 Mr. K. wrote"
Actually automatic button size equals: (20 + text_length) x (12 + text_height)
Does that help?

the_wesley_watkins
Posts: 42
Joined: Wed Jul 29, 2015 3:53 pm
My devices: Ipad
Iphone

Re: Aligning Text In A Button

Post by the_wesley_watkins »

Not really. I've already read that thread.

I want it to look like this.

But the code I used for this isn't very feasible. I had to go through and manually do each button, adding spaces where necessary to make it appear like this. For the finishing product, I need to be able to loop have all the buttons appear by a loop because sometimes the text within the button changes and it needs to be able to do this automatically.
Attachments
image.jpg
image.jpg (132.2 KiB) Viewed 2229 times

User avatar
Dutchman
Posts: 851
Joined: Mon May 06, 2013 9:21 am
My devices: iMac, iPad Air, iPhone
Location: Netherlands
Flag: Netherlands

Re: Aligning Text In A Button

Post by Dutchman »

It can be done with mono-spaced font.

Code: Select all

'Align, by Dutchman, july 2015
'----- Presets
Random$.min=3 'letters
Random$.max=12 'letters
Aligned$.Space$=" " 'minimum space
'
'----- set display
FontSize=20 ! FontName$="Courier"
GOSUB Initialise
'
'----- Main
FOR n=1 TO 20
  word1$=Random$
  word2$=Random$
  print Aligned$(word1$,word2$,250)
NEXT n
END
'
'===== Functions and Subroutines
DEF Aligned$(w1$,w2$,width)
'w1$+w2$+Space$ should be shorter then width
in$="" 
DO
 txt$=w1$&Space$&in$&w2$
 in$&=" "
UNTIL TEXT_WIDTH(Txt$)>=width
RETURN txt$
END DEF
'
DEF Random$
txt$=""
FOR i=1 TO min+RND(max-min+1)
  txt$&=CHR$(97+RND(123-97))
NEXT i
RETURN txt$
END DEF
'
Initialise:
SET OUTPUT FONT NAME FontName$
SET OUTPUT FONT SIZE FontSize
RETURN
Align.PNG
Align.PNG (38.67 KiB) Viewed 2197 times

User avatar
Dutchman
Posts: 851
Joined: Mon May 06, 2013 9:21 am
My devices: iMac, iPad Air, iPhone
Location: Netherlands
Flag: Netherlands

Re: Aligning Text In A Button

Post by Dutchman »

I have extended the test-program with buttons, to be sure. :D
This is a second version due to a small error in the first ;)

Code: Select all

'Align, by Dutchman, july 2015
'----- Presets
Random$.min=3 'letters
Random$.max=12 'letters
Aligned$.Space$=" " 'minimum space
SET BUTTONS CUSTOM
'
'----- set display
FontSize=18 ! FontName$="Courier-Bold"
GOSUB Initialise
'
'----- Main
width=250
FOR n=1 TO 20
  print Aligned$(Random$,Random$,width)
NEXT n
PRINT ! PRINT "Press 'Enter' to continue."
INPUT in$
'---- with buttons
TEXT CLEAR
dy=3*fontsize ! bh=MIN(dy-5,25+fontsize)
FOR n=1 TO 5
  BUTTON n TEXT Aligned$(Random$,Random$,250) AT 10,n*dy SIZE width,bh
NEXT n
FILL COLOR 1,0,0
BUTTON n TEXT "QUIT" AT 10,n*dy SIZE width,bh
DO ! UNTIL BUTTON_PRESSED(STR$(n,"#"))
END
'
'===== Functions and Subroutines
DEF Aligned$(w1$,w2$,width)
'w1$+w2$+Space$ should be shorter then width
in$="" 
DO
 txt$=w1$&Space$&in$&w2$
 in$&=" "
UNTIL TEXT_WIDTH(Txt$)>=width
RETURN txt$
END DEF
'
DEF Random$
txt$=""
FOR i=1 TO min+RND(max-min+1)
  txt$&=CHR$(97+RND(123-97))
NEXT i
RETURN txt$
END DEF
'
Initialise:
SET OUTPUT FONT NAME FontName$
SET OUTPUT FONT SIZE FontSize
SET BUTTONS FONT NAME FontName$
SET BUTTONS FONT SIZE FontSize
DRAW COLOR 1,1,0
FILL COLOR 0,0,1
RETURN
Aligned buttontext.PNG
Aligned buttontext.PNG (105.93 KiB) Viewed 2187 times

User avatar
Dutchman
Posts: 851
Joined: Mon May 06, 2013 9:21 am
My devices: iMac, iPad Air, iPhone
Location: Netherlands
Flag: Netherlands

Re: Aligning Text In A Button

Post by Dutchman »

The version which scales completely with font-size and word-length can be found at viewtopic.php?f=20&t=1123

Post Reply