Multi-Platform Data Bound Radio Button Example

Embarcadero

vor 2 Jahren

Radio button data binding multi platform

The Update Radio Button Demo is the perfect way to keep your data table up-to-date. Using Live Bindings, this demo cross-platform application automatically updates your in-memory data table whenever a radio button changes. With support for Android, iOS, macOS, Windows, and Linux, you can build a single code base that looks and feels great on any platform.

Download the full cross-platform radio button data binding source code on Github.

This demo is part of over 100 cross-platform demos with everything from camera demos to emoji demos and painting demos.

Inhaltsverzeichnis

What is a radio button control in software development?

A radio button is a type of graphical user interface (GUI) element that allows the user to choose one option from a group of mutually exclusive options. The radio button control consists of a round button that can be selected or deselected. When the user selects an option, the button becomes “filled” or “checked.” Radio buttons are typically used when there are a limited number of choices to be made, such as choosing a gender or selecting a answer to a yes-or-no question. In software development, radio buttons are often used in preference over other types of GUI elements, such as checkboxes, because they take up less screen space and can be easier for the user to understand.

Screenshot

What does the data bound radio button demo source code look like?

unit Unit1;

interface

uses
  System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,
  FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs,
  FireDAC.Stan.Intf, FireDAC.Stan.Option, FireDAC.Stan.Param,
  FireDAC.Stan.Error, FireDAC.DatS, FireDAC.Phys.Intf, FireDAC.DApt.Intf,
  FireDAC.Stan.StorageBin, Data.Bind.EngExt, Fmx.Bind.DBEngExt, System.Rtti,
  System.Bindings.Outputs, Fmx.Bind.Editors, FMX.StdCtrls, FMX.Layouts,
  Data.Bind.Components, Data.Bind.DBScope, Data.DB,
  FireDAC.Comp.DataSet, FireDAC.Comp.Client, FMX.Effects,
  FMX.Controls.Presentation;

type
  TForm1 = class(TForm)
    MaterialOxfordBlueSB: TStyleBook;
    ToolBar1: TToolBar;
    ShadowEffect4: TShadowEffect;
    Label1: TLabel;
    Label2: TLabel;
<strong>    FDMemTable1: TFDMemTable;
    BindSourceDB1: TBindSourceDB;
    BindingsList1: TBindingsList;
    LinkPropertyToFieldText: TLinkPropertyToField;
</strong>    Layout1: TLayout;<strong>
    RadioButton1: TRadioButton;
    RadioButton2: TRadioButton;
    RadioButton3: TRadioButton;
    LinkPropertyToFieldIsChecked: TLinkPropertyToField;
    LinkPropertyToFieldIsChecked2: TLinkPropertyToField;
    LinkPropertyToFieldIsChecked3: TLinkPropertyToField;
    procedure RadioButton1Click(Sender: TObject);</strong>
  private
    { Private declarations }
  public
    { Public declarations }
  end;

var
  Form1: TForm1;

implementation

{$R *.fmx}

<strong>procedure TForm1.RadioButton1Click(Sender: TObject);
begin
  if Sender=RadioButton1 then
    begin
       if not TRadioButton(Sender).IsChecked then
         begin
           FDMemTable1.Edit;
           FDMemTable1.FieldByName('Value').AsString := 'Delphi';
           FDMemTable1.Post;
         end;
    end
  else if Sender=RadioButton2 then
    begin
       if not TRadioButton(Sender).IsChecked then
         begin
           FDMemTable1.Edit;
           FDMemTable1.FieldByName('Value').AsString := 'Is';
           FDMemTable1.Post;
         end;
    end
  else if Sender=RadioButton3 then
    begin
       if not TRadioButton(Sender).IsChecked then
         begin
           FDMemTable1.Edit;
           FDMemTable1.FieldByName('Value').AsString := 'Awesome';
           FDMemTable1.Post;
         end;
    end;
end;</strong>

end.

unit Unit1;

interface

uses

System.SysUtils, System.Types, System.UITypes, System.Klassen, System.Variants,

FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs,

FireDAC.Stan.Intf, FireDAC.Stan.Option, FireDAC.Stan.Param,

FireDAC.Stan.Error, FireDAC.DatS, FireDAC.Phys.Intf, FireDAC.DApt.Intf,

FireDAC.Stan.StorageBin, Data.Bind.EngExt, Fmx.Bind.DBEngExt, System.Rtti,

System.Bindings.Outputs, Fmx.Bind.Editors, FMX.StdCtrls, FMX.Layouts,

Data.Bind.Komponenten, Data.Bind.DBScope, Data.DB,

FireDAC.Comp.DataSet, FireDAC.Comp.Client, FMX.Effects,

FMX.Controls.Presentation;

type

TForm1 = Klasse(TForm)

MaterialOxfordBlueSB: TStyleBook;

ToolBar1: TToolBar;

ShadowEffect4: TShadowEffect;

Label1: TLabel;

Label2: TLabel;

FDMemTable1: TFDMemTable;

BindSourceDB1: TBindSourceDB;

