2011-11-01 3 views
2

크기 조정이 가능한 패널이 있습니다. 이벤트 크기를 조정 한 후 패널의 x 및 y 위치를 계산해야합니다. 지금까지 나는이Extjs 패널 리사이저 - 크기 변경 후

Panel.resizer = new Ext.Resizable(Panel.el, { 
animate: true, 
       duration: '.6', 
       easing: 'backIn', 
       handles: 'all', 
       constrainTo: 'dropBoxWindow', 
       pinned: false, 
       transparent: true 
      }); 
     Panel.resizer.on("resize", function (oResizable, iWidth, iHeight, e) { 
console.log(panel.el.getX()); // getting the x position before the resize..need to get position after resize. 
      Panel.setHeight(iHeight); 
      Panel.setWidth(iWidth); 
     }, this); 

누군가가 제가 정확히이 코드를 달성하려는 모르겠어요이

답변

2

를 해결하는 데 도움이 수 완료했다. 나는 (애니메이션 전환 포함) "크기 조정"패널을 보여줍니다 js fiddle을 만들어, 이것은 내가 끝낼 코드입니다 : 당신은 크기 조정 후 패널의 위치를 ​​계산 할 필요가 없습니다

new Ext.Panel({ 
    title: 'Resize me', 
    x: 100, 
    y: 100, 
    renderTo: Ext.getBody(), 
    floating: true, 
    frame: true, 
    width: 400, 
    height: 200, 
    listeners: { 
     render: function(p) { 
      new Ext.Resizable(p.getEl(), { 
       animate: true, 
       duration: '.6', 
       easing: 'backIn', 
       handles: 'all', 
       pinned: false, 
       transparent: true, 
       resizeElement: function() { 
        var box = this.proxy.getBox(); 
        if (this.updateBox) { 
         this.el.setBox(
         box, false, this.animate, this.duration, function() { 
          p.updateBox(box); 
          if (p.layout) { 
           p.doLayout(); 
          } 
         }, this.easing); 
        } else { 
         this.el.setSize(
         box.width, box.height, this.animate, this.duration, function() { 
          p.updateBox(box); 
          if (p.layout) { 
           p.doLayout(); 
          } 
         }, this.easing); 
        } 
        this.updateChildSize(); 
        if (!this.dynamic) { 
         this.proxy.hide(); 
        } 
        if (this.draggable && this.constrainTo) { 
         this.dd.resetConstraints(); 
         this.dd.constrainTo(this.constrainTo); 
        } 
        return box; 
       } 
      }); 
     } 
    } 
}); 

,하지만 당신은 실제로 그 정보를 필요로하는 경우에 사용자 정의 응용 프로그램 코드의 경우 resizeElement 함수 내부의 상자 변수를 사용할 수 있습니다.

+1

이 질문에 답하지 않은 이유는 무엇입니까? 이 코드가 효과가 있습니까? – sbgoran

+0

작동 ....... – prajeesh