TileGrid picture size

[edulid]

I am not able to dynamically set the image size of a tilegrid. When you click the button, nothing happens. I have tried with redraw() but same result.

public void onModuleLoad() {

        VStack vStack = new VStack(20);
        vStack.setWidth100();

        final TileGrid tileGrid = new TileGrid();
        tileGrid.setTileWidth(158);
        tileGrid.setTileHeight(225);
        tileGrid.setHeight(400);
        tileGrid.setID("boundList");
        tileGrid.setCanReorderTiles(true);
        tileGrid.setShowAllRecords(true);
        tileGrid.setDataSource(AnimalXmlDS.getInstance());
        tileGrid.setAutoFetchData(false);
        tileGrid.setAnimateTileChange(true);

        DetailViewerField commonNameField = new DetailViewerField("commonName");
        commonNameField.setCellStyle("commonName");

        DetailViewerField lifeSpanField = new DetailViewerField("lifeSpan");
        lifeSpanField.setCellStyle("lifeSpan");
        lifeSpanField.setDetailFormatter(new DetailFormatter() {
            public String format(Object value, Record record, DetailViewerField field) {
                return "Lifespan: " + value;
            }
        });
        
        final DetailViewerField pictureField = new DetailViewerField("picture");  
        pictureField.setType("image");  
        pictureField.setImageWidth(20);  
        pictureField.setImageHeight(20);  
        
        IButton click = new IButton("click me");
        click.addClickHandler(new ClickHandler() {
            
            @Override
            public void onClick(ClickEvent event) {
                pictureField.setImageWidth(40);  
                pictureField.setImageHeight(40);  
            }
        });

        DetailViewerField statusField = new DetailViewerField("status");
        tileGrid.setFields(pictureField, commonNameField, lifeSpanField, statusField);

        vStack.addMember(tileGrid);

        AdvancedCriteria c = new AdvancedCriteria(OperatorId.OR,
                new Criterion[] { new Criterion("status", OperatorId.EQUALS, "Not Endangered"), new Criterion("status", OperatorId.EQUALS, "Protected"), new Criterion("status", OperatorId.EQUALS, "Threatened") });

        DSRequest request = new DSRequest();
        SortSpecifier[] sort = new SortSpecifier[1];
        sort[0] = new SortSpecifier("commonName", SortDirection.ASCENDING);
        request.setSortBy(sort);
        
        tileGrid.fetchData(c, null, request);

        HLayout hLayout = new HLayout(10);
        hLayout.setHeight(22);

        vStack.addMember(hLayout);
        vStack.addMember(click);
        
        vStack.draw();
    }

Using smartgwt 6.0-p20160408 power

[edulid]

The size changes only when the mouse goes over the tiles.

[Isomorphic]

It's invalid in general to set a property on a field you've already given to a DataBoundComponent. In this case the setting happens to almost work (on a redraw at least) but it's still not valid usage. Although it must feel like you're close to what you want with just the DetailViewer settings, you are probably better off with a custom tile (via tileConstructor) for what you appear to be doing.

Note in particular that it would be invalid also to increase the size of an individual tile, which you'd presumably want to do if you're going to increase the image size, so that's another reason to pursue a custom tile, as you'll probably want to hide some internal components and show others in order to complete this interaction.