BindingsList1: TBindingsList;

LinkPropertyToFieldText: TLinkPropertyToField;

Layout1: TLayout;

RadioButton1: TRadioButton;

RadioButton2: TRadioButton;

RadioButton3: TRadioButton;

LinkPropertyToFieldIsChecked: TLinkPropertyToField;

LinkPropertyToFieldIsChecked2: TLinkPropertyToField;

LinkPropertyToFieldIsChecked3: TLinkPropertyToField;

procedure RadioButton1Click(Sender: TObject);

private

{ Private declarations }

public

{ Public declarations }

end;

var

Form1: TForm1;

implementation

{$R *.fmx}

procedure TForm1.RadioButton1Click(Sender: TObject);

Start

if Sender=RadioButton1 then

Start

if nicht TRadioButton(Sender).IsChecked then

Start

FDMemTable1.Edit;

FDMemTable1.FieldByName('Value').AsString := 'Delphi';

FDMemTable1.Post;

end;

end

sonst if Sender=RadioButton2 then

Start

if nicht TRadioButton(Sender).IsChecked then

Start

FDMemTable1.Edit;

FDMemTable1.FieldByName('Value').AsString := 'Is';

FDMemTable1.Post;

end;

end

sonst if Sender=RadioButton3 then

Start

if nicht TRadioButton(Sender).IsChecked then

Start

FDMemTable1.Edit;

FDMemTable1.FieldByName('Value').AsString := 'Awesome';

FDMemTable1.Post;

end;

end;

end.

What does the Form component data binding objects look like for the demo?

  object BindSourceDB1: TBindSourceDB
    DataSet = FDMemTable1
    ScopeMappings = &lt;&gt;
    Left = 144
    Top = 224
  end
  object BindingsList1: TBindingsList
    Methods = &lt;&gt;
    OutputConverters = &lt;&gt;
    Left = 20
    Top = 5
    object LinkPropertyToFieldText: TLinkPropertyToField
      Category = 'Quick Bindings'
      DataSource = BindSourceDB1
      FieldName = 'Value'
      Component = Label2
      ComponentProperty = 'Text'
    end
    object LinkPropertyToFieldIsChecked: TLinkPropertyToField
      Category = 'Quick Bindings'
      DataSource = BindSourceDB1
      FieldName = 'Value'
      Component = RadioButton1
<strong>      CustomFormat = 'IfThen(ToStr(%s)="Delphi",True, False)'</strong>
      ComponentProperty = 'IsChecked'
    end
    object LinkPropertyToFieldIsChecked2: TLinkPropertyToField
      Category = 'Quick Bindings'
      DataSource = BindSourceDB1
      FieldName = 'Value'
      Component = RadioButton2
<strong>      CustomFormat = 'IfThen(ToStr(%s)="Is",True, False)'</strong>
      ComponentProperty = 'IsChecked'
    end
    object LinkPropertyToFieldIsChecked3: TLinkPropertyToField
      Category = 'Quick Bindings'
      DataSource = BindSourceDB1
      FieldName = 'Value'
      Component = RadioButton3
<strong>      CustomFormat = 'IfThen(ToStr(%s)="Awesome",True, False)'</strong>
      ComponentProperty = 'IsChecked'
    end
  end

object BindSourceDB1: TBindSourceDB

DataSet = FDMemTable1

ScopeMappings = <>

Left = 144

Top = 224

end

object BindingsList1: TBindingsList

Methods = <>

OutputConverters = <>

Left = 20

Top = 5

object LinkPropertyToFieldText: TLinkPropertyToField

Category = 'Quick Bindings'

DataSource = BindSourceDB1

FieldName = 'Value'

Component = Label2

ComponentProperty = 'Text'

end

object LinkPropertyToFieldIsChecked: TLinkPropertyToField

Category = 'Quick Bindings'

DataSource = BindSourceDB1

FieldName = 'Value'

Component = RadioButton1

CustomFormat = 'IfThen(ToStr(%s)="Delphi",True, False)'

ComponentProperty = 'IsChecked'

end

object LinkPropertyToFieldIsChecked2: TLinkPropertyToField

Category = 'Quick Bindings'

DataSource = BindSourceDB1

FieldName = 'Value'

Component = RadioButton2

CustomFormat = 'IfThen(ToStr(%s)="Is",True, False)'

ComponentProperty = 'IsChecked'

end

object LinkPropertyToFieldIsChecked3: TLinkPropertyToField

Category = 'Quick Bindings'

DataSource = BindSourceDB1

FieldName = 'Value'

Component = RadioButton3

CustomFormat = 'IfThen(ToStr(%s)="Awesome",True, False)'

ComponentProperty = 'IsChecked'

end

What does the data bindings through LiveBindings look like?

Ready to learn how to program cross-platform apps like this?

Sign up for the Coding Boot Camp 2022 to learn to program. Topics include: Games, JavaScript, Web, Python, SQL, Databases, iOS, MacOS, Android, Mobile, Linux, Windows, Desktop, Server, and Arduino.