1

I want to use an icon image like in TourDeJewel, but when I use this code then the text "MENU" is showing instead of icon picture. (sdk 0.9.6)

    <j:IconButton >
        <j:icon>
            <js:FontIcon text="menu" material="true"/>
        </j:icon>
    </j:IconButton>

After check with browser inspector tool then material-icons css is missing

Could someone tell me why ? Thank you in advance...

Fred
  • 399
  • 3
  • 12

1 Answers1

0

To get the CSS linked automatically you need to use MaterialIconType class at least one time so compiler can process it.

The reason is that class has an inject_html directive in its constructor so when the compiler finds it includes it automatically.

In Tour De Jewel we use that class through binding:

<j:IconButton click="drawer.isOpen ? drawer.close() : drawer.open()">
    <j:icon>
        <js:FontIcon text="{MaterialIconType.MENU}" material="true"/>
    </j:icon>
</j:IconButton>

(Note in that file we use a binding bead at top level to make the binding work (i.e: <js:ContainerDataBinding/>).

If you don't want to use MaterialIconType you can link it manually using a custom html template.

Carlos Rovira
  • 507
  • 2
  • 11