How to change TextButton Style in Gxt 3.0

Question

I want to change style of textbutton like i want to add background image and i want to change background color using GXT 3.0

someone help me plzzz

Thanks in advance

Answer 1

GXT 3 has a cleaner way to handle these kind of requirements. You have to use Appearance API which is provided in Sencha 3. Here is the key points which is involved in this process.

• Appearance Interface, implementation and substitution
• Styling with CssResource
• Use ClientBundle to fetch css resources
• XTemplates to apply styles/properties to mark-ups

In this case what you need to do is to implement an appearance for TextButtonCell (because TextButton uses TextButtonCell as the appearance) and provide required styles using css Style resource (annotating actual .css file path as source) . For example

     public interface TextButtonResources extends ClientBundle 
     { 
            @Source("TextButton.css")
            Style style();
     } 

Then substitute the built-in TextButtonCell appearance with your one.

<replace-with class="fullyQualifiedNameToYourButtonCellAppearanceClass">
        <when-type-is class="com.sencha.gxt.cell.core.client.ButtonCell.ButtonCellAppearance" />
    </replace-with>

This blog post has a comprehensive details on this concept Ext GWT 3.0 Appearance Design