Force scroller to recalculate height

[Derroy]

Hello,

I have a container with scrollable: vertical as configuration.
After i update some labels, not all the text fits in the screen (so scrollable vertical)
However, when scrolling down it scrolls back up because it didn't resize after setting the label's text.

i tried : this.fireEvent('heightchange'); and a couple more but to no effect. It doesn't want to recalculate. (this = Container);

Is there a way to force the scroller to recalculate the height of the content?

[Derroy]

updateWithMovie:   function(r) {
this.down('#film_detail_duration_text').setHtml(r.get('Length'));
        this.down('#film_detail_title').setHtml(r.get('Title'));
        this.down('#film_detail_genre').setHtml(r.get('Genre').join(', '));
this.down('#film_detail_description').setHtml(r.get('Description'));
this.down('#film_detail_directing').setHtml(r.get('Director'));
        this.down('#film_detail_cast').setHtml(r.get('Cast').join(', '));
        this.fireEvent('heightchange');
//get the scroller
        console.log(this.getScrollable().getScroller());
        this.getScrollable().getScroller().refreshMaxPosition();
        this.getScrollable().getScroller().refresh();
    }

Anything along this line doesn't work either!! help

[Derroy]

Bump! Really need an awnser for this as the deadline is coming near and I can't seem to fix the problem! I've even tried creating a new scroll.Scroller but that didn't help either

I've also seen similar threads on the internet unawnsered.. is it even possible? I'll post my code here anyway

Ext.define('KTS.view.shared.Shared_film_detail', {    extend:     'Ext.Container',
    xtype:      'shared_film_detail',
    
    config: {
        layout: 'vbox',
        cls:    'film_detail',
        scrollable: 'vertical',
        flex:   1,
        items:  [
            {
                xtype:  'container',
                itemId:    'film_detail_top_container',
                layout: 'hbox',
                flex:   2,
                items:  [
                    {
                        xtype:  'image',
                        itemId: 'film_detail_poster',
                        style:  '-webkit-box-ordinal-group: 1;',
                        flex:   7,
                        listeners:  {
                            tap:    function() {
                                this.up('shared_film_detail').fireEvent('poster_tapped', this.up('shared_film_detail'),this );
                            }
                        }
                    },
                    {
                        xtype:  'container',
                        flex:   2,
                        style:  '-webkit-box-ordinal-group: 2;',
                        layout: 'vbox',
                        items:  [
                            {
                                xtype:  'image',
                                src:    'css/images/FilmtijdIcon.svg',
                                style:  'background-position:   bottom center; background-size: 50%;',
                                flex:   1,
                            },
                            {
                                xtype:  'label',
                                style:  'text-align:    center',
                                itemId: 'film_detail_duration_text',
                            },
                            {
                                xtype:  'image',
                                id:     'film_detail_trailer_btn',
                                src:    'css/images/FilmtrailerIcon.svg',
                                style:  'background-position:   bottom center; background-size: 50%;',
                                flex:   1,
                            },
                            {
                                xtype:  'label',
                                style:  'text-align:    center',
                                html:   __.FILM_DETAIL_TRAILER,
                            },
                            {
                                
                            }
                        ]
                    }
                ]
            },
            {
                xtype:  'container',
                layout: 'vbox',
                flex:   1,
                items:  [
                    {
                        xtype:  'label',
                        itemId: 'film_detail_title',
                        cls:    'film_detail_title'
                    },
                    {
                        xtype:  'label',
                        itemId: 'film_detail_genre',
                        cls:    'film_detail_subtitle'
                    },
                    {
                        xtype:  'label',
                        itemId: 'film_detail_description',
                        cls:    'film_detail_text'
                    },
                    {
                        xtype:  'label',
                        cls:    'film_detail_subtitle',
                        html:   __.FILM_DETAIL_DIRECTING,
                    },
                    {
                        xtype:  'label',
                        itemId: 'film_detail_directing',
                        cls:    'film_detail_text'
                    },
                    {
                        xtype:  'label',
                        cls:    'film_detail_subtitle',
                        html:   __.FILM_DETAIL_CAST
                    },
                    {
                        xtype:  'label',
                        itemId: 'film_detail_cast',
                        cls:    'film_detail_text'
                    },
                ]
            }
        ]
    }, 
    onOrientationChange:    function(orientation) {
        if(orientation == 'portrait') {
this.down('#film_detail_top_container').show();
        } else if(orientation == 'landscape') {
this.down('#film_detail_top_container').hide();
        }
    },
    updateWithMovie:   function(r) {
        this.setRecord(r);
//A whole lot to do for changing images.. damn you sencha
        var poster = this.down('#film_detail_poster');
        var config = poster.getInitialConfig();
        config.src = r.get('ImageUrl');
        this.down('#film_detail_top_container').remove(poster, true);
        poster = new Ext.Img(config);
        this.down('#film_detail_top_container').add(poster);
        
//Set other information
this.down('#film_detail_duration_text').setHtml(r.get('Length'));
        this.down('#film_detail_title').setHtml(r.get('Title'));
        this.down('#film_detail_genre').setHtml(r.get('Genre').join(', '));
this.down('#film_detail_description').setHtml(r.get('Description'));
this.down('#film_detail_directing').setHtml(r.get('Director'));
        this.down('#film_detail_cast').setHtml(r.get('Cast').join(', '));
//get the scroller
        
        this.getScrollable().getScroller().refreshMaxPosition();
        this.getScrollable().getScroller().refresh();
        this.getScrollable().getScroller().fireEvent('maxpositionchange', this.getScrollable().getScroller());
    }
});

[Derroy]

Ok solved: - Flexing the containers and wanting to scroll doesn't seem possible?

[siebmanb]

I do not understand your answer, which is another question ! Are you saying it is not possible ?