Scout Eclipse Неоновый запас по полям

Возможно ли установить маржу вокруг полей.Scout Eclipse Неоновый запас по полям

Например, в изображении:

Если я хочу, чтобы установить нижнюю (отделенной) CheckBox в соответствии с выше раз, есть способ сделать это?

Marko

2016-02-17 Marko Zadravec

Я не понимаю, что вы хотите достичь. Не можете ли вы опубликовать пример (каркас, скриншот, модифицированный с помощью Paint, ...)? – Jmini

Я хочу, чтобы нижний квадрат (Неизвестный) был выровнен с другими квадратами в ListBox (Driver, Contact person, ...) –

Я думаю, теперь я получил его ... Я добавил скриншот (3 минуты работы с Microsoft Paint). Я рекомендую вам всегда задавать подробный вопрос, если вы хотите получить хорошие ответы. – Jmini

Начните с проверки кода HTML (с помощью Chrome).

код, соответствующий Checkbox поле что-то вроде этого:

<div class="form-field check-box-field" 
     data-modelclass="org.eclipse.scout.widgets.client.ui.forms.CheckboxFieldForm$MainBox$ConfigurationBox$CheckboxField" 
     data-classid="CheckboxField_org.eclipse.scout.widgets.client.ui.forms.CheckboxFieldForm" 
     id="scout.CheckBoxField[1-49]" 
     style="left: 0px; top: 14px; width: 1598px; height: 30px;" 
    > 
    <div class="field has-inner-alignment halign-left valign-top" style= 
    "left: 148px; top: 0px; width: 1420px; height: 30px;"> 
     <div class="check-box" tabindex="0"></div> 
     <div class="label"> 
     Checkbox 
     </div> 
    </div> 
    </div>

С помощью CSS вы можете сделать все возможное:

.check-box-field { 
    background-color: red; 
}

Теперь, потому что ты не хочешь добавить некоторые пользовательские CSS стиль для всех CheckBox полей, вы можете определить пользовательские Css-класса в вашем CheckBox:

@Order(4) 
    public class UnknownCheckBox extends AbstractBooleanField { 

    @Override 
    protected String getConfiguredCssClass() { 
     return "checkbox-under-listbox"; 
    } 
    // ... Some Code ... 
    }

А теперь добавьте этот CSS код:

.checkbox-under-listbox { 
    margin-left: 20px; 
}

Я понял, этот пример с демонстрационным приложением Widgets (org.eclipse.scout.docs repository, releases/5.2.x branch). Я добавил код css в этот файл: org.eclipse.scout.widgets.ui.html/src/main/js/widgets/main.css (Вероятно, это не самый лучший способ получить все в main.css).

В этом примере вы можете сделать вывод о том, как добавить в приложение дополнительный модуль CSS/LESS и макрос. Это сообщение: Inclusion of additional icons from font-awesome также может быть полезно. У вас будет main.css вместо font.css.

ВНИМАНИЕ: это не состояние искусства.

В конце это нормальная разработка HTML (одностраничное приложение, конечно), поэтому вы можете делать то, что хотите ...

Если вы не хотите использовать МЕНЬШЕ компилятор и препроцессор файла, вы можете simpelly добавить обычный файл CSS в папке:

<your_project>.ui.html/src/main/resources/WebContent

Пусть говорят:

<your_project>.ui.html/src/main/resources/WebContent/my_custom.css

Do не забудьте указать свой файл CSS между <head> и </head> тегами в индексном файле HTML:

<your_project>.ui.html/src/main/resources/WebContent/index.html

Что-то вроде:

<head> 
    <!-- some code --> 
    <link rel="stylesheet" type="text/css" href="my_custom.css"> 
    <scout:stylesheet src="res/scout-module.css" /> 
    <!-- some code --> 
</head>

источник

2016-02-19 07:34:59 Jmini

Привет, я нашел ваш ответ действительно хорошим, но у меня есть одна небольшая проблема. У меня нет ... ui.htmi/src/main/js folder ... мне нужна точная эта папка или может быть .css-файл в другом месте? Я пытаюсь использовать ..ui.html/src/main/resources/WebContent/res где all-macro.css. Я добавляю новый .css-файл и добавляю @include ("main.scc") в файл all-macro.css, но он все равно не работает. –

Я делаю опечатку: @include ("main.css"), все еще не работает. –

Создайте папку '... ui.html/src/main/js', если потребуется. В [файле модуля] (https://github.com/BSI-Business-Systems-Integration-AG/org.eclipse.scout.docs/blob/releases/5.2.x/code/widgets/org.eclipse.scout .widgets.ui.html/src/main/js/widgets-module.css) это '// @ include (" main.css ")'. В [файле макроса] (https://github.com/BSI-Business-Systems-Integration-AG/org.eclipse.scout.docs/blob/releases/5.2.x/code/widgets/org.eclipse.scout .widgets.ui.html/src/main/resources/WebContent/res/widgets-all-macro.css) то же самое. Вам нужно, чтобы ваша сборка была правильно настроена. – Jmini

Вы всегда можете использовать пользовательские CSS: Пусть ваше поле реализовать IStyleable и использовать setCssClass() применять соответствующий класс CSS. Я постараюсь избежать максимально возможного использования таких подходов для подбора пикселей.

источник

2016-02-18 08:53:10 Arthur

Привет, спасибо за ответ, но нет документации о том, какая строка должна быть создана в этом методе. Не могли бы вы представить пример ... –

Я пытаюсь: cssClass = "{margin-left: 80px;}"; но он не работает –

Это просто имя класса CSS. Сам класс должен быть определен в вашем файле CSS. – Arthur

Scout Eclipse Неоновый запас по полям

ответ

Смежные вопросы