lazarus.fresnel/demo/ButtonGenerator/MainUnit.pas

unit MainUnit;

{$mode objfpc}{$H+}

interface

uses
  Classes, SysUtils, Fresnel.Forms, Fresnel.DOM, Fresnel.Controls,
  DemoSlider, DemoCheckBox;

type

  { TFresnelForm1 }

  TFresnelForm1 = class(TFresnelForm)
    procedure FresnelForm1Create(Sender: TObject);
  private
    procedure OnPropChange(Sender: TObject);
    procedure UpdateButton;
  public
    BackgroundColor1: string;
    BackgroundColor2: string;
    BorderColor: string;
    ButtonDiv: TDiv;
    ButtonLabel: TLabel;
    FontSizeSlider: TDemoSlider;
    PaddingVerticalSlider: TDemoSlider;
    GradientChkBox: TDemoCheckBox;
    BorderWidthSlider: TDemoSlider;
    BorderRadiusDiv: TDiv;
    BorderRadiusLabel: TLabel;
    BorderRadiusTopLeftChkBox: TDemoCheckBox;
    BorderRadiusTopRightChkBox: TDemoCheckBox;
    BorderRadiusBottomLeftChkBox: TDemoCheckBox;
    BorderRadiusBottomRightChkBox: TDemoCheckBox;
    BorderRadiusSlider: TDemoSlider;
    TextShadowChkBox: TDemoCheckBox;
    TextShadowVertPosSlider: TDemoSlider;
    TextShadowHorzPosSlider: TDemoSlider;
    TextShadowBlurRadiusSlider: TDemoSlider;
  end;

var
  FresnelForm1: TFresnelForm1;

implementation

{$R *.lfm}

{ TFresnelForm1 }

procedure TFresnelForm1.FresnelForm1Create(Sender: TObject);

  function AddSlider(aName, aCaption: string; aParent: TFresnelElement = nil): TDemoSlider;
  begin
    if aParent=nil then aParent:=Self;
    Result:=TDemoSlider.Create(Self);
    with Result do begin
      Name:=aName;
      Caption:=aCaption;
      ValueFormat:='%.0fpx';
      Parent:=aParent;
      OnChange:=@OnPropChange;
    end;
  end;

  function AddCheckBox(aName, aCaption: string; aParent: TFresnelElement = nil): TDemoCheckBox;
  begin
    if aParent=nil then aParent:=Self;
    Result:=TDemoCheckBox.Create(Self);
    with Result do begin
      Name:=aName;
      Caption:=aCaption;
      Checked:=true;
      Parent:=aParent;
      OnChange:=@OnPropChange;
    end;
  end;

