The Menu Image Buttons plugin creates buttons in a grid pattern. You can choose the number of buttons per row and the margin between buttons. The plugin calculates the buttons size and evenly spaces the buttons on the screen. There is an optional header image.

Note: For Android only, the ability to use images on a URL does not work. The images must be in the project. This problem will be repaired in future updates.

This plugin only works for Buzztouch 3.0 and higher projects.

With this plugin you can choose from one button per row to as many buttons per row that can fit on a screen. When you rotate the plugin from portrait to landscape, the number of buttons automatically doubles. When you choose the number of buttons and the margin, the plugin calculates the button size so that you have evenly spaced buttons in a grid pattern.

This plugin includes all of the header image features available in the Menu with Image plugin, including the ability to choose from three sizes for the header image, the ability to set the opacity of the header image the ability to set a different background color for the header image.

The text on this plugin is centered inside of the button. You can have 2 lines of text on a button. There is no option to place text underneath the button.

Android developers: In order for the header image to fit correctly, it is necessary to drag the extra layout-sw600dp folder into the project under res. Also, many large screen Android smartphones fit the Buzztouch definition of a large screen, so if you want a different number of buttons per row you can change the definition of what is a large device on line 289 of BT_device.java. I recommend changing it to around 800. See this wikipedia article to guide your decision on the width setting in your project. http://en.wikipedia.org/wiki/Comparison_of_Android_devices


iOS Project Files
------------------------
WB_menuImageButtons.m and .h
WB_button_view .m and .h

Android Project Files
------------------------
wb_menuimagebuttons.xml
layout-sw600dp/wb_menuimagebuttons.xml (This is an extra folder you must drag into the project yourself. See instructions above.)

WB_menuImageButtons.java

Version History
-----------------

v1.0 Plugin released
v1.1 Corrected default header opacity to 1.0 in iOS.
v1.2 Repaired header image and button placement when iPad is opened in Landscape
v1.3 Corrected iOS so that all the buttons would display when scrolled. Corrected iOS so that header images can be used on a URL.

JSON Data
------------------------

If you manually enter the screen data, the JSON data for this item in the BT_config.txt
includes a child items array holding individual BT_items. Each item represents a button.

{
"itemId": "0A25D426DCB536D41B7858E",
"itemType": "WB_menuImageButtons",
"itemNickname": "My Screen Nickname",
"navBarTitleText": "My Nav Bar Name",
"imageFileName": "mycoolimage.png",
"headerImageSize": "Medium",
"headerBackgroundColor": "clear",
"alphaImage": "1.0",
"buttonNumberSmallDevice": "2",
"buttonPaddingSmallDevice": "10",
"buttonCornerRadiusSmallDevice": "5",
"buttonLabelFontSizeSmallDevice": "120",
"buttonNumberLargeDevice": "4",
"buttonPaddingLargeDevice": "10",
"buttonCornerRadiusLargeDevice": "5",
"buttonLabelFontSizeLargeDevice": "120",
"buttonLabelFontColor": "#FFFFFF",
"buttonOpacity": "99"
"childItems":[
          {
           "itemId": "44B82F330A0D29195DB2386",
           "itemType": "BT_menuItem",
           "loadScreenWithItemId": "8f3f94ab6295ca44d5ef93b",
           "titleText": "A",
           "buttonBackgroundColor": "#0099FF"
          },
          {
          "itemId": "44B82F330A0D29195DB2386",
           "itemType": "BT_menuItem",
           "loadScreenWithItemId": "8f3f94ab6295ca44d5ef93b",
           "titleText": "A",
           "buttonBackgroundColor": "#0099FF"
          }
     ]
}