Page History

...

Designs are given a width. When the width of the page becomes less than the Design, the DesignChanged event is fired throughout the application allowing decisions to be made about the appearance.

...

     * Designs
     Define_Com Class(#PRIM_DESN) Name(#DesignManager)
     Define_Com Class(#PRIM_DESN.Design) Name(#MobileDesign) Designmanager(#DesignManager) Width(600)
     Define_Com Class(#PRIM_DESN.Design) Name(#TabletDesign) Designmanager(#DesignManager) Width(1000)

     * Application
     Define_Com Class(#XKMAPP) Name(#Application) Scope(*APPLICATION)
 
     Evtroutine Handling(#Com_owner.DesignChanged) Design(#Design)
 
     #Application.DesignChanged( #Design )
 
     Endroutine
   

The associated Application object can be used to centralize the processing of the DesignChanged event something like this:

     Mthroutine Name(DesignChanged)
     Define_Map For(*input) Class(#Prim_desn.Design) Name(#Design) Pass(*By_reference)
 
     #ActiveDesign <= #Design
 
     If (#Design *Is *null)
 
     #Com_Owner.ActivateDesktopView
 
     Else

...

 
       If (#Design.Name = MobileDesign)

...

 
        #Com_Owner.ActivateMobileView
 

...

       Else
 

...

        #Com_Owner.ActivateTabletView
 

...

       Endif
 
     Endif
 
     Endroutine
 
     Mthroutine Name(ActivateMobileView)

...

 
       Signal Event(HideContent)

...

 
       #ActiveView := MOBILE

...

 
       Signal Event(MobileView)

...

 
       Signal Event(ShowContent)
 
     Endroutine
 
     Mthroutine Name(ActivateTabletView)

...

 
       Signal Event(HideContent)

...

 
       #ActiveView := TABLET

...

 
       Signal Event(TabletView)

...

 
       Signal Event(ShowContent)

...

 
     Endroutine
  
     Mthroutine Name(ActivateDesktopView)

...

 
       Signal Event(HideContent)

...

 
       #ActiveView := DESKTOP

...

 
       Signal Event(DesktopView)

...

 
       Signal Event(ShowContent)
 
     Endroutine

Refer to the code generated when Using a Web Page Template for examples on how to implement designs for effective Responsive Design.