ビューコンテナ (PRIM_MD.ViewContainer)

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

詳細

ビュー コンテナは、一緒に作動する複数のコントロールのまとまりで、一般的なモバイル・アプリケーションのフレームワークを作ります。 
通常ビュー コンテナは画面スペースの多くを専有し、必要に応じてサイズ調整します。
その他のコントロールとしては、次のようなものがあります。
アプリケーション タイトルバー: アプリケーションのヘッダーとして使用します。
アプリケーション ドロー: アプリケーション・メニューを表示するために使用されます。
アプリケーション ビュー: アプリケーション機能の表示に使用します。
アプリケーション ダイアログ: エディターとして使用します。
ナビゲーション ボタン: アプリケーション ドロー上のメニュー アイテムととして利用します。

例

以下は、様々なパーツがやり取りする様子を簡単に示したものです。 
実際のアプリケーションでは、ビューが再利用可能パーツになります。

     Begin_Com Role(*EXTENDS #PRIM_WEB) Theme(#SYS_THEME) LayoutManager(#LayoutMain) 

        Define_Com Class(#PRIM_TBLO) Name(#LayoutMain)
        Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutMainColumn1) DisplayPosition(1) Parent(#LayoutMain) Units(Content) Width(220)
        Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutMainColumn2) DisplayPosition(2) Parent(#LayoutMain)
        Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow1) DisplayPosition(1) Parent(#LayoutMain) Height(56) Units(Pixels)
        Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow2) DisplayPosition(2) Parent(#LayoutMain)
        Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem1) Column(#LayoutMainColumn1) Manage(#AppBar) Parent(#LayoutMain) Row(#LayoutMainRow1) ColumnSpan(2)
        Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem2) Column(#LayoutMainColumn1) Manage(#AppDrawer) Parent(#LayoutMain) Row(#LayoutMainRow2) Sizing(FitToHeight)
        Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem3) Column(#LayoutMainColumn2) Manage(#ViewContainer) Parent(#LayoutMain) Row(#LayoutMainRow2) 

        Define_Com Class(#PRIM_TBLO) Name(#LayoutAppDrawer)
        Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutAppDrawerColumn1) DisplayPosition(1) Parent(#LayoutAppDrawer)
        Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutAppDrawerRow1) DisplayPosition(1) Parent(#LayoutAppDrawer)
        Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutAppDrawerItem1) Alignment(TopCenter) Column(#LayoutAppDrawerColumn1) Flow(Down) Manage(#NavButton1) Parent(#LayoutAppDrawer) Row(#LayoutAppDrawerRow1) Sizing(FitToWidth)
        Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutAppDrawerItem2) Alignment(TopCenter) Column(#LayoutAppDrawerColumn1) Flow(Down) Manage(#NavButton2) Parent(#LayoutAppDrawer) Row(#LayoutAppDrawerRow1) Sizing(FitToWidth) 

        Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutAppDrawerItem3) Alignment(TopCenter) Column(#LayoutAppDrawerColumn1) Flow(Down) Manage(#NavButton3) Parent(#LayoutAppDrawer) Row(#LayoutAppDrawerRow1) Sizing(FitToWidth) 

        Define_Com Class(#PRIM_MD.AppBar) Name(#AppBar) DisplayPosition(1) Parent(#COM_OWNER) TabPosition(1) TabStop(False) Width(1200) ThemeDrawStyle('Heading1') CaptionMarginLeft(15) Caption('TITLE') CaptionMarginBottom(0) CaptionMarginRight(0) CaptionMarginTop(0) Icon('menu')
        Define_Com Class(#PRIM_MD.AppDrawer) Name(#AppDrawer) DisplayPosition(2) Parent(#COM_OWNER) TabPosition(2) TabStop(False) Top(56) Height(744) LayoutManager(#LayoutAppDrawer) ThemeDrawStyle('MediumTitle') Width(220)
        Define_Com Class(#PRIM_MD.ViewContainer) Name(#ViewContainer) DisplayPosition(3) Left(220) Parent(#COM_OWNER) TabPosition(3) TabStop(False) Top(56) Height(744) Width(980) 

        Define_Com Class(#PRIM_MD.NavButton) Name(#NavButton1) Caption('View 1') CaptionAlignment(CenterLeft) CaptionMarginLeft(16) DisplayPosition(1) IconMarginLeft(16) Left(0) Parent(#AppDrawer) TabPosition(1) TabStop(False) Top(0) Width(219) Height(48) Icon('view_quilt') Manage(#View1)
        Define_Com Class(#PRIM_MD.NavButton) Name(#NavButton2) Caption('View 2') CaptionAlignment(CenterLeft) CaptionMarginLeft(16) DisplayPosition(2) IconMarginLeft(16) Left(0) Parent(#AppDrawer) TabPosition(3) TabStop(False) Top(48) Width(219) Height(48) Icon('view_quilt') Manage(#View2)
        Define_Com Class(#PRIM_MD.NavButton) Name(#NavButton3) Caption('View 3') CaptionAlignment(CenterLeft) CaptionMarginLeft(16) DisplayPosition(3) IconMarginLeft(16) Left(0) Parent(#AppDrawer) TabPosition(2) TabStop(False) Top(96) Width(219) Height(48) Icon('view_quilt') Manage(#View3) 

        * Views
        Define_Com Class(#PRIM_View) Name(#View1) Height(744) Parent(#ViewContainer) TabStop(False) Width(980) DisplayPosition(1) TabPosition(1)
        Define_Com Class(#PRIM_View) Name(#View2) Height(744) Left(326) Parent(#ViewContainer) TabStop(False) Width(980) DisplayPosition(2) TabPosition(2)
        Define_Com Class(#PRIM_View) Name(#View3) Height(744) Parent(#ViewContainer) TabStop(False) Width(980) Left(652) DisplayPosition(3) TabPosition(3) 

        Define_Com Class(#prim_md.Label) Name(#View1Text) Caption('View 1') Parent(#View1) DisplayPosition(1) TabPosition(1)
        Define_Com Class(#prim_md.Label) Name(#View2Text) Caption('View 2') Parent(#View2) DisplayPosition(1) TabPosition(1)
        Define_Com Class(#prim_md.Label) Name(#View3Text) Caption('View 3') Parent(#View3) DisplayPosition(1) TabPosition(1) 

        Evtroutine Handling(#AppBar.IconClick) 

           #AppDrawer.ToggleDrawer 

        Endroutine 

        Evtroutine Handling(#Sys_Web.DeviceChanged) 

           If (#Sys_Web.Device = Mobile) 

              #AppDrawer.DrawerStyle := SlideInLeft 

           Else 

              #AppDrawer.DrawerStyle := Permanent 

           Endif 

        Endroutine 

     End_Com

プロパティ

イベント

メソッド

参照

すべてのコンポーネント クラス
テクニカル リファレンス