Navigation Button

Navigation Button (PRIM_MD.NavButton)

Button used by an App Drawer to show a view

Ancestors - Flat Button (PRIM_MD.FlatButton) Control (PRIM_MD.Control) Control (PRIM_CTRL) Object (PRIM_OBJT)

Details

ナビゲーション ボタンとは、一緒に作動する複数のコントロールのまとまりのことで、一般的なモバイル・アプリケーションのフレームワークを作ります。
 
通常、ナビゲーション ボタンは、アプリケーション描画のメニュー アイテムととして利用されます。クリックにより、ボタンに関連付けられたビューがManage プロパティ経由で表示されます。
 
その他のコントロールとしては、次のようなものがあります。
 
アプリケーション タイトルバー: アプリケーションのヘッダーとして使用します。
 
アプリケーション ドロー: アプリケーション・メニューを表示するために使用されます。
 
アプリケーション ビュー: アプリケーション機能の表示に使用します。
 
アプリケーション ダイアログ: エディターとして使用します。
 
ビューコンテナ: アプリケーション内の複数のビューの管理・整理に使用します。

例

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

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

Properties

Name	Description
BusyUpdates	BusyUpdates specifies how the control updates itself Inherited from Control (PRIM_CTRL)
BusyUpdatesOfParent	BusyUpdatesOfParent specifies whether the parent controls updates Inherited from Control (PRIM_CTRL)
ButtonCancel	Set to true to fire the click event when the escape key is pressed Inherited from Flat Button (PRIM_MD.FlatButton)
ButtonDefault	Set to true to fire the click event when the enter key is pressed Inherited from Flat Button (PRIM_MD.FlatButton)
CanFocus	CanFocus returns a value indicating whether the control can receive keyboard focus Inherited from Control (PRIM_CTRL)
Caption	Text to be displayed within the control Inherited from Flat Button (PRIM_MD.FlatButton)
CaptionAlignment	Position of the caption within the control Inherited from Flat Button (PRIM_MD.FlatButton)
CaptionMarginBottom	Bottom margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
CaptionMarginLeft	Left margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
CaptionMarginRight	Right margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
CaptionMarginTop	Top margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
ComponentClassName	ComponentClassName is the name of the component's class.Inherited from Object (PRIM_OBJT)
ComponentMembers	ComponentMembers provides access to all the member components of this component Inherited from Object (PRIM_OBJT)
ComponentPatternName	ComponentPatternName is used to qualify the class of the component.Inherited from Object (PRIM_OBJT)
ComponentTag	Generic space allowing a value to be stored for the instance Inherited from Object (PRIM_OBJT)
ComponentType	ComponentType gives you access to the type information about the component Inherited from Object (PRIM_OBJT)
ComponentTypeName	ComponentTypeName is the fully qualified name of the component's class.Inherited from Object (PRIM_OBJT)
Cursor	Cursor sets the cursor image Inherited from Control (PRIM_CTRL)
DisplayPosition	DisplayPosition determines the order in which components are shown Inherited from Control (PRIM_CTRL)
DragStyle	DragStyle determines how a component can be dragged Inherited from Control (PRIM_CTRL)
Ellipses	Show ellipses for truncated text Inherited from Flat Button (PRIM_MD.FlatButton)
Enabled	Enable activates/deactivates the component Inherited from Control (PRIM_CTRL)
FixedPosition	Fix the control position so that it does not move if the parent is scrolled Inherited from Control (PRIM_CTRL)
Focus	Focus tells whether the component has focus Inherited from Control (PRIM_CTRL)
FocusedStyle	Reference to a style to be applied when the control is focus Inherited from Control (PRIM_CTRL)
FocusedStyles	Collection of styles to be applied when the control is focus Inherited from Control (PRIM_CTRL)
Handle	Returns the Windows handle in desktop applications Inherited from Control (PRIM_CTRL)
Height	The height of the control in pixels Inherited from Control (PRIM_CTRL)
Hint	Caption displayed when the mouse hovers over the control Inherited from Control (PRIM_CTRL)
HintPopup	HintPopup allows a PopupPanel instance to be used instead of the default hint text box Inherited from Control (PRIM_CTRL)
HintShow	Enabled or disable the appearance of hints Inherited from Control (PRIM_CTRL)
HintShowOfParent	Delegate hints appearance to the parent control Inherited from Control (PRIM_CTRL)
HintTitle	HintTitle defines the text shown at the top of the hint window in emphasized text Inherited from Control (PRIM_CTRL)
Icon	Image displayed within the button Inherited from Flat Button (PRIM_MD.FlatButton)
IconAlignment	Position of the icon within the control Inherited from Flat Button (PRIM_MD.FlatButton)
IconColor	Color to be applied to the icon Inherited from Flat Button (PRIM_MD.FlatButton)
IconHeight	Height of the icon in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
IconImage	Repository image to show on the control Inherited from Flat Button (PRIM_MD.FlatButton)
IconImageSizing	Specifies the sizing behaviour of the IconImage Inherited from Flat Button (PRIM_MD.FlatButton)
IconMarginBottom	Bottom margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
IconMarginLeft	Left margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
IconMarginRight	Right margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
IconMarginTop	Top margin in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
IconOpacity	Percentage opacity of the icon Inherited from Flat Button (PRIM_MD.FlatButton)
IconThemeDrawStyle	Name of the Theme DrawStyle to be applied to the icon Inherited from Flat Button (PRIM_MD.FlatButton)
IsAnimating	IsAnimating indicates that a control is currently being animated Inherited from Control (PRIM_CTRL)
IsRealized	True if the control is currently realized Inherited from Control (PRIM_CTRL)
Left	Position of the control relative to the left boundary of its parent Inherited from Control (PRIM_CTRL)
Manage	Reference to the view managed by the button
Modified	Modified indicates that the contents of the component have changed Inherited from Control (PRIM_CTRL)
MouseOver	MouseOver determines whether the mouse is directly over a control Inherited from Control (PRIM_CTRL)
MouseOverStyle	MouseOverStyle defines the style to be applied to a control when the mouse is over it Inherited from Control (PRIM_CTRL)
MouseOverStyles	MouseOverStyles is a collection of styles to be applied to a control when the mouse is over it Inherited from Control (PRIM_CTRL)
Name	Name identifies the component Inherited from Object (PRIM_OBJT)
Opacity	Opacity denotes the appearance of a control in terms of its interaction with its background Inherited from Control (PRIM_CTRL)
Owner	Owner owns this component Inherited from Object (PRIM_OBJT)
PaddingBottom	Bottom padding in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
PaddingLeft	Left padding in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
PaddingRight	Right padding in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
PaddingTop	Top padding in pixels Inherited from Flat Button (PRIM_MD.FlatButton)
Parent	Reference to the control in which this control is visually positioned Inherited from Control (PRIM_CTRL)
Popup	Popup allows a PopupPanel instance to be used instead of the typical right click popup menu Inherited from Control (PRIM_CTRL)
PopupMenu	Reference to a PopupMenu to be shown on a right click Inherited from Control (PRIM_CTRL)
Rotation	Rotation allows a control to rotate a number of degrees about a given origin Inherited from Control (PRIM_CTRL)
RotationOriginLeft	RotationOriginLeft defines the left coordinate of an imaginary point around which a control will rotate Inherited from Control (PRIM_CTRL)
RotationOriginTop	RotationOriginTop defines the top coordinate of an imaginary point around which a control will rotate Inherited from Control (PRIM_CTRL)
ScaleHeight	ScaleHeight is the percentage of the height to use in the visual appearance of a control Inherited from Control (PRIM_CTRL)
ScaleOriginLeft	ScaleOriginLeft defines the left coordinate of an imaginary point from which a control will scale Inherited from Control (PRIM_CTRL)
ScaleOriginTop	ScaleOriginTop defines the top coordinate of an imaginary point from which a control will scale Inherited from Control (PRIM_CTRL)
ScaleWidth	ScaleWidth is the percentage of the width to use in the visual appearance of a control Inherited from Control (PRIM_CTRL)
ScreenLeft	ScreenLeft sets the distance from the left of the screen Inherited from Control (PRIM_CTRL)
ScreenTop	ScreenTop sets the distance from the top of the screen Inherited from Control (PRIM_CTRL)
ScrollLeft	Left position of a horizontally scrolled child control relative to its parent control Inherited from Control (PRIM_CTRL)
ScrollTop	Top position of a vertically scrolled child control relative to its parent control Inherited from Control (PRIM_CTRL)
SkewLeft	SkewLeft defines the angle at which to skew the control horizontally Inherited from Control (PRIM_CTRL)
SkewOriginLeft	SkewOriginLeft defines the left coordinate of an imaginary point from which a control will skew Inherited from Control (PRIM_CTRL)
SkewOriginTop	SkewOriginTop defines the top coordinate of an imaginary point from which a control will skew Inherited from Control (PRIM_CTRL)
SkewTop	SkewTop defines the angle at which to skew the control vertically Inherited from Control (PRIM_CTRL)
Style	Style defines the style to be applied to a control Inherited from Control (PRIM_CTRL)
Styles	Collection of styles to be applied to the control Inherited from Control (PRIM_CTRL)
TabPosition	TabPosition sets the order of focus when the Tab key is used Inherited from Control (PRIM_CTRL)
TabStop	Set to false to stop focus being given to the control via the Tab key Inherited from Control (PRIM_CTRL)
ThemeBackground	Background theme to be used Inherited from Control (PRIM_MD.Control)
ThemeDrawStyle	Name of the Theme DrawStyle to be applied to the control Inherited from Control (PRIM_CTRL)
Top	Position of the control relative to the top boundary of its parent Inherited from Control (PRIM_CTRL)
TouchMove	Determines how the control will respond to touch move processing Inherited from Control (PRIM_CTRL)
TouchRotate	Determines how the control will respond to touch rotation Inherited from Control (PRIM_CTRL)
TouchScale	Determines how the control will respond to touch scaling Inherited from Control (PRIM_CTRL)
TouchSize	Determines whether a control can be resized Inherited from Control (PRIM_CTRL)
Visible	Show or hide the control Inherited from Control (PRIM_CTRL)
VisualStyle	VisualStyle sets the appearance Inherited from Control (PRIM_CTRL)
VisualStyleOfParent	Adopt the Visual style from the parent control Inherited from Control (PRIM_CTRL)
Width	Width of the component in pixels Inherited from Control (PRIM_CTRL)
WordWrap	Wrap text on to the next line if there is insufficient space Inherited from Flat Button (PRIM_MD.FlatButton)

