ポップアップ

祖先 - パネル (PRIM_PANL) コンテナ (PRIM_CPST) コントロール (PRIM_CTRL) オブジェクト (PRIM_OBJT)

詳細

ポップアップパネルは、 Control のPopup や HintPopup プロパティを介して、代わるものとして Popup Menu もしくは Hint に主に使用されています。
 
Thay は、 MenuBar の子アイテムとして追加することもでき、フリーフォーマットエリアを提供し、非常に柔軟なメニュー表示を可能にします。
 
通常のコンテキストメニューやシンプルなラベルの代わりに、ポップアップパネルをデザインして、必要な方法でデータを表示することができます。さらに、メニューやヒントとは異なり、ポップアップパネルにフォーカスを当てることができるので、単純なメニューやヒントよりもフォームに似ています。
 
ただしフォームとは異なり、 AutoClose プロパティが True の場合、バックグラウンドでクリックするとポップアップが閉じます。
 
ポップアップは、ブラウザアプリケーションに最適なシンプルなダイアログとしても使用できます。

例

この例では、設定イメージは HintPopup を使用しています。ポップアップを表示するには、画像の上でホバーします。

Begin_Com Role(*EXTENDS #PRIM_WEB) Height(456) Width(864) Layoutmanager(#TableLayout1)
 
   Define_Com Class(#PRIM_VS.Style) Name(#Style1) Backgroundbrush(#Brush1)
   Define_Com Class(#PRIM_VS.SolidBrush) Name(#Brush1) Color(255:137:12)
 
   Define_Com Class(#PRIM_VS.Style) Name(#Style2) Backgroundbrush(#Brush2)
   Define_Com Class(#PRIM_VS.SolidBrush) Name(#Brush2) Color(240:240:240)
 
   Define_Com Class(#PRIM_VS.Style) Name(#Style3) Fontsize(14)
 
   Define_Com Class(#PRIM_TBLO) Name(#TableLayout1)
   Define_Com Class(#PRIM_TBLO.Column) Name(#Column1) Displayposition(1) Parent(#TableLayout1)
   Define_Com Class(#PRIM_TBLO.Row) Name(#Row1) Displayposition(1) Parent(#TableLayout1)
   Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutItem2) Column(#Column1) Manage(#Settings) Parent(#TableLayout1) Row(#Row1) Sizing(None) Alignment(TopRight) Margintop(8) Marginright(8)
 
   Define_Com Class(#PRIM_PPNL) Name(#PopupSettings) Closebutton(True) Displayposition(1) Left(232) Parent(#COM_OWNER) Tabposition(1) Tabstop(False) Top(104) Height(197) Autoclose(False) Width(340) Style(#Style2)
   Define_Com Class(#PRIM_IMAG) Name(#Settings) Displayposition(2) Height(64) Image(#xDWImageSettings64) Left(792) Parent(#COM_OWNER) Tabposition(2) Tabstop(False) Top(8) Width(64) Hintpopup(#PopupSettings)
   Define_Com Class(#PRIM_LABL) Name(#Label1) Displayposition(2) Ellipses(Word) Height(33) Left(48) Parent(#PopupSettings) Tabposition(3) Tabstop(False) Top(8) Verticalalignment(Center) Width(281) Style(#Style3) Caption('Settings')
   Define_Com Class(#PRIM_LABL) Name(#Label2) Caption('Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum') Displayposition(4) Ellipses(Word) Height(145) Left(8) Parent(#PopupSettings) Tabposition(4) Tabstop(False) Top(40) Width(329)
   Define_Com Class(#PRIM_IMAG) Name(#Settings1) Displayposition(3) Height(32) Image(#xDWImageSettings64) Left(8) Parent(#PopupSettings) Tabposition(2) Tabstop(False) Top(8) Width(32) Hintpopup(#PopupSettings) Imagesizing(BestFit)
 
 End_Com
 

次の例では、ユーザーIDとパスワードが求めるサインオンのボタンがポップアップとして右上に表示されます。
 
このボタンをクリックするとダイアログが表示されます。
 
背景にはShroudStyleが適用されています。

Begin_Com Role(*EXTENDS #PRIM_WEB) Height(456) Width(864) Layoutmanager(#TableLayout1)
 
   Define_Com Class(#PRIM_VS.Style) Name(#Style1) Backgroundbrush(#Brush1)
   Define_Com Class(#PRIM_VS.SolidBrush) Name(#Brush1) Color(28:28:28) Opacity(30)
 
   Define_Com Class(#PRIM_TBLO) Name(#TableLayout1)
   Define_Com Class(#PRIM_TBLO.Column) Name(#Column1) Displayposition(1) Parent(#TableLayout1)
   Define_Com Class(#PRIM_TBLO.Row) Name(#Row1) Displayposition(1) Parent(#TableLayout1)
   Define_Com Class(#PRIM_TBLO.Item) Name(#Button1Item1) Alignment(TopRight) Column(#Column1) Manage(#Signin) Parent(#TableLayout1) Row(#Row1) Sizing(None) Margintop(8) Marginright(8)
   Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutItem1) Column(#Column1) Manage(#PopupSignin) Parent(#TableLayout1) Row(#Row1) Sizing(None)
 
   Define_Com Class(#PRIM_PHBN) Name(#Signin) Caption('Signin') Displayposition(1) Left(776) Parent(#COM_OWNER) Tabposition(1) Top(8)
   Define_Com Class(#PRIM_PPNL) Name(#PopupSignin) Closebutton(True) Displayposition(2) Left(292) Parent(#COM_OWNER) Tabposition(2) Tabstop(False) Titlebar(True) Top(156) Height(145) Autoclose(False) Shroudstyle(#Style1)
   Define_Com Class(#PRIM_PHBN) Name(#OK) Caption('OK') Displayposition(2) Left(192) Parent(#PopupSignin) Tabposition(2) Top(112)
   Define_Com Class(#PRIM_EDIT) Name(#Edit1) Displayposition(3) Left(8) Parent(#PopupSignin) Showselection(False) Showselectionhilight(False) Tabposition(3) Top(40) Width(265) Placeholder('User ID')
   Define_Com Class(#PRIM_EDIT) Name(#Edit2) Displayposition(4) Left(8) Parent(#PopupSignin) Showselection(False) Showselectionhilight(False) Tabposition(4) Top(72) Width(265) Passwordchar('*') Placeholder('Password')
 
   Evtroutine Handling(#Signin.Click)
 
      #PopupSignin.ShowPopup
 
 Endroutine
 
 End_Com
 

プロパティ

イベント

メソッド

参照

すべてのコンポーネント クラス

テクニカルリファレンス

EPC150060 - December 2023