FMX.ControlsDemo Sample

From RAD Studio Code Examples
Jump to: navigation, search

This sample illustrates the FireMonkey Controls and how to use them.

Location

You can find the Controls Sample sample project at:

Description

This sample shows how to use FireMonkey controls.

How to Use the Sample

  1. Navigate to the location given above, and open the ControlsDemo project file.
  2. Press F9 or choose Run > Run.
  3. Open different tabs, observe and try to use FireMonkey controls in each tab.

Classes

FireMonkey Controls represents the main window of the sample. It contains the following components:

Implementation

When you run the application, the main window of the sample is displayed:

  • Position the mouse pointer over the TMenuItem object named File, from the TMainMenu object, to display the File menu.
    • Select the File > Load Style command to open a browse dialog, where you can load a new .style file. The FireMonkey style files are available at C:\Users\Public\Documents\Embarcadero\Studio\17.0\Styles.
    • Select the File > Exit command to close the main window of the sample.
    • Select the Help > About command to display an animated About box (aboutboxfrm.fmx).
  • Select one of the TTabControl objects, to display the specific controls for each of the eight tabs (Standard, Additional, and so forth):
    • Standard is TabItem1. This tab shows the standard controls, such as labels, buttons, radio buttons, check box, and edit box.
      • Type some text in the TEdit object labeled Edit to change its content.
      • Clear or check the TCheckBox object.
      • Click the arrow on the TComboBox object labeled ListBoxItem to view its subitems.
      • Grab the scroll on the TTrackBar object and move it to the right.
      • Check the TCheckBox object, named MultiSelect, to be able to select more than one item from the TListBox object.
      • The TProgressBar has its BindingSource property set to ScrollBar1, so changing the value of the scroll bar automatically changes the value of the progress bar.
      • The TCalloutPanel changes the callout position according to the radio button selection.
    • Additional is TabItem4. Select the TTabItem object, named Additional, to see some additional controls.
      • Select the arrow from the TExpander object to compact and to expand the box.
      • Grab the angle point from the TArcDial angle buttons and spin it, to change the value of an angle. This changes the value of the label corresponding to the rotated angle button.
      • Use the TCalendar object to view the calendar and select a specific date. The value of the date is changed.
    • Ext Controls is TabItem5.
      • Drag an item over the TDropTarget object.
      • Type some text in the TClearingEdit object, and then press the x button to erase the text you typed.
    • TreeView and ListBox is TabItem3. This tab displays the ListBox and TreeView controls that allow you to build a list box or a tree view.
      • In the TreeView, click the arrows to expand or to compact the view. The tree view has several tree view items, displayed on three levels.
      • The list box displays list box items with different content (labels, images, paths, buttons).
      • The check box labeled as Show check boxes shows check boxes before the items in the tree view and in the list box.
    • Transformations is TabItem6. This tab displays the Rotate and Opacity controls with which you can transform objects.
      • Scroll the Rotate and Opacity TrackBar objects, and observe how the angle and the opacity of other objects are changed. (Opacity must be high in order to see the rotation changes.)
    • ScrollBox is TabItem2.
    • Memo is TabItem8. This tab displays the TMemo control that allows you to keep written notes.
    • New! is TabItem7. This tab displays some of the newer FireMonkey controls.
      • Set the corner check boxes associated with the first CornerButton, called CornerButton1, to see how they round checked corners of the button. The TrackBar4 track bar's value sets the X and Y radius for all rounded corners of all corner buttons.
      • Click the ColorComboBox to display the color wheel from which you can select a color.
      • Click the down-arrow on the ComboEdit to display the available choices.
      • Click the arrows on the TSpinBox to increment or decrement the number displayed.
      • Click the segmented corner button to see how to set the Corners property when creating a segmented corner button.
  • The Switch to 3D and back button, located below the TabControl and thus available on each tab, briefly animates the current tab as a 3D image, using TViewPort3D and TLayer3D.

Uses

See Also

Samples

Retrieved from "https://docwiki.embarcadero.com/CodeExamples/Seattle/e/index.php?title=FMX.ControlsDemo_Sample&oldid=30583"