Как я могу обернуть текст внутри ячейки GWT CellTable?

Мне нужно обернуть текст столбца. Размер моей колонки небольшой. Поэтому, если я устанавливаю ширину столбца, некоторые буквы не видны. Поскольку длина текста больше размера столбца. Если в тексте есть пробел, то он переносится. Поэтому мне нужно обернуть текст.

Например, emailColumn имеет значение [email protected].

Я ожидаю результат как xxxxxxxxxxx@x в первой строке и xxxx.xom в следующей строке.

Является ли это возможным?


person Rajaa    schedule 21.06.2012    source источник
comment
Используйте свойство css ‹code›word-wrap:break-word;‹/code› См. [это] [1]. [1]: stackoverflow.com/questions/499137/   -  person jonasr    schedule 21.06.2012
comment
Спасибо Йонаср. Но NetBeans показывает перенос слов свойства Unknown. Так поддержит?   -  person Rajaa    schedule 21.06.2012
comment
Это свойство css3 поддерживается всеми основными браузерами. w3schools.com/cssref/css3_pr_word-wrap.asp   -  person jonasr    schedule 21.06.2012
comment
Привет Йонаср. Отличный ответ. Ты замечательный. Большое Вам спасибо. Это работает.   -  person Rajaa    schedule 21.06.2012
comment
Другой вариант сохранить чистый пользовательский интерфейс — использовать text-overflow:ellipsis; Это добавит ... в конец. Затем добавьте заголовок к ячейке с полным значением. Это работает для более длинных ячеек, и вы хотите, чтобы ваша таблица выглядела одинаково.   -  person Chris Hinshaw    schedule 27.11.2013


Ответы (1)


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

Создайте один столбец абстрактной ячейки для таблицы ячеек, добавьте html-контент в эту ячейку и добавьте столбец в таблицу ячеек, как показано ниже.

  1. Добавьте этот код в свой основной java-файл, который содержит таблицу ячеек, и вставьте приведенный ниже код в необходимое место.

        WrappedColumn<T> textDetail = new WrappedColumn<T>() {
            // This is method in wrapped details column java file.
    
            public WrapDetails getValue(T object) {
                return new WrapDetails( T.<your method1 for wrap text>(), T.<your method2 for wrap text>());
            }
        };    
        <your cell table>.addColumn(textDetail);
    
  2. Создайте новый java-файл с именем, например, «WrapDetails.java» для рендеринга динамических данных и вставьте приведенный ниже код.

    public class WrapDetails extends Composite {    
        String mail_id;
        String website;
    
        public WrapDetails(String id, String site) {
            this.mail_id = id;
            this.website = site;
        }   
    }
    
  3. Создайте новый java-файл для переноса текстового столбца с именем «WrappedColumn.java» и вставьте приведенный ниже код.

    public abstract class WrappedColumn<T> extends Column<T, WrapDetails> {
    
        public WrappedColumn() {
            super(new WrapDetailsColumnCell());
        }
    
        /**      
         * Return the passed-in object. 
         * @param object The value to get
         */    
       @Override    
       public WrapDetails getValue(T object) {   
           return null;         
       }    
    }
    
  4. Создайте новый java-файл с именем «WrapDetailsColumnCell.java» и вставьте приведенный ниже код.

    public class WrapDetailsColumnCell extends AbstractCell<WrapDetails> implements Cell<WrapDetails>{      
        String mail_id, website;
    
        /**
         * Add this constructor, if you want click event for this column.
         */
        public WrapDetailsColumnCell() {
            super("click", "keydown");      
        }
    
        /**
         * This method provides style for your wrap data
         * 
         */
        @Override
        public void render(Context context, WrapDetails value, SafeHtmlBuilder sb) {
    
            sb.appendHtmlConstant("<div><table width='100%'>");
            sb.appendHtmlConstant("<tr><td><div style='your style here'>"+mail_id+"</div></td></tr>");
            sb.appendHtmlConstant("<tr><td><div style='your style here'>"+website+"</div></td></tr>");
            sb.appendHtmlConstant("</table></div>");
        }
    
        /**
         * This method update cell value on click event.
         * 
         */
        @Override
        public void onBrowserEvent(Context context, Element parent,WrapDetails value, NativeEvent event,  ValueUpdater<FaxDetails> valueUpdater) {
            super.onBrowserEvent(context, parent, value, event, valueUpdater);
            setValue(context, parent, value); 
            valueUpdater.update(value);
        }
    }
    

Это работает для меня хорошо. После того, как попробовал это, дайте мне знать о любой проблеме, если вы ее получите. Веселиться.

person Elumalai GM    schedule 27.11.2013