Button menu's present a list of buttons to the user. Selecting an option loads
another screen. Buttons menus are one of the most flexible screens types and
can be configured in lots of different ways. The buttons in the list can come
from the screens configuration data or a remote file hosted on a backend
server. Hosting the items on a remote server allows for dynamic changes.
This
shows the format of a remote file of buttons items.
{"itemId":"99999",
"itemType":"BT_screen_menuButtons",
"itemNickname":"Button Menu",
"navBarTitleText":"Select One",
"dataURL":"http://mywebsite.com/buttonItems.php"}
|
Item Id *
|
"itemId":"a unique id"
A unique number or string identifiying this item from all other items in the
configuration file.
|
|
Item Type *
|
"itemType":"BT_screen_menuButtons"
Used by the mobile app to determine what type of item to create.
|
|
Item Nickname *
|
"itemNickname":"A unique nickname"
The nickname of the item in the buzztouch control panel.
|
|
Child Items
|
"childItems":[Array of Button Items]
An array of Child Item JSON objects representing each button.
Do not use a childItems array if the screen pulls it's buttons from a dataURL.
|
|
Data URL
|
"dataURL":"http://www.mysite.com/buttonItems.php"
A URL pointing to a file containing an
array of Child Item JSON objects representing each button.
Do not use a dataURL if the screen uses a childItems array.
|
|
Status Bar Style *
|
"statusBarStyle":"default"
Options: default, solid, transparent, hidden.
|
|
Navigation Bar Title
|
"navBarTitleText":"The Screen Title"
The title text that shows in the navigation bar.
|
|
Navigation Bar Style *
|
"navBarStyle":"solid"
Options: solid, transparent, hidden.
|
|
Navigation Bar Color *
|
"navBarBackgroundColor":"#000000"
Hexidecimal color.
|
|
Left Button Text
|
"navBarBackButtonText":"Back"
Keep this short.
|
|
Right Button Type
|
"navBarRightButtonType":"infoLight"
Omit this property or leave the value blank for no right button.
Options: home, next, infoLight, infoDark, details, done, cancel, save, add, addBlue, compose,
reply, action, organize, bookmark, search, refresh, camera, trash, play, pause, stop, rewind,
fastForward
This property sets the image's type, it does not determine what happens when the button is tapped.
The Right Button Load Screen is what determines what happens when the button is tapped.
|
|
Right Button Load Screen
|
"navBarRightButtonTapLoadScreenItemId":"Another screen itemId"
OR
"navBarRightButtonTapLoadScreenNickname":"Another screen nickname"
OR
"navBarRightButtonTapLoadScreenObject":{a JSON sreen object}
The itemId, or the nickname, or the the JSON data for a screen or menu or feature.
Only one of these three properties will be used.
Keywords: Set the navBarRightButtonTapLoadScreenItemId to "back", "home" or
"showAudioControls" for special behaviors. These option will not load a screen but will
perform the action associated with the keyword.
|
|
Right Button Transition Type
|
"navBarRightButtonTapTransitionType":"flip"
Leave this blank for devices default transition. Or, use one of
these values: fade, flip, curl, grow, slideUp, slideDown.
|
|
Hide Bottom Tab Bar
|
"hideBottomTabBarWhenScreenLoads":"0"
Options: 0 or 1 where 1 = yes. This property is ignored when this screen is set as the home screen for
a tab or if the app does not use a tabbed layout.
|
|
Buttons Layout Style *
|
"buttonLayoutStyle":"grid"
Options: grid, verticalLeft, verticalRight, horizontalTop, horizontalBottom.
Default is grid.
|
|
Buttons Label Layout Style *
|
"buttonLabelLayoutStyle":"bottom"
Options: above, top, middle, bottom, below.
Default is below. Set to "middle" to prevent extra space needed for button labels.
|
|
Buttons Label Font Color *
|
"buttonLabelFontColor":"#000000"
Hexidecimal color.
|
|
Buttons Background Color *
|
"buttonBackgroundColor":"#000000"
Hexidecimal color.
|
|
Buttons Apply Drop Shadow *
|
"buttonDropShadow":"0"
Options: 0 or 1. Zero is "no, do not use apply drop shadow."
Default is 0.
|
|
Buttons Drop Shadow Color *
|
"buttonShadowColor":"#000000"
Hexidecimal color.
|
|
Buttons Transparency *
|
"buttonOpacity":"100"
Numeric 1 - 100. 1 is totally transparent.
|
|
Buttons Corner Radius Small Device *
|
"buttonCornerRadiusSmallDevice":"5"
Numeric. Default is 5.
|
|
Buttons Corner Radius Large Device *
|
"buttonCornerRadiusLargeDevice":"10"
Numeric. Default is 10.
|
|
Buttons Icon Color *
|
"buttonsUseWhiteIcons":"0"
Numeric. 0 or 1. Icons in project have a matching white version. Settings this to 1
allows you to use white icons on dark background colors.
|
|
Buttons Size Small Device *
|
"buttonSizeSmallDevice":"60"
Numeric. Buttons are square with this height / width. Default is 60.
|
|
Buttons Size Large Device *
|
"buttonSizeLargeDevice":"60"
Numeric. Buttons are square with this height / width. Default is 60.
|
|
Buttons Padding Small Device *
|
"buttonPaddingSmallDevice":"15"
Numeric. The amount of space between each button. Default is 15.
|
|
Buttons Padding Large Device *
|
"buttonPaddingLargeDevice":"15"
Numeric. The amount of space between each button. Default is 15.
|
|
Buttons Label Font Size Small Device *
|
"buttonLabelFontSizeSmallDevice":"13"
Numeric. The size of the font if a label is used. Default is 13.
|
|
Buttons Label Font Size Large Device *
|
"buttonLabelFontSizeLargeDevice":"13"
Numeric. The size of the font if a label is used. Default is 13.
|
|
Prevent Scrolling *
|
"preventAllScrolling":"0"
Options: 0 or 1 where 1 = yes.
|
|
Background Color *
|
"backgroundColor":"#000000"
Hexidecimal color or a keyword: "clear" or "stripes" (do not enter quotes).
|
|
Background Color Transparency *
|
"backgroundColorOpacity":"100"
Numeric Value: 1 - 100, 1 is totally transparent.
|
|
Background Color Gradient Top *
|
"backgroundColorGradientTop":"#000000"
Hexidecimal color. Background gradients flow top-to-bottom and are placed "on-top"
of a possible background color.
|
|
Background Color Gradient Bottom *
|
"backgroundColorGradientTop":"#FFFFFF"
Hexidecimal color. Background gradients flow top-to-bottom and are placed "on-top"
of a possible background color.
|
|
Background Image Small Device *
|
"backgroundImageNameSmallDevice":"background-small.png"
OR
"backgroundImageURLSmallDevice":"URL to background-small.png"
The file name of the image added to the project or the URL to the image.
Background images are placed "on-top" of possible background colors.
Use an image name OR a URL, not both.
|
|
Background Image Large Device *
|
"backgroundImageNameLargeDevice":"background-large.png"
OR
"backgroundImageURLLargeDevice":"URL to background-large.png"
The file name of the image added to the project or the URL to the image.
Background images are placed "on-top" of possible background colors.
Use an image name OR a URL, not both.
|
|
Background Image Transparency *
|
"backgroundImageOpacity":"100"
Number: 1 - 100, 1 is totally transparent.
|
|
Background Image Scale *
|
"backgroundImageScale":"center"
Options: center, fullScreen, fullScreenPreserve, top, bottom, topLeft, topRight,
bottomLeft, bottomRight.
|
|
Login Required
|
"loginRequired":"0"
Options: 0 or 1 where 1 = yes.
App must implement a Login screen.
|
|
Hide From Search
|
"hideFromSearch":"0"
Options: 0 or 1 where 1 = yes.
Hides from search results if the
app implements a Search Menu screen.
|