Хобрук: Ваш путь к мастерству в программировании

Как перенести свойства виджетов Uibinder в CSS в GWT?

Хорошо, в файле .xml это работает нормально.

<g:FlexTable ui:field="wishlistFlexTable"  borderWidth="1" cellPadding="5" />

Примечание: мы получили похожие методы набора для FlexTable при написании кода в Gwt: setBorderWidth и setCellPadding.

Однако, если мы внесем borderWidth и cellPadding в css, это не будет работать в Css,

.gwtFlexTable{
   borderWidth:1;
   cellPadding:5;
}

в xml

<g:FlexTable ui:field="wishlistFlexTable"  addStyleNames="{res.css.gwtFlexTable}"  />

Итак, как перенести свойства виджетов Uibinder в CSS в GWT?

css gwt gwtp
29.09.2013

Ответы:


1

Я думаю, что ваш CSS просто неверен:

.gwtFlexTable{
   border-width:1px;
   cell-padding:5px;
}

Вы забыли единицы (они обязательны в CSS). а borderWidth должно быть записано как border-width

29.09.2013
  • я поставил фон: оранжевый; в .gwtFlexTable{}, и все заработало нормально. Таким образом, использование ширины границы и заполнения ячейки не является правильным способом. 29.09.2013
  • Вы уверены, что cell-padding и т. д. являются допустимыми свойствами CSS, которые делают то, о чем вы просите? По крайней мере, border-width - это реальная вещь, но это не имеет такого же эффекта, как вызов сеттера (т.е. установка свойства в uibinder). 29.09.2013

    • 2

    во всяком случае, я нашел этот код, он работает нормально

    .flexTable td{
    border: 1px solid #BBBBBB;
    padding: 3px;
 }
    29.09.2013

    3

    Любые классы css, которые вы помещаете в свой <ui:style>, запутываются во время выполнения, превращая их в буквенно-цифровые строки. Таким образом, ваш .gwtFlexTable будет выглядеть примерно как .A87GFESAF. Чтобы разрешить внешним именам классов CSS стилизовать вашу таблицу, вам нужно объявить свои имена стилей без фигурных скобок {} как таковые:

    <g:FlexTable ui:field="wishlistFlexTable"  addStyleNames="gwtFlexTable"  />

    или если вы хотите использовать как внешние классы, так и внутренние <ui:style>, вы можете смешивать классы CSS:

    <g:FlexTable ui:field="wishlistFlexTable"  addStyleNames="{res.css.gwtFlexTable} gwtFlexTable"  />
<!-- where {res.css.gwtFlexTable} is a ui:style name and gwtFlexTable is an unobfuscated CSS selector -->
    29.09.2013
    Новые материалы
    Введение в контекст React
    В этом посте мы поговорим о Context API, который был представлен в React 16, и о том, как вы можете их использовать. Что такое контекст? Глядя на определение из react docs , оно..
    Шлюз с лицензией OSS, совместимый с Apollo Federation v2, появится в WunderGraph
    Сегодня мы рады сообщить, что мы сотрудничаем с поддерживаемой YC Tailor Technologies, Inc. для внедрения Apollo Federation v2. Реализация будет лицензирована MIT (Engine) и Apache 2.0..
    Это оно
    Ну, я официально уволился с работы! На этой неделе я буду лихорадочно выполнять последние требования Думающего , чтобы я мог сосредоточиться на поиске работы. Что именно это значит?..
    7 полезных библиотек JavaScript, которые вы должны использовать в своем следующем проекте
    Усильте свою разработку JavaScript Есть поговорка «Не нужно изобретать велосипед». Библиотеки — лучший тому пример. Это поможет вам написать сложные и трудоемкие функции простым способом...
    Базовое руководство по переносу концепций обучения в глубокое обучение
    Обзор По мере того, как машинное обучение становится все более мощным и продвинутым, модели, обеспечивающие эту расширенную возможность, становятся все больше и начинают требовать огромного..
    C в C.R.U.D с использованием React-Redux
    Если вы использовали React, возможно, вы знакомы с головной болью, связанной с обратным потоком данных. Передача состояния реквизитам от родительских компонентов к дочерним компонентам может..
    5 обязательных элементов современного инструмента конвейера данных
    В цифровом мире предприятия используют конвейеры данных для перемещения, преобразования и хранения огромных объемов данных. Эти конвейеры составляют основу бизнес-аналитики и играют..