sencha에서 오버레이 패널에 투명한 배경을 터치하는 방법

Question

아래 코드는 패널 주위의 테두리 색만 변경하지만 패널 자체는 변경하지 않습니다.

var overlay = Ext.Viewport.add({     
    xtype: 'panel', 
    centered: true, 
    style:'background-color: transparent;', 
    modal: { 
     style: 'opacity: 0' 
    }, 
    hideOnMaskTap:true, 
    width:'20%', 
    height: '50%', 
    styleHtmlContent:true, 
    items:[{ 
     xtype:'button', 
     test:'hey', 
     cls:'notrans', 
     style: 'opacity: 1' 
    }] 
});    

Answer 1

당신은 이을 중심으로 할 때 패널의 x-panel-inner CLS를 변경해야합니다. 따라서 패널에 cls을 입력하면됩니다 (예 : cls: my-panel). 사용자 정의 스타일 시트 이제

var overlay = Ext.Viewport.add({ 
    xtype: 'panel', 
    centered: true, 
    style:'background-color: transparent;', 
    cls: 'my-panel', 
    .... 
});    

:

.my-panel .x-panel-inner { 
    background-color: transparent !important; 
} 

그래서 지금을 중심으로 패널의 배경을 투명하게해야한다.