Posted on by

01 – No-Code Calculator GUI in Delphi

Intro

  • Good day, Delphi developers and other developers.
  • Welcome to Delphi Tube from Qasim Shahzad.
  • Let’s create a no-code calculator GUI in Delphi in no time. It’s possible!
  • Let’s start.

Creating the Form

  • From the File menu, select “New” and choose a Windows VCL application.
  • We’ll rename the form to “frmMain”.
  • Change the caption to “No-Code Calculator GUI In Delphi.”
  • Save the form as “frmMainU.pas”
  • For the project, use “NoCodeCalculatorGUIInDelphi”.

Adding the Edit Box

  • We need an edit box for the calculator screen.
  • Rename the edit box to “edtScreen”.
  • Set the text property to “0”
  • Align the edit box with the margins (8 pixels on all sides).
  • Align it to the top.
  • Change the font size to 18 and set the text alignment to left-justified.

Resizing the Form

  • The calculator should have a wider width than height.
  • Change the width to 300 pixels and the height to 400 pixels.
  • Center the form on the screen using the “Position” property set to “poScreenCenter.”

Applying a Style

  • Go to Project > Options > Appearance.
  • Select a custom style, like “Ruby Graphite” to improve the visual appeal.

Adding the Touch Keyboard

  • We’ll use a virtual keyboard instead of individual buttons.
  • Search for “Touch Keyboard” in the component palette and add it to the form.
  • Rename it to “tkbdCalc”.
  • Align the keyboard to the client area (all sides).
  • Add a small margin on all sides for better spacing.

Running the Application

  • Run the application to see the initial GUI with the keyboard.

Optimizing the Layout

  • The keyboard might affect the form size.
  • Set keyboard Layout to Numpad.
  • Adjust the form’s height and width back to 500 pixels each if needed.

Functionality and Conclusion

  • This video focused on creating the GUI without code.
  • Adding functionality like calculations requires event handling on the edit box key presses.
  • Briefly explain how to handle key presses (dot limitation, adding numbers, etc.).
  • The benefit is the quick creation of a visually appealing GUI.

Outro

  • Thank you for reading! Please like, subscribe, comment, and share.
Media Manager
Latest posts by Media Manager (see all)