Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Nov 2008
    Location
    Lyon, France
    Posts
    215
    Vote Rating
    5
    christophe.geiser will become famous soon enough

      0  

    Default [4.2.0.489] position problem: floating with constrainTo / renderTo

    [4.2.0.489] position problem: floating with constrainTo / renderTo


    Hi all,
    I have some difficulties to make this component combination work again with 4.2. The test case below should illustrate the fact that the positioning of the floating panel within the window is not correctly calculated (but was with 4.1 series): you cannot drag it to the top left corner.

    I know this is not a standard way to build components (renderTo + constainTo + floating + not registered in layout), but that was the only way I could find to for situation like the attached picture, where dashboard elements can be dragged around within the central component, which itself is within a floating window.


    Code:
    Ext.onReady(function(){
           
        var win = Ext.create('widget.window', {
            height: 500,
            width: 500,
            x: 100,
            y: 250,
            title: 'Constraining Window, plain: true',
            closable: false,
            plain: true
            //layout: 'absolute',
        });
        win.show();
     
    
    
      panel = Ext.create('widget.panel', {
        title:"floatingPanel",
        width: 100,
        height: 100,
        x:100,
        floating: true,
        constrain: true,
        draggable:true,
        constrainTo : win.getEl(),
        renderTo: win.getEl()
      });
    });
    Cheers,
    C.Screenshot at 2013-02-16 10:55:41.jpg

  2. #2
    Sencha User
    Join Date
    Nov 2008
    Location
    Lyon, France
    Posts
    215
    Vote Rating
    5
    christophe.geiser will become famous soon enough

      0  

    Default


    For what it's worth, here is a dirty/quick fix (the problem in this situation is that we don't have a floatParent, even though we should calculate the position relative to a constraining parentNode ):

    Code:
    Ext.define(null,{    override: "Ext.util.Positionable",
        calculateConstrainedPosition: function(constrainTo, proposedPosition, local, proposedSize) {
            var me = this,
                vector,
                fp = me.floatParent,
                floatingConstrainTo = me.floating && me.constrainTo,
                parentNode = fp 
                    ? fp.getTargetEl() 
                    : floatingConstrainTo
                        ? me.constrainTo : null,
                //parentNode = fp ? fp.getTargetEl() : null,
                parentOffset,
                borderPadding,
                proposedConstrainPosition,
                xy = false;
    
    
           // if (local && fp) {
            if (local && parentNode) {
                parentOffset = parentNode.getXY();
                borderPadding = parentNode.getBorderPadding();
                parentOffset[0] += borderPadding.beforeX;
                parentOffset[1] += borderPadding.beforeY;
                if (proposedPosition) {
                    proposedConstrainPosition = [proposedPosition[0] + parentOffset[0], proposedPosition[1] + parentOffset[1]];
                }
            } else {
                proposedConstrainPosition = proposedPosition;
            }
            
            constrainTo = constrainTo || me.constrainTo || parentNode || me.container || me.el.parent();
            vector = (me.constrainHeader ? me.header.el : me.el).getConstrainVector(constrainTo, proposedConstrainPosition, proposedSize);
    
    
            
            if (vector) {
                xy = proposedPosition || me.getPosition(local);
                xy[0] += vector[0];
                xy[1] += vector[1];
            }
            return xy;
        }
        });
    C.

  3. #3
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,483
    Vote Rating
    35
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Does it not work if you go down the standard route of adding those floating components as items of the centre region?

    Containers now have a collection of floating items which are managed outside of any layout. These can be constrained within their parent.

    Code:
    var win = Ext.create('widget.window', {
        height: 300,
        width: 300,
        x: 10,
        y: 10,
        title: 'Constraining Window, plain: true',
        closable: false,
        plain: true,
        items: {
            title: "floatingPanel",
            x:100,
            width: 100,
            height: 100,
            floating: true,
            draggable: true,
            constrain: true,
    
            // Do not use default Panel dragging: use window type dragging
            initDraggable: Ext.window.Window.prototype.initDraggable
        }
    });
    win.show();
    
    // Floating components begin hidden
    win.floatingItems.items[0].show()

  4. #4
    Sencha User
    Join Date
    Nov 2008
    Location
    Lyon, France
    Posts
    215
    Vote Rating
    5
    christophe.geiser will become famous soon enough

      0  

    Default


    Thanks a lot for your answer Animal, it forced me to successfully revise and simplify part of my code.
    The problem was that I had to use the renderTo trick under 4.1 because there was a rendering issue under with floating + autoShow in the (quite complex) combination of my app. This all seem to work properly now - in a much cleaner way !
    Consider this as closed
    Cheers, C.

  5. #5
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    972
    Vote Rating
    105
    Daniil is a glorious beacon of light Daniil is a glorious beacon of light Daniil is a glorious beacon of light Daniil is a glorious beacon of light Daniil is a glorious beacon of light Daniil is a glorious beacon of light

      0  

    Default


    Code:
    // Do not use default Panel dragging: use window type dragging
    initDraggable: Ext.window.Window.prototype.initDraggable
    I guess it can be replaced with
    Code:
    simpleDrag: true
    http://docs.sencha.com/extjs/4.2.0/#...cfg-simpleDrag

    Probably, it appeared due to this discussion.
    Ext.NET - ASP.NET for Ext JS
    MVC and WebForms
    Examples | Twitter

Thread Participants: 2

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