1. #121
    Sencha User
    Join Date
    Feb 2012
    Posts
    21
    Vote Rating
    -3
    AlphaBravo can only hope to improve

      0  

    Default


    Has anyone found the fix for comment #115 as stated in comment #117?

  2. #122
    Sencha User
    Join Date
    Jun 2011
    Posts
    52
    Vote Rating
    0
    won.rhee is on a distinguished road

      0  

    Default


    Quote Originally Posted by AlphaBravo View Post
    Has anyone found the fix for comment #115 as stated in comment #117?
    +1 for this

  3. #123
    Sencha User
    Join Date
    Mar 2011
    Posts
    19
    Vote Rating
    0
    JoelB is on a distinguished road

      0  

    Default


    +1 for this too

    But why on earth cant we set 100% width on a panel ??? To always have to set the pixel width on resize sounds so ... heavy.

    //J

  4. #124
    Sencha User
    Join Date
    Sep 2012
    Posts
    9
    Vote Rating
    0
    yvkumar87 is on a distinguished road

      0  

    Default


    Hi I have seen ur post i am not able to fix this issue with this below code
    will u help me in this to resolve my issue I am new to ExtJs what changes i have to do in this below code
    I am expecting the output like which is in attachment "output.png"
    http://www.sencha.com/forum/showthre...521#post892521


    Quote Originally Posted by Condor View Post
    The ExtJS layout system works perfectly as long as you are using an Ext.Viewport or render to an element with fixed height and width.

    But what if you already have a complete page design and want to fit an Ext component inside a div with flexible height and/or width?

    I've posted the solution several times before, but I realized it would be easier to make a plugin out of it:

    Code:
    Ext.namespace('Ext.ux');
    /**
     * @class Ext.ux.FitToParent
     * @extends Object
     * <p>Plugin for {@link Ext.BoxComponent BoxComponent} and descendants that adjusts the size of the component to fit inside a parent element</p>
     * <p>The following example will adjust the size of the panel to fit inside the element with id="some-el":<pre><code>
    var panel = new Ext.Panel({
        title: 'Test',
        renderTo: 'some-el',
        plugins: ['fittoparent']
    });</code></pre></p>
     * <p>It is also possible to specify additional parameters:<pre><code>
    var panel = new Ext.Panel({
        title: 'Test',
        renderTo: 'other-el',
        autoHeight: true,
        plugins: [
            new Ext.ux.FitToParent({
                parent: 'parent-el',
                fitHeight: false,
                offsets: [10, 0]
            })
        ]
    });</code></pre></p>
     * <p>The element the component is rendered to needs to have <tt>style="overflow:hidden"</tt>, otherwise the component will only grow to fit the parent element, but it will never shrink.</p>
     * <p>Note: This plugin should not be used when the parent element is the document body. In this case you should use a {@link Ext.Viewport Viewport} container.</p>
     */
    Ext.ux.FitToParent = Ext.extend(Object, {
        /**
         * @cfg {HTMLElement/Ext.Element/String} parent The element to fit the component size to (defaults to the element the component is rendered to).
         */
        /**
         * @cfg {Boolean} fitWidth If the plugin should fit the width of the component to the parent element (default <tt>true</tt>).
         */
        fitWidth: true,
        /**
         * @cfg {Boolean} fitHeight If the plugin should fit the height of the component to the parent element (default <tt>true</tt>).
         */
        fitHeight: true,
        /**
         * @cfg {Boolean} offsets Decreases the final size with [width, height] (default <tt>[0, 0]</tt>).
         */
        offsets: [0, 0],
        /**
         * @constructor
         * @param {HTMLElement/Ext.Element/String/Object} config The parent element or configuration options.
         * @ptype fittoparent
         */
        constructor: function(config) {
            config = config || {};
            if(config.tagName || config.dom || Ext.isString(config)){
                config = {parent: config};
            }
            Ext.apply(this, config);
        },
        init: function(c) {
            this.component = c;
            c.on('render', function(c) {
                this.parent = Ext.get(this.parent || c.getPositionEl().dom.parentNode);
                if(c.doLayout){
                    c.monitorResize = true;
                    c.doLayout = c.doLayout.createInterceptor(this.fitSize, this);
                } else {
                    this.fitSize();
                    Ext.EventManager.onWindowResize(this.fitSize, this);
                }
            }, this, {single: true});
        },
        fitSize: function() {
            var pos = this.component.getPosition(true),
                size = this.parent.getViewSize();
            this.component.setSize(
                this.fitWidth ? size.width - pos[0] - this.offsets[0] : undefined,
                this.fitHeight ? size.height - pos[1] - this.offsets[1] : undefined);
        }
    });
    Ext.preg('fittoparent', Ext.ux.FitToParent);
    The following example will adjust the size of the panel to fit inside the element with id="some-el":
    Code:
    var panel = new Ext.Panel({
        title: 'Test',
        renderTo: 'some-el',
        plugins: ['fittoparent']
    });
    It is also possible to specify additional parameters:
    Code:
    var panel = new Ext.Panel({
        title: 'Test',
        renderTo: 'other-el',
        autoHeight: true,
        plugins: [
            new Ext.ux.FitToParent({
                parent: 'parent-el',
                fitHeight: false,
                offsets: [10, 0]
            })
        ]
    });
    The element the component is rendered to needs to have style="overflow:hidden", otherwise the component will only grow to fit the parent element, but it will never shrink.

    Note: This plugin should not be used when the parent element is the document body. In this case you should use an Ext.Viewport container.

  5. #125
    Sencha User
    Join Date
    Nov 2013
    Location
    Ottawa, ON
    Posts
    4
    Vote Rating
    0
    brunp is on a distinguished road

      0  

    Default


    I am using Sencha Architect and not sure where to add the plugin. I am trying to auto-size a calendar pro module inside my container, which itself is inside a tab panel. The creation of the calendar module requires a fixed width/height to display properly, but I want it to auto-size to the parent's view port setting.

    Any idea's?

    Paul

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar