onyx.IconButton will not display with onyx.Toolbar, FittableColumnsLayout

I'm trying to use onyx.Toolbar to create a simple header using iconbuttons, and the fittable columns layout so that everything displays nicely. When I don't apply a layoutKind to the Toolbar, the iconbuttons will display, but everything is pushed off to the left side (as expected).

Here's the code:
{kind: "onyx.Toolbar", components: [
	{kind: "onyx.IconButton", ontap: "buttonTap", src: "assets/menu-icon.png"},
	{tag: "span", content: "App Name", style:"font-weight: bold"},
	{kind: "onyx.IconButton", ontap: "buttonTap", src: "assets/refresh.png"}
When I add in a layoutKind: "FittableColumnsLayout" to the toolbar, the iconbuttons no longer render.

If instead, I use buttons that contain icons, like so:
{kind: "onyx.Toolbar", layoutKind: "FittableColumnsLayout", components: [
	{kind: "onyx.Button", ontap: "buttonTap", style: "height:48px", components: [
		{kind: "onyx.Icon", src: "assets/menu-icon.png"}
	{tag: "span", content: "App Name", style:"font-weight: bold; text-align: center", fit:true},
	{kind: "onyx.Button", ontap: "buttonTap", style: "height:48px", components: [
		{kind: "onyx.Icon", src: "assets/refresh.png"}
Things render as expected, but I'm stuck with the larger button + icon, which I don't want. I'm not sure if I'm missing something dumb, or if this is some sort of rendering bug.

I'm using Enyo 2.4/Firefox 29.0.1/Mac OS X 10.6 if it makes any difference. Also, the test icons that I'm using are 32x32 and do not contain inactive states, if that makes any difference to the renderer. They display correctly and disappear as expected without the layoutkind applied.


Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!