예제에서 ExtJs 5 사이드 탐색 탭을 구현할 수 없습니다

로컬로이 example을 임베드 할 수있는 사람이 있었습니까?예제에서 ExtJs 5 사이드 탐색 탭을 구현할 수 없습니다

로컬 프로젝트에서 동일한 작업을 수행하려고하면 탭의 오른쪽 부분 만 표시되고 다른 왼쪽 부분은 숨겨집니다. 글리프가 아닌 iconCls를 사용합니다.

나는 문제는 내가 제대로이 문제를 컴파일 할 수

 
@include extjs-tab-panel-ui(
    $ui: 'navigation', 
    $ui-tab-background-color: transparent, 
    $ui-tab-background-color-over: #505050, 
    $ui-tab-background-color-active: #303030, 
    $ui-tab-background-gradient: 'none', 
    $ui-tab-background-gradient-over: 'none', 
    $ui-tab-background-gradient-active: 'none', 
    $ui-tab-color: #acacac, 
    $ui-tab-color-over: #c4c4c4, 
    $ui-tab-color-active: #fff, 
    $ui-tab-glyph-color: #acacac, 
    $ui-tab-glyph-color-over: #c4c4c4, 
    $ui-tab-glyph-color-active: #fff, 
    $ui-tab-glyph-opacity: 1, 
    $ui-tab-border-radius: 0, 
    $ui-tab-border-width: 0, 
    $ui-tab-inner-border-width: 0, 
    $ui-tab-padding: 24px, 
    $ui-tab-margin: 0, 
    $ui-tab-font-size: 15px, 
    $ui-tab-font-size-over: 15px, 
    $ui-tab-font-size-active: 15px, 
    $ui-tab-line-height: 19px, 
    $ui-tab-font-weight: bold, 
    $ui-tab-font-weight-over: bold, 
    $ui-tab-font-weight-active: bold, 
    $ui-tab-icon-width: 24px, 
    $ui-tab-icon-height: 24px, 
    $ui-bar-background-color: #404040, 
    $ui-bar-background-gradient: 'none', 
    $ui-bar-padding: 0, 
    $ui-strip-height: 0 
);

방법에 extjs 테마 내에서이 스크립트를 추가하고 컴파일 할 수 있다고 생각? 어쩌면 테마 재건은 nedeed입니까?

출처

2014-06-14 Zango

동일한 문제가있었습니다. 방금 'ui :'내비게이션 ','행을 삭제했습니다. 그리고 효과가있었습니다. 그렇게 해봐. –

저는 ExtJS의 전문가는 아닙니다. 내 프로젝트 중 하나에서 ExtJS 5를 구현하려고합니다. 내 설정에서 사이드 탐색 패널을 사용할 수 있습니다. 단계 :

(응용 프로그램 생성 옵션을 사용하여) senchacmd를 사용하여 응용 프로그램을 만듭니다.
senchacmd watch 명령으로 서버를 시작하십시오.

아래의 코드 이름 "NavigationTabs.js"와 응용 프로그램 /보기/탭/디렉토리에보기 "NavigationTabs"를 작성 및 배치 : 이제

Ext.define('MyProject.view.tab.NavigationTabs', { 
    extend: 'Ext.tab.Panel', 
    xtype: 'navigation-tabs', 

    //<example> 
    exampleTitle: 'Navigation Tabs', 
    otherContent: [{ 
    type: 'Styles', 
    path: 'sass/src/view/tab/NavigationTabs.scss' 
    }], 
    //</example> 

    height: 400, 
    width: 600, 


    ui: 'navigation', 
    tabPosition: 'left', 
    tabRotation: 0, 
    tabBar: { 
    layout: { 
     pack: 'center' 
    }, 
    border: false 
    }, 

    defaults: { 
    iconAlign: 'top', 
    bodyPadding: 15 
    }, 

    items: [{ 
    title: 'Home', 
    glyph: 72, 
    html: "Some text" 
    }, { 
    title: 'Users', 
    glyph: 117, 
    html: "Some other text" 
    }, { 
    title: 'Groups', 
    glyph: 85, 
    html: "Some more text" 
    }, { 
    title: 'Settings', 
    glyph: 42, 
    html: "Extra text" 
    }] 
});

을의 말대꾸에/SRC /보기/탭/디렉토리에 NavigationTabs.scss라는 파일을 만들고이 파일에 질문에 지정한 sass 코드를 추가하십시오. 컴파일 앱 및 SCS들에 대한
```
items: [ 
{ 
    ... 
    ... 
}, 
{ 
    region: 'west', 
    xtype: 'navigation-tabs', 
    reference: 'navigation' 
}], 
```
기다립니다 (엽차 : 응용 프로그램 /보기/주/디렉토리에 귀하의 Main.js 파일에서
는 항목 목록에 다음을 포함 -cmd watch 명령이 자동으로 코드를 컴파일합니다.
브라우저에서 앱을 새로 고침하고 작동하는지 확인하십시오.

희망, 이것이 유용 할 것입니다.

참고 : 위 코드는 ExtJS5 Kitchen Sink 예제에서 가져온 것입니다.

출처

2014-08-06 12:10:17

예제에서 ExtJs 5 사이드 탐색 탭을 구현할 수 없습니다

답변

관련 문제