クロスプラットフォームポップアップメニューボタンサンプル

エンバカデロ

2年前

The Popup Menu Button is a cross-platform application that allows you to define a hamburger menu button in a toolbar and have a scrollable menu pop up over the rest of the app interface. This is a great way to keep your app organized and simplify navigation for your users. The Popup Menu Button is built in Delphi using a single code base and single UI, so it works seamlessly on Android, iOS, macOS, Windows, and Linux. With its easy-to-use interface and powerful features, the Popup Menu Button can be the perfect solution for your menu needs.

Download the full cross-platform Popup Menu Button Demo source code on Github.

このデモは、カメラデモ、絵文字デモ、ペイントデモなど、100以上のクロスプラットフォームデモの一部です。

What is a popup menu in software development?

A popup menu is a type of menu that is triggered by an event such as a button press or a mouse click. Popup menus are often used in GUI applications to provide context-sensitive options to the user. For example, a popup menu might be used to display a list of options when the user right-clicks on an object. Popup menus can also be used in command-line applications, though they are less common in this type of application. In general, popup menus provide a convenient way for users to access frequently used options without having to navigate through a menu hierarchy.

画面ショット

What does the popup menu 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, FMX.StdCtrls,
  FMX.MultiView, FMX.Effects, FMX.Controls.Presentation, FMX.ListView.Types,
  FMX.ListView.Appearances, FMX.ListView.Adapters.Base, Data.Bind.GenData,
  System.Rtti, System.Bindings.Outputs, Fmx.Bind.Editors, Data.Bind.EngExt,
  Fmx.Bind.DBEngExt, Data.Bind.Components, Data.Bind.ObjectScope, FMX.ListView;

type
  TForm1 = class(TForm)
    MaterialOxfordBlueSB: TStyleBook;
    ToolBar1: TToolBar;
    ShadowEffect4: TShadowEffect;
    Label1: TLabel;
<strong>    MultiView1: TMultiView;
    Button1: TButto</strong>n;
    ListView1: TListView;
    PrototypeBindSource1: TPrototypeBindSource;
    BindingsList1: TBindingsList;
    LinkFillControlToField1: TLinkFillControlToField;
  private
    { Private declarations }
  public
    { Public declarations }
  end;

var
  Form1: TForm1;

implementation

{$R *.fmx}

end.

unit Unit1;

interface

uses

System.SysUtils, System.Types, System.UITypes, System.クラス, System.Variants,

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

FMX.MultiView, FMX.Effects, FMX.Controls.Presentation, FMX.ListView.Types,

FMX.ListView.Appearances, FMX.ListView.Adapters.Base, Data.Bind.GenData,

System.Rtti, System.Bindings.Outputs, Fmx.Bind.Editors, Data.Bind.EngExt,

Fmx.Bind.DBEngExt, Data.Bind.Components, Data.Bind.ObjectScope, FMX.ListView;

type

TForm1 = class(TForm)

MaterialOxfordBlueSB: TStyleBook;

ToolBar1: TToolBar;

ShadowEffect4: TShadowEffect;

Label1: TLabel;

<strong> MultiView1: TMultiView;

Button1: TButto</strong>n;

ListView1: TListView;

PrototypeBindSource1: TPrototypeBindSource;

BindingsList1: TBindingsList;

LinkFillControlToField1: TLinkFillControlToField;

private

{ Private declarations }

public

{ Public declarations }

end;

var

Form1: TForm1;

implementation

{$R *.fmx}

end.

What do the Form element objects look like?

&#91;...]
    object Button1: TButton
      Align = Right
      Position.X = 260.000000000000000000
      Size.Width = 64.000000000000000000
      Size.Height = 48.000000000000000000
      Size.PlatformDefault = False
      StyleLookup = 'drawertoolbuttonbordered'
      TabOrder = 2
      Text = 'Button1'
    end
  end
<strong>  object MultiView1: TMultiView
    MasterButton = Button1
    Mode = Popover</strong>
    Size.Width = 250.000000000000000000
    Size.Height = 400.000000000000000000
    Size.PlatformDefault = False
    Visible = False
    TabOrder = 2
    object ListView1: TListView
      ItemAppearanceClassName = 'TListItemAppearance'
      ItemEditAppearanceClassName = 'TListItemShowCheckAppearance'
      HeaderAppearanceClassName = 'TListHeaderObjects'
      FooterAppearanceClassName = 'TListHeaderObjects'
      Align = Client
      Size.Width = 250.000000000000000000
      Size.Height = 400.000000000000000000
      Size.PlatformDefault = False
      TabOrder = 0
    end
  end

[...]

object Button1: TButton

Align = Right

Position.X = 260.000000000000000000

Size.Width = 64.000000000000000000

Size.Height = 48.000000000000000000

Size.PlatformDefault = False

StyleLookup = 'drawertoolbuttonbordered'

TabOrder = 2

Text = 'Button1'

end

<strong> object MultiView1: TMultiView

MasterButton = Button1

Mode = Popover</strong>

Size.Width = 250.000000000000000000

Size.Height = 400.000000000000000000

Size.PlatformDefault = False

Visible = False

TabOrder = 2

object ListView1: TListView

ItemAppearanceClassName = 'TListItemAppearance'

ItemEditAppearanceClassName = 'TListItemShowCheckAppearance'

HeaderAppearanceClassName = 'TListHeaderObjects'

FooterAppearanceClassName = 'TListHeaderObjects'

Align = Client

Size.Width = 250.000000000000000000

Size.Height = 400.000000000000000000

Size.PlatformDefault = False

TabOrder = 0

end

クロスプラットフォームアプリのプログラミング手法を学ぶには

今すぐ Coding Boot Camp 2022に登録してください。ゲーム、JavaScript、Web、Python、SQL、データベース、iOS、MacOS、Android、モバイル、Linux、Windows、デスクトップ、サーバー、Arduinoなど、プログラミングに関するさまざまなトピックを学ぶことができます。