Jump to content

Recommended Posts

I am wanting to make a wizard web application where each wizard page is designed in a frame/form similar to a TFrame in Delphi, and there is a master form which is a run-time container for the wizard pages. I would like the form to be embedded at run-time in a div much similar to TFrame in Delphi. I would like to control the loading frame content in code.

I want to have each page in a separate form and pas file to keep my code tidy and modular.

The master page would have banners and Previous / Next buttons on it.

Could you please advise how I might go about achieving this in SmartMobileStudio?

Link to post
Share on other sites
  • Moderators

Probably the easiest way is to define your master form on TW3Display and your 'TFrames' as regular TW3Forms on TW3DisplayView

The code below is from an old project and was based on one of the featured demos, forget which one. 

This method allows what you ask : 'embedded at run-time', 'control content in code', 'page in separate form and pas file' and 'buttons etc on master page'

unit Unit1;

interface

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

type
  TApplication  = class(TW3CustomApplication)
  private
    FHeader: TW3Panel;
    FLogo01: TW3Image;
  public
    procedure ApplicationStarting; override;
  end;

implementation

procedure TApplication.ApplicationStarting;
var
  mForm: TW3CustomForm;
  myclientwidth, myclientheight:integer;
begin
  asm
    @myclientwidth = screen.width;
    @myclientheight = screen.height;
  end;

  FHeader:=TW3Panel.create(display);                         //<=======================
  FHeader.Color := clWhite;
  FHeader.SetBounds(0, 0, myclientwidth, 85);
  FHeader.StyleClass := 'none';

  FLogo01:=TW3Image.Create(FHeader);
  FLogo01.LoadFromURL('res/logo.png');
  FLogo01.SetBounds(0, 0, 194, 45);
//

  mForm := TForm1.Create(display.view);                      //<======================= 
  mForm.name := 'Form1';
  RegisterFormInstance(mForm, True);

  mForm := TForm2.Create(display.view);                      //<======================= 
  mForm.name := 'Form2';
  RegisterFormInstance(mForm, False);


end;

end.


 

 

Link to post
Share on other sites
  • Administrators

Yeah, what @lynkfs writes is one way of doing that. Basically you use the display for the next/prev -buttons and then just change forms normally with GotoForm.

You can also do this inside a form or basically any control you want:

subform := TWizardForm1.Create(Panel1);

So basically, you don't need to register the forms as in @lynkfs example and you can even create many instances of the same form. I am taking advantage of that in the next update to the TTabControl where you can build tabs by using forms.

Link to post
Share on other sites

@Jared, Try this......  a mixture of eveyones ideas and code  :)

unit Unit1;

interface

uses
  Pseudo.CreateForms, // auto-generated unit that creates forms during startup
  System.Colors, System.Types, SmartCL.System, SmartCL.Components, SmartCL.Forms,
  SmartCL.Application, SmartCL.Layout, SmartCL.Controls.Label, SmartCL.Controls.Panel, SmartCL.Controls.Button;

const
 MAXFORMCOUNT = 4;

type
  TApplication  = class(TW3CustomApplication)
   private
    fCurrent: integer;
    fLayout: TLayout;
    fHeader: TW3Label;
    fBody: TW3Panel;
    fNext: TW3Button;
    fPrev: TW3Button;
    procedure handleResize(sender: TObject);
    procedure handlePrevClick(sender: TObject);
    procedure handleNextClick(sender: TObject);
  public
    procedure ApplicationStarting; override;
  end;

implementation

uses Form1, Form2, Form3, Form4;

procedure TApplication.handlePrevClick(sender: TObject);
begin
 if fCurrent <> 1 then
 begin
  dec(fCurrent);
  fHeader.Caption:= 'Form ' + intToStr(fCurrent);
  Application.GotoForm('Form' + intToStr(fCurrent));
 end;
end;

procedure TApplication.handleNextClick(sender: TObject);
begin
 if fCurrent <> MAXFORMCOUNT then
 begin
  inc(fCurrent);
  fHeader.Caption:= 'Form ' + intToStr(fCurrent);
  Application.GotoForm('Form' + intToStr(fCurrent));
 end;

end;

procedure TApplication.handleResize(sender: Tobject);
begin
  fLayout:= Layout.Client(
                          [
                           Layout.Top(Layout.Height(50), fHeader),
                           Layout.Bottom(Layout.Height(32), Layout.Left(Layout.Stretch, [fPrev, fNext])),
                           Layout.Client(fBody)
                          ]
                          );
   if Assigned(fLayout) then
   begin
    fLayout.Resize(display);
   end;
end;

procedure TApplication.ApplicationStarting;
var
  mForm: TW3CustomForm;
begin
  display.OnResize:= handleResize;

  FHeader:=TW3Label.create(display);
  fHeader.Color:= clWhite;
  fHeader.AlignText:= taCenter;
  fHeader.Caption:= 'Form 1';
  FHeader.Height:= 50;

  fBody:= TW3Panel.Create(display);

  fPrev:= TW3Button.Create(display);
  fPrev.Caption:= 'Prev';
  fPrev.OnClick:= HandlePrevClick;

  fNext:= TW3Button.Create(display);
  fNext.Caption:= 'Next';
  fNext.OnClick:= HandleNextClick;

  mForm := TForm1.Create(fBody);
  mForm.name := 'Form1';
  RegisterFormInstance(mForm, True);

  mForm := TForm2.Create(fBody);
  mForm.name := 'Form2';
  RegisterFormInstance(mForm, False);

  mForm := TForm3.Create(fBody);
  mForm.name := 'Form3';
  RegisterFormInstance(mForm, True);

  mForm := TForm4.Create(fBody);
  mForm.name := 'Form4';
  RegisterFormInstance(mForm, False);

  fCurrent:= 1;

end;

end.

 

If you dont want to use Layout, just use SetBounds on each control to lay them out explicitly

 

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...