Тема ExtJs Нептун

Я пытаюсь изменить тему по умолчанию в ExtJs 4.2 на пользовательскую тему Neptune. Как сделать это для отладки?

<html>
<head>
    <title>xxx</title>
    <link rel="shortcut icon" type="image/ico" href="favicon.ico" />
    <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
    <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-custom.css">
    <script type="text/javascript" src="extjs/ext-all.js"></script>
    <script type="text/javascript" src="Scripts/App.js"></script>
</head>
<body></body>
</html>

themes extjs extjs4.2
person Nail Shakirov    schedule 24.05.2013    source источник
comment
Вы настраиваете свой проект с помощью Sencha Cmd?   -  person smhg    schedule 24.05.2013
comment
Да, я использую его для развертывания, но мне нужно изменить тему для отладки.   -  person Nail Shakirov    schedule 24.05.2013

Ответы (4)


arrow_upward
19
arrow_downward

У вас должны быть следующие файлы и папки:

  1. extjs/ext-all.js
  2. extjs/ext-theme-neptune.js
  3. extjs/resources/css/ext-all-neptune.css
  4. extjs/resources/ext-theme-neptune/ext-theme-neptune-all.css
  5. extjs/resources/ext-theme-neptune/images/*.*

И ваш код выглядит следующим образом:

<html>
    <head>
        <title>xxx</title>
        <link rel="shortcut icon" type="image/ico" href="favicon.ico" />
        <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all-neptune.css">
        <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-custom.css">
        <script type="text/javascript" src="extjs/ext-all.js"></script>
        <script type="text/javascript" src="extjs/ext-theme-neptune.js"></script>
        <script type="text/javascript" src="Scripts/App.js"></script>
    </head>
    <body></body>
</html>
person ki11en    schedule 07.06.2013
comment
что, если у вас есть только папки ext-all-neptune и ext-theme-neptune? вам нужно сохранить всю структуру каталогов extjs, чтобы иметь возможность ее использовать? - person ; 15.11.2013
comment
Вам нужны только файлы, перечисленные в посте, все остальные могут быть удалены. Файла ext-all-neptune.css и папки ext-theme-neptune достаточно для стиля neptune. - person ki11en; 16.11.2013

arrow_upward
5
arrow_downward

Чтобы перейти на тему neptune, измените line 33 файла sencha.cfg, расположенного в .sencha/app/sencha.cfg, на

app.theme=ext-theme-neptune

После этого запустите sencha app refresh в терминале или в командной строке.

person cclerv    schedule 24.05.2013
comment
После этого запустите обновление приложения sencha в вашем терминале или в командной строке — это для развертывания моего приложения? - person Nail Shakirov; 24.05.2013
comment
Это также изменит вашу тему во время разработки. - person John Gordon; 19.08.2013

arrow_upward
3
arrow_downward

Я сделал, как сказал @ccerville, но закончил с

 sencha app build

который сотворил магию с bootstrap.css и позволил странице отладки использовать neptune. «Обновление», похоже, не имеет значения, тогда как сборка изменяет bootstrap.css, который использует «отладочный» index.html.

Дополнительная информация доступна здесь: http://senchado.blogspot.ca/2013/03/extjs-42-app-with-custom-neptune-based.html

person amackay11    schedule 04.06.2013

arrow_upward
-1
arrow_downward

в app.json измените строку 31, где определяется «тема». измените "тему": "ext-theme-neptune"

После этого запустите сборку приложения sencha в своем терминале или в командной строке.

person Ashish Gupta    schedule 18.02.2015