2012-06-04 4 views
0

Работа с приложением GWT, для чего нужно что-то вроде CellTable для отображения и редактирования данных. Дополнительные требования, которые я не видел в примерах CellTable:GWT CellTable или аналогичный

  • Несколько строк заголовка. Мне действительно не нужна строка заголовка как таковая, но каждые несколько строк (4-10) данных мне хотелось бы что-то вроде заголовка (в основном объясняет, как связаны следующие «n» элементы)

  • на некоторые данные (текущая дата и даты, указанные в объекте), некоторые из полей должны быть не редактируемыми. Я нашел примеры того, как сделать столбец не редактируемым, но как мне сопоставить его с фактическими данными из настраиваемого средства визуализации? (То есть объект данных, соответствующий строке - должен быть легким, но я что-то не хватает ...)

Могу ли я сделать это с CellTable? Есть ли лучший виджет, на который я должен смотреть? Я знаю, что могу все это сделать в гриде, но CellTable выглядит намного лучше!

Спасибо.

Ответ

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

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

Если у кого есть комментарии или я пропустил что-то очевидное: дайте мне знать!

// Step 1: Create a cell (in this case based on text) 
class MyEditTextCell extends EditTextCell { 
    @Override 
    public void render(com.google.gwt.cell.client.Cell.Context context, 
      String value, SafeHtmlBuilder sb) 
    { 
     bool editable = true; 
     // TODO: What goes here? 

     if (!editable) { 
     sb.appendHtmlConstant("<div contentEditable='false' unselectable='true'>" + value + "</div>"); 
    } 
    else { 
      super.render(context, value, sb); 
     } 
    } 
} 

// It gets used to add a column to the table like this 
final MyEditTextCell myCell = new MyTextCell(); 
Column<RowType, String> nmyCol = new Column<RowType, String>(myCell) { 
    @Override 
    public String getValue(RowType o) { 
     return o.someMethod(); // This gets the particular row out of your column. 
    } 
}; 
table.addColumn(myCol, "Heading"); 

Таким образом, все это работало довольно легко, но я все еще не мог понять TODO использования строки. Все это вместе с другим примером, касающимся KeyProviders. KeyProvider предоставляет ссылку из контекста, который вы получаете в методе render() ячейки и в строке, к которой принадлежит ячейка. Он делает это с помощью индекса (который является просто объектом).

Таким образом, вы в конечном итоге с:

// Step 2: Cell can get the row and use it to decide how to draw. 
class MyEditTextCell extends EditTextCell { 
    @Override 
    public void render(com.google.gwt.cell.client.Cell.Context context, 
      String value, SafeHtmlBuilder sb) 
    { 
     Object key = context.getKey(); 
     // What the key is is uo to you: if could be an Integer that indexes into 
     // a collection of objects, it could be a key for a hashmap. I'm guessing 
     // it could even be the real object itself (but I haven't tried that...) 
     // e.g. 
     boolean editable = true; 
     int index = ((Integer)key).intValue(); 
     RowType row = myRowCollection.get(index); 
     if (row != null) { 
      if (/*some condition on the row*/) { 
       editable = false; 
      } 
     } 
     if (!editable) { 
     sb.appendHtmlConstant("<div contentEditable='false' unselectable='true'>" + value + "</div>"); 
    } 
    else { 
      super.render(context, value, sb); 
     } 
    } 
} 

// Key provider links gets a unique id from the rows - I just used an in. 
// This gets provided to the CellTable on creation 
// e.g. CellTable tab = new CellTable(LEY_PROVIDER); 
// 
private static final ProvidesKey<RowType> KEY_PROVIDER = new ProvidesKey<RowType>() { 
    public Object getKey(RowType item) { 
     return Integer.valueOf(item.getId()); 
    } 
}; 

ответ

1
  • Несколько строк заголовка. Мне не нужна строка заголовка как таковая, но каждые несколько строк (4-10) данных мне хотелось бы что-то вроде заголовка (в основном объясняется, как связаны следующие элементы «n»)

(ака группировка строк)
GWT 2.5 (будет выпущен в месяц или около того) добавит CellTableBuilder, который позволяет изменять как CellTable строит свою вид из его модели.
Вы можете увидеть пример в действии здесь (не то же самое использование случая как ваш, хотя: добавляет дочерние строки, а не группировки строк): http://showcase2.jlabanca-testing.appspot.com/#!CwCustomDataGrid
В вашем случае, сложная часть, чтобы определить, когда для вставки строки группировки.

  • На основании некоторых данных (текущая дата и сроки, указанные в объекте), некоторые поля должны быть не доступны для редактирования. Я нашел примеры того, как сделать столбец не редактируемым, но как мне сопоставить его с фактическими данными из настраиваемого средства визуализации? (То есть объект данных, соответствующий строке - должно быть легко, но я что-то не хватает ...)

Лучше всего использовать пользовательские Cell, который принимает объект значение в строки (поэтому он может решить, должна ли ячейка быть редактируемой), но только отображает/редактирует поле/свойство этого объекта.
Вы должны уметь переносить обработку рендеринга и событий на TextInputCell или EditTextCell, если значение доступно для редактирования, а в противном случае - TextCell.

Сложная часть заключается в том, что условие для редактирования столбца зависит от свойств, которые сами редактируются. В этом случае вам нужно будет вызвать обновление таблицы (по крайней мере, измененной строки), чтобы обновить условно редактируемую колонку .
В этом случае, я думаю, у вас были бы лучшие шансы, используя пользовательский Cell, который всегда отображает одно и то же первоначально, но может переключаться в редактируемый режим (аналогично EditTextCell); и - это значение, которое редактируется при обработке события, и условно отказывается перейти в режим редактирования.
Вы должны уметь копировать/вставлять много от EditTextCell здесь.

+0

Спасибо за ответ - попробуем позже. Образец GWT 2.5 выглядит так, как будто он может выполнить эту работу - я могу перевернуть идею и добавить «группирующую строку» в другие дочерние строки. Пользовательская ячейка должна быть в порядке - фиксируются даты, используемые для определения того, редактируются ли ячейки. Есть ли пример того, как это сделать? – John3136

+0

Не предполагайте, что есть простой справочник по пользовательским ячейкам, на которые вы могли бы указать мне? Ни один из примеров, которые я нашел, действительно полезен. Пробовал расширять AbstractCell , но я не могу использовать super.render() из него, чтобы сделать «не редактируемый» трюк - это правильный трек или нет? Благодарю. – John3136

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