GXT3 — высота текстового поля. Как увеличить высоту TextFields?

GXT 3.0.1 GWT 2.5.1

Я пытаюсь сделать текстовое поле той же высоты, что и кнопка рядом с ним, но это не работает. Я пробовал собственные функции набора TextFields, функции cointaner Layout и так далее. Кажется, ничто не работает так, как подозревается.

VerticalLayoutContainer layout = new VerticalLayoutContainer();
HBoxLayoutContainer searchContainer = new HBoxLayoutContainer();
searchContainer.setPadding(new Padding(5));
searchContainer.setPack(BoxLayoutPack.CENTER);
BoxLayoutData boxLayout = new BoxLayoutData(new Margins(0, 5, 5, 0));
searchText = new TextField();
searchButton = new TextButton("Search");
searchContainer.add(searchText, boxLayout);
searchContainer.add(searchButton, boxLayout);
searchContainer.setBorders(true);
layout.add(searchContainer);

Фрагмент не представляет, что я пробовал до сих пор. Фрагмент показывает, в каком контексте я использую текстовое поле и кнопку (контейнеры). Что мне не хватает? Или даже возможно отрегулировать высоту по фиксированному значению, такому как пиксели? Я совсем новичок в GXT.

Большое Вам спасибо.


java textfield height gwt gxt
person vitsja    schedule 08.12.2014    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Я сам нашел решение без CSS. Но спасибо geert3 за его предложение заглянуть в сам html, чтобы определить, какой компонент нужно настроить, чтобы визуализировать правильную высоту. В конце поле «ввод» должно быть изменено. Для этой цели я написал небольшой класс, который расширяет само текстовое поле и предоставляет метод для настройки высоты полей ввода. Таким образом можно изменить почти каждый атрибут поля ввода TextFields. Вот решение:

public class SearchTextField extends TextField {    

        public SearchTextField(){
            super();
        }

        public void setInputHeight(int heightValue) {
            getInputEl().getStyle().setHeight(20, Unit.PX);
        }

        public String getInputHeight() {
            return getInputEl().getStyle().getHeight();
        }
    }

Или вы можете получить тот же эффект в одной строке кода. В контексте, который был опубликован с вопросом, решение будет таким:

searchText.getCell().getInputElement(searchText.getElement()).getStyle().setHeight(20, Unit.PX);
person vitsja    schedule 09.12.2014

arrow_upward
0
arrow_downward

Попробуй это:

searchText.getElement().getStyle().setLineHeight(20, Unit.PX);

Если вы хотите делать это часто (т. е. для многих компонентов), вам следует рассмотреть возможность использования CSS для стилизации текстового поля. Это включает в себя:

  1. добавить имя стиля в текстовое поле

    searchText.addStyleName("mytextfield");

  2. в вашем CSS определите стили для класса mytextfield:

    .mytextfield { line-height: 20px }

person geert3    schedule 08.12.2014
comment
Здравствуйте, спасибо за быстрый ответ. Вы пробовали это решение? Я вставил код в пустой новый проект без каких-либо макетов, а высота осталась прежней. Я также пробовал это в контексте моего фрагмента с тем же результатом. - person vitsja; 08.12.2014
comment
Нет, это не проверено как таковое, но да, принцип должен работать для той ограниченной информации, которая у меня есть сейчас. Чтобы выяснить, почему это не работает, я бы посоветовал вам использовать режим разработки вашего браузера (нажмите F12 в Chrome и IE или используйте плагин, такой как Firebug в Firefox). Это позволит вам проверить собственное текстовое поле HTML в вашей DOM и убедитесь, что высота строки фактически устанавливается в DOM. Затем вы можете поэкспериментировать с CSS и/или выяснить, что, возможно, переопределяет высоту, которую вы ожидаете. - person geert3; 08.12.2014
comment
Я думаю, должно быть решение без стилей CSS (обязательно попробую с CSS). Возможно, в другом контексте работают различные методы setHeight, просто я их пока не нашел. Надеюсь, кто-то знает ответ, эта мелочь меня очень беспокоит. - person vitsja; 09.12.2014