Layout example In Yab, you have the possiblity to use the layout command. I have write a little sub for me to generate the same look for the about view in my programs.

  1. In my program i define some variables.
  2. Then i take the screen width and height for fullscreen window or a little window and set it to the center of screen.
  3. After then i define a stackview for the rest of the program and set the frist stackview as shown
  4. With the About() i load the view About into the Stack, so i can get this view all the time from my menu (The control of menu and so on is here not shown)
  5. On the end of about view is a close button. This one must be all the time in the middle and follow the bottom and other widgets in the view. I expermented long time around to get the correct layout command to get the result.
    • First in the sub i set the layout to all for the stackview
    • then i get with current width and height from the stackview 5.3 after then i generate a view for the context.
    • then i get with current width and height from the view for the context 5.5 After then i define some text.
    • if you use texturl you must set the layout command to none, so the texturl has the same size, after then you must set the layout command to all, to get the same result from the other widgets.
    • i put a readonly textedit to the view
    • with LAYOUT "h-center,bottom", "View_About" i say that the following button is all time by resizing the window in the middle of the view and follows the windows With other compinations of layout option the button stays at the same position or by resizing to smaller windows the button go out of the windows. In some cases the button will be smaller or greater and that not the result i wanted.
ProgrammName$="ProgramName"

Start_FensterName$="name_of_program"
NameView$="dateibrowser"

screenWidth = peek("desktopwidth")
screenHeight = peek("desktopheight")

if (screenWidth=800) then
WindowSize_x=800
WindowSize_y=600
window open ((screenWidth/2)-(WindowSize_x/2)), ((screenHeight/2)-(WindowSize_y/2)) to ((screenWidth/2)+(WindowSize_x/2)), ((screenHeight/2)+(WindowSize_y/2)), Start_FensterName$,ProgrammName$
window set Start_FensterName$, "MinimumTo", 800,600
window set Start_FensterName$, "MaximumTo", 800,600
window set Start_FensterName$, "look","modal"
else
WindowSize_x=screenWidth-200
WindowSize_y=screenHeight-100
window open ((screenWidth/2)-(WindowSize_x/2)), ((screenHeight/2)-(WindowSize_y/2)) to ((screenWidth/2)+(WindowSize_x/2)), ((screenHeight/2)+(WindowSize_y/2)), Start_FensterName$,ProgrammName$
window set Start_FensterName$, "MinimumTo", 800,600
window set Start_FensterName$, "MaximumTo", WindowSize_x,WindowSize_y
endif
STACKVIEW 0,20 TO WindowSize_x,WindowSize_y, "ST" ,5, Start_FensterName$ // Here i define a Stackview
STACKVIEW set "ST" , 1
About()

sub About()
LAYOUT "all", "ST4"
view_Start_FensterName_x=VIEW GET Start_FensterName$, "Width"
view_Start_FensterName_y=VIEW GET Start_FensterName$, "Height"
View 10,0 to view_Start_FensterName_x, view_Start_FensterName_y, "View_About", "ST4" //Start_FensterName$
view_about_x=VIEW GET "View_About", "Width"
view_about_y=VIEW GET "View_About", "Height"

DRAW TEXT 10,30, "BeSly Software Solutions", "View_About"
DRAW LINE 0,40 TO view_about_x-10,41, "View_About"

DRAW TEXT 10,60, "Name:", "View_About"
DRAW TEXT 10,80, "Version / Build:", "View_About"
DRAW TEXT 10,100, "Version Status:", "View_About"
DRAW TEXT 10,120, "Developers:", "View_About"
DRAW TEXT 10,140, "Contact:", "View_About"
DRAW TEXT 10,160, "Website:", "View_About"
DRAW TEXT 10,180, "Bug-Reporting:", "View_About"

DRAW TEXT 150,60, ProgrammName$, "View_About"
DRAW TEXT 150,80, "0.3.5 / 01.01.2022", "View_About"
DRAW TEXT 150,100, "Alpha", "View_About"
DRAW TEXT 150,120, "Lorglas", "View_About"
DRAW SET "system-plain,regular,16,regular,0,45" ,"View_About"

LAYOUT "none", "View_About"

TEXTURL 150,131, "email", "Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein!", "Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein!", "View_About"
TEXTURL 150,151, "website", "http://software.besly.de", "http://software.besly.de", "View_About"
TEXTURL 150,167, "Bug-Report", "http://trac.besly.de", "http://trac.besly.de", "View_About"

LAYOUT "all", "View_About"

TEXTEDIT 10,220 TO view_about_x-5, view_about_y-150, "not_implemented", 1, "View_About"
TEXTEDIT SET "not_implemented", "editable", false

LAYOUT "h-center,bottom", "View_About"
button (view_about_x/2)-50, view_about_y-50 to (view_about_x/2)+50, view_about_y-30, "close", "Close","View_About"
end sub