Using a Modal Form

The following steps describe how to create a simple modal form using Version 2.2 Beta 5 of Smart Mobile Studio.

  1. Start a new Visual Components Project and save the project as "SimpleModalForm".
  2. Add a new form named Form2 by clicking on the second icon in the Project Manager and clicking on OK to accept the default name.
  3. Add a panel then a label and a button on top of the panel.
  4. Change the caption of the label to "Modal Form" and the caption of the button to "OK".
  5. Double click on the button and enter the code for its click procedure in the editor:
    Application.HideModal(mrOK);
  6. Return to the design view of Form1, add a button, change its caption to "Modal Form" and enter the code for its click procedure in the editor:
    Application.ShowModal('Form2', 'W3Panel1', '');
  7. Execute the application and press the button on each form to test the navigation.

See below a trimmed-down project file that will compile with Version 3.0 of Smart Mobile Studio.

<SMART>
  <Project version="3" subversion="0">
    <Name>SimpleModalForm</Name>
    <Options>
      <Compiler />
      <Codegen>
        <Obfuscation>1</Obfuscation>
        <InlineMagics>1</InlineMagics>
        <Devirtualize>1</Devirtualize>
        <MainBody>1</MainBody>
        <CodePacking>1</CodePacking>
        <SmartLinking>1</SmartLinking>
        <Verbosity>1</Verbosity>
      </Codegen>
      <ConditionalDefines />
      <Linker>
        <ExternalCSS>1</ExternalCSS>
        <Theme>iOS.css</Theme>
        <CustomTheme>0</CustomTheme>
        <EmbedJavaScript>1</EmbedJavaScript>
      </Linker>
      <Output>
        <JavaScriptFileName>main.js</JavaScriptFileName>
        <HtmlFileName>SimpleModalForm.html</HtmlFileName>
        <OutputFilePath>www\</OutputFilePath>
      </Output>
      <Import />
      <Execute>
        <Server>1</Server>
        <ExecuteType>0</ExecuteType>
      </Execute>
    </Options>
    <Files>
      <File type="main">
        <Name>SimpleModalForm</Name>
        <Source>
          <![CDATA[uses SmartCL.System, Unit1, Form2;

{$IFDEF SMART_INTERNAL_HANDLE_EXCEPTIONS}
try
{$ENDIF}
  var Application := TApplication.Create;
  Application.RunApp;
{$IFDEF SMART_INTERNAL_HANDLE_EXCEPTIONS}
except
  on e: Exception do
    ShowMessage(e.Message);
end;
{$ENDIF}
]]>
        </Source>
      </File>
      <File type="unit">
        <Name>Unit1</Name>
        <Source>
          <![CDATA[unit Unit1;

interface

uses
  Pseudo.CreateForms, // auto-generated unit that creates forms during startup
  System.Types, SmartCL.System, SmartCL.Components, SmartCL.Forms, 
  SmartCL.Application, Form1;

type
  TApplication  = class(TW3CustomApplication)
  end;

implementation

end.]]>
        </Source>
      </File>
      <File type="form">
        <Name>Form1</Name>
        <Source>
          <![CDATA[unit Form1;

interface

uses 
  SmartCL.System, SmartCL.Graphics, SmartCL.Components, SmartCL.Forms, 
  SmartCL.Fonts, SmartCL.Borders, SmartCL.Application, SmartCL.Controls.Button;

type
  TForm1 = class(TW3Form)
    procedure W3Button1Click(Sender: TObject);
  private
    {$I 'Form1:intf'}
  protected
    procedure InitializeObject; override;
  end;

implementation

procedure TForm1.W3Button1Click(Sender: TObject);
begin
  Application.ShowModal('Form2', 'W3Panel1', '');
end;

procedure TForm1.InitializeObject;
begin
  inherited;
  {$I 'Form1:impl'}
end;
 
initialization
  Forms.RegisterForm({$I %FILE%}, TForm1);
end.]]>
        </Source>
        <Design>
          <![CDATA[<?xml version="1.0" encoding="utf-16"?>
<Form version="3" subversion="0">
  <object type="TW3Form">
    <Caption>W3Form</Caption>
    <Name>Form1</Name>
    <object type="TW3Button">
      <Caption>Show Modal</Caption>
      <Width>214</Width>
      <Top>96</Top>
      <Left>128</Left>
      <Height>118</Height>
      <Name>W3Button1</Name>
      <OnClick>W3Button1Click</OnClick>
    </object>
  </object>
</Form>]]>
        </Design>
        <AutoCreate>
          <IsAutoCreate>1</IsAutoCreate>
          <IsMainForm>1</IsMainForm>
          <Order>1</Order>
        </AutoCreate>
      </File>
      <File type="form">
        <Name>Form2</Name>
        <Source>
          <![CDATA[unit Form2;

interface

uses 
  System.Types, SmartCL.System, SmartCL.Graphics, SmartCL.Components, SmartCL.Forms,
  SmartCL.Fonts, SmartCL.Borders, SmartCL.Application, SmartCL.Controls.Panel,
  SmartCL.Controls.Label, SmartCL.Controls.Button;

type
  TForm2 = class(TW3Form)
    procedure W3Button1Click(Sender: TObject);
  private
    {$I 'Form2:intf'}
  protected
    procedure InitializeObject; override;
  end;

implementation

procedure TForm2.W3Button1Click(Sender: TObject);
begin
  Application.HideModal(mrOK);
end;

procedure TForm2.InitializeObject;
begin
  inherited;
  {$I 'Form2:impl'}
end;
 
initialization
  Forms.RegisterForm({$I %FILE%}, TForm2);
end.
]]>
        </Source>
        <Design>
          <![CDATA[<?xml version="1.0" encoding="utf-16"?>
<Form version="3" subversion="0">
  <object type="TW3Form">
    <Caption>W3Form</Caption>
    <Name>Form2</Name>
    <object type="TW3Panel">
      <Width>453</Width>
      <Top>128</Top>
      <Left>160</Left>
      <Height>356</Height>
      <Name>W3Panel1</Name>
      <object type="TW3Label">
        <Caption>Modal Form</Caption>
        <Width>125</Width>
        <Top>88</Top>
        <Left>96</Left>
        <Height>43</Height>
        <Name>W3Label1</Name>
      </object>
      <object type="TW3Button">
        <Caption>OK</Caption>
        <Width>224</Width>
        <Top>168</Top>
        <Left>32</Left>
        <Height>76</Height>
        <Name>W3Button1</Name>
        <OnClick>W3Button1Click</OnClick>
      </object>
    </object>
  </object>
</Form>]]>
        </Design>
        <AutoCreate>
          <IsAutoCreate>1</IsAutoCreate>
          <IsMainForm>0</IsMainForm>
          <Order>2</Order>
        </AutoCreate>
      </File>
    </Files>
    <Target>Browser</Target>
    <Generator>Visual Components Project</Generator>
  </Project>
</SMART>
Programming - a skill for life!

How to use several forms (including a modal form)