Creating Forms on Mobile Device at Runtime
For creating Forms on the mobile device :
You need to do the following things :-
1. First of all create panels and then place the controls that you want to place inside that panel
2. If you want the controls to be generated at runtime ( eg, suppose you have a Dto that contains different fields and you want the controls to be generated on your mobile device depending upon the fields inside that Dto )
switch (oField.FieldType.Title.ToLower())
{
case FieldType.DATETIME:
{
string Id = oField.FieldTitle;
pnlControlHolder.Controls.Add(GetTextBoxForDate(Id, left + labelWidth + 5, (top + (Height + 5) * rowCount), Height, ControlWidth));
controlCount++;
break;
}
case FieldType.TEXTBOX:
{
string Id = oField.FieldTitle;
pnlControlHolder.Controls.Add(GetTextBox(Id, left + labelWidth + 5, (top + (Height + 5) * rowCount), Height, ControlWidth));
controlCount++;
break;
}
case FieldType.TEXTAREA:
{
string Id = oField.FieldTitle;
pnlControlHolder.Controls.Add(GetTextArea(Id, left + labelWidth + 5, top + (Height + 5) * rowCount, Height, ControlWidth));
rowCount += 2;
controlCount++;
break;
}
case FieldType.DROPDOWNLIST:
{
string Id = oField.FieldTitle;
pnlControlHolder.Controls.Add(GetComboBox(Id, left + labelWidth + 5, top + (Height + 5) * rowCount, Height, ControlWidth, oField.FormFieldOptions));
controlCount++;
break;
}
case FieldType.RADIOBUTTON:
{
Int32 rdbPnlHeight = (25 * (ScreenHeight / DefaultScreenHeight));
int leftPosition = left;
Panel pnlRadioButtonHolder = new Panel();
string Id = “rdbPnl1_” + controlId;
pnlRadioButtonHolder.Name = Id;
pnlRadioButtonHolder.Visible = true;
pnlRadioButtonHolder.BringToFront();
pnlRadioButtonHolder.Location = new Point(leftPosition + labelWidth + 5, top + (Height + 5) * rowCount);
pnlRadioButtonHolder.Size = new Size(ControlWidth, rdbPnlHeight * oField.FormFieldOptions.Count);
pnlControlHolder.Controls.Add(pnlRadioButtonHolder);
int rbCount = 0;
foreach (var option in oField.FormFieldOptions)
{
var rdbButton = GetRadioButton(option.OptionTitle, 0, Height * rbCount, Height, ControlWidth);
rdbButton.Parent = pnlRadioButtonHolder;
pnlRadioButtonHolder.Controls.Add(rdbButton);
rbCount++;
rowCount++;
}
rowCount -= 1;
controlCount++;
break;
}
case FieldType.CHECKBOX:
{
string Id = oField.FieldTitle;
pnlControlHolder.Controls.Add(GetCheckBox(Id, left + labelWidth + 5, top + (Height + 5) * rowCount, Height, ControlWidth));
controlCount++;
break;
}
}
The following code will genrate the controls on the mobile device depending upon the type of field in the Dto.This code will generate Labels,TextBoxes,TextAreas,ComboBox,CheckBox,DateTimePicker and RadioButtons.The Radio Buttons will be placed in a sub-panel which is inside the main panel. The functions that will be used to create the controls basically creates an object of the corresponding control, set properties for that control and than return it back to the calling function. This way a new control will be added to the panel. You can also set an upper bound on the number of controls that will be displayed inside the Form and the rest of the controls will be added to a new panel.
This is how you can design controls on the mobile form at run time.