begin
  BackgroundColor1:='#79bbff';
  BackgroundColor2:='#378de5';
  BorderColor:='#337bc4';

  Stylesheet.Add(TDemoSlider.cStyle);
  Stylesheet.Add(TDemoCheckBox.cStyle);

  Stylesheet.Add('#ButtonDiv {'
    +'background:'+BackgroundColor1+';'
    +'border:1px solid '+BorderColor+';'
    +'border-radius:16px;'
    +'padding:16px 31px;'
    +'font-size:15px; font-family:Arial; font-weight:bold;'
    +'color:#fff;'
    +'text-shadow: 1px 1px 0px #2f6627;'
    +'}'
    +'.CheckBox {'+LineEnding
    +'  margin: 6px;'+LineEnding
    +'}'+LineEnding
    +'.Slider {'+LineEnding
    +'  margin: 6px;'+LineEnding
    +'  width: 150px;'+LineEnding
    +'}'+LineEnding
    );

  // font-size slider
  FontSizeSlider:=AddSlider('FontSizeSlider','Font Size:');
  with FontSizeSlider do begin
    MinPosition:=5;
    MaxPosition:=40;
    Position:=12;
  end;

  // padding vertical slider
  PaddingVerticalSlider:=AddSlider('PaddingVerticalSlider','Vertical Padding:');
  with PaddingVerticalSlider do begin
    MinPosition:=0;
    MaxPosition:=50;
    Position:=16;
  end;

  // gradient
  GradientChkBox:=AddCheckBox('GradientChkBox','Gradient');

  // border-width slider
  BorderWidthSlider:=AddSlider('BorderWidthSlider','Border Width:');
  with BorderWidthSlider do begin
    MinPosition:=0;
    MaxPosition:=10;
    Position:=1;
  end;

  // border-radius corners: four checkboxes
  BorderRadiusDiv:=TDiv.Create(Self);
  with BorderRadiusDiv do begin
    Name:='BorderRadiusDiv';
    Style:='margin: 6px;';
    Parent:=Self;
  end;

  BorderRadiusLabel:=TLabel.Create(Self);
  with BorderRadiusLabel do begin
    Name:='BorderRadiusLabel';
    Caption:='Border Corner Radius:';
    Parent:=BorderRadiusDiv;
  end;

  BorderRadiusTopLeftChkBox:=AddCheckBox('BorderRadiusTopLeftChkBox','Top Left',BorderRadiusDiv);

  BorderRadiusTopRightChkBox:=AddCheckBox('BorderRadiusTopRightChkBox','Top Right',BorderRadiusDiv);

  BorderRadiusBottomLeftChkBox:=AddCheckBox('BorderRadiusBottomLeftChkBox','Bottom Left',BorderRadiusDiv);

  BorderRadiusBottomRightChkBox:=AddCheckBox('BorderRadiusBottomRightChkBox','Bottom Right',BorderRadiusDiv);

  // slider for border radius
  BorderRadiusSlider:=AddSlider('BorderRadiusSlider','Border Radius:');
  with BorderRadiusSlider do begin
    MinPosition:=0;
    MaxPosition:=50;
    Position:=16;
  end;

  // text-shadow checkbox
  TextShadowChkBox:=AddCheckBox('TextShadowChkBox','Text Shadow');

  // slider for text-shadow vertical position
  TextShadowVertPosSlider:=AddSlider('TextShadowVertPosSlider','Vertical Position:');
  with TextShadowVertPosSlider do begin
    MinPosition:=-30;
    MaxPosition:=30;
    Position:=1;
  end;

  // slider for text-shadow horizontal position
  TextShadowHorzPosSlider:=AddSlider('TextShadowHorzPosSlider','Horizontal Position:');
  with TextShadowHorzPosSlider do begin
    MinPosition:=-30;
    MaxPosition:=30;
    Position:=1;
  end;

  // slider for text-shadow horizontal position
  TextShadowBlurRadiusSlider:=AddSlider('TextShadowBlurRadiusSlider','Blur Radius:');
  with TextShadowBlurRadiusSlider do begin
    ValueFormat:='%.1fpx';
    MinPosition:=0;
    MaxPosition:=5;
    Position:=0;
  end;

  // the Button
  ButtonDiv:=TDiv.Create(Self);
  with ButtonDiv do begin
    Name:='ButtonDiv';
    Parent:=Self;
  end;
  ButtonLabel:=TLabel.Create(Self);
  with ButtonLabel do begin
    Name:='ButtonLabel';
    Caption:='Button Text';
    Parent:=ButtonDiv;
  end;

  UpdateButton;
end;

procedure TFresnelForm1.OnPropChange(Sender: TObject);
begin
  UpdateButton;
end;

procedure TFresnelForm1.UpdateButton;
var
  s, NewStyle, Radius: String;
begin
  if ButtonDiv=nil then exit;
  NewStyle:=
     'font-size:'+FloatToStr(FontSizeSlider.Position)+'px;'
    +'padding: '+FloatToStr(PaddingVerticalSlider.Position)+'px 31px;'
    +'border-width:'+FloatToStr(BorderWidthSlider.Position)+'px;';

  if GradientChkBox.Checked then
    NewStyle+='background-image:linear-gradient('+BackgroundColor1+','+BackgroundColor2+')';

  Radius:=FloatToStr(BorderRadiusSlider.Position)+'px';
  s:='';
  if BorderRadiusTopLeftChkBox.Checked then
    s:=Radius
  else
    s:='0';
  if BorderRadiusTopRightChkBox.Checked then
    s+=' '+Radius
  else
    s+=' 0';
  if BorderRadiusBottomLeftChkBox.Checked then
    s+=' '+Radius
  else
    s+=' 0';
  if BorderRadiusBottomRightChkBox.Checked then
    s+=' '+Radius
  else
    s+=' 0';
  NewStyle+='border-radius:'+s+';';

  s:='';
  if TextShadowChkBox.Checked then
  begin
    s:=FloatToStr(TextShadowHorzPosSlider.Position)
      +' '+FloatToStr(TextShadowVertPosSlider.Position)
      +' '+FloatToStr(TextShadowBlurRadiusSlider.Position)
      +' #2f6627';
  end;
  NewStyle+='text-shadow:'+s+';';

  ButtonDiv.Style:=NewStyle;
end;

end.