Events

Name	Description
AnimationEnded	Fired when an animation is ended Inherited from Flat Button (PRIM_MD.FlatButton) Cancelled
Click	Fired when the mouse is clicked on the control Inherited from Flat Button (PRIM_MD.FlatButton) Origin, Handled
CreateInstance	CreateInstance is signalled when an instance of a component is created Inherited from Flat Button (PRIM_MD.FlatButton)
DestroyInstance	DestroyInstance is signalled when an instance of a component is about to be destroyed Inherited from Flat Button (PRIM_MD.FlatButton)
DragDrop	Fired on mouse up to signify the end of a drag process Inherited from Flat Button (PRIM_MD.FlatButton) PosX, PosY, Source, Payload, AggregatedSource, Origin, Handled, DragResult
DragOver	Fired during the drag and drop process when the cursor moves over the control Inherited from Flat Button (PRIM_MD.FlatButton) PosX, PosY, Source, Payload, DragState, AcceptDrop, DragCursor, ShowDropHilight, AggregatedSource, Origin, Handled
EndDrag	Fired when the drag and drop process has completed Inherited from Flat Button (PRIM_MD.FlatButton) Source, Payload, DragResult, AggregatedSource, Origin, Handled
Initialize	Fired after a component has been realized for the first time Inherited from Flat Button (PRIM_MD.FlatButton)
MouseEnter	The mouse has entered the bounds of the control Inherited from Flat Button (PRIM_MD.FlatButton)
MouseHover	The mouse has hovered over the control Inherited from Flat Button (PRIM_MD.FlatButton) Origin, Handled
MouseLeave	The mouse has left the bounds of the control Inherited from Flat Button (PRIM_MD.FlatButton)
StartDrag	Fired when the user starts a drag and drop process Inherited from Flat Button (PRIM_MD.FlatButton) Source, Payload, Continue, DragList, AggregatedSource, Origin, Handled
TouchChange	Fired repeatedly between the TouchStart and TouchEnd boundaries to provide details of the touch events Inherited from Flat Button (PRIM_MD.FlatButton) MoveLeft, MoveTop, ScaleWidth, ScaleHeight, Rotation, Continue
TouchEnd	Fired when the user stops touching the screen Inherited from Flat Button (PRIM_MD.FlatButton)
TouchStart	Fired when the user first makes physical contact with the screen Inherited from Flat Button (PRIM_MD.FlatButton) Origin, TouchMove, TouchRotate, TouchScale, TouchSize

Methods

Name	Description
FadeIn	Animate from invisible to visible Inherited from Control (PRIM_CTRL) Duration, Delay
FadeOut	Animate from visible to invisible Inherited from Control (PRIM_CTRL) Duration, Delay, Visible
MoveFrom	Move a control from the specified position to the current position Inherited from Control (PRIM_CTRL) Left, Top, Duration, Delay
MoveTo	Animate a move from the specified number of pixels Inherited from Control (PRIM_CTRL) Left, Top, Duration, Delay
Realize	Creates the visual portion of dynamically created controls Inherited from Control (PRIM_CTRL)
Scale	Animate a change of scale Inherited from Control (PRIM_CTRL) ScaleWidth, ScaleHeight, Duration, Delay
SetFocus	Sets the control to be the focus control Inherited from Control (PRIM_CTRL)
ShowMessages	LANSA Internal Use Inherited from Control (PRIM_CTRL)
Unrealize	Destroys the visual portion of dynamically created controls Inherited from Control (PRIM_CTRL)
UpdateDisplay	UpdateDisplay updates the display immediately Inherited from Control (PRIM_CTRL)

Details

例

Properties

Events

Methods

See also