CellTable의 합성 셀 너비

Question

잘 작동하는 복합 셀이 있는데, 텍스트 입력 셀과 버튼 셀이 있습니다. 그러나 그것이 보여 주었을 때 그림과 같이 버튼 셀을 텍스트 입력 셀 아래에 놓았을 때

여기 hascells를 사용하여 compositecel을 구현했습니다.

final HasCell<ObjetoDato,String> celda1=new HasCell<ObjetoDato,String>(){ 
         TextInputCell celda; 

         @Override 
         public Cell<String> getCell() { 
          celda=new TextInputCell(); 

          return celda; 
         } 

         @Override 
         public FieldUpdater<ObjetoDato, String> getFieldUpdater() { 
          return null; 
         } 

         @Override 
         public String getValue(ObjetoDato object) { 
          //new Scripter(object,actual.getComportamiento(),true); 
          return object.getValor(actual.getNombreCampo());  
         } 



        };       
        HasCell<ObjetoDato,String> celda2=new HasCell<ObjetoDato,String>(){ 
         ButtonCell celda; 

         @Override 
         public Cell<String> getCell() { 
          celda=new ButtonCell(); 

          return celda; 
         } 

         @Override 
         public FieldUpdater<ObjetoDato, String> getFieldUpdater() { 
          return new FieldUpdater<ObjetoDato, String>(){ 

           @Override 
           public void update(int index,ObjetoDato object, String value) { 
            new Seleccionador(actual.getClaseRelacion(), actual.getNombreCampo(),object.getValor(actual.getNombreCampo()), object.getIdRelacion(actual.getNombreCampo()), object,tabla,object,actual.getComportamiento()); 

           } 
          }; 
         } 

         @Override 
         public String getValue(ObjetoDato object) { 

          return "..."; 
         } 


        }; 
        //Composite 
        List<HasCell<ObjetoDato,?>> celdas = new LinkedList<HasCell<ObjetoDato,?>>(); 
        celdas.add(celda1); 
        celdas.add(celda2); 
        CompositeCell<ObjetoDato> cell = new CompositeCell<ObjetoDato>(celdas); 

        Column<ObjetoDato,ObjetoDato> columna = new Column<ObjetoDato,ObjetoDato>(cell) { 
          @Override 
            public ObjetoDato getValue(ObjetoDato object) { 
             return object; 
            } 
        }; 

        //columna.setCellStyleNames("columna3puntos"); 
        tabla.agregarColumna(columna,actual.getCaption()); 

Answer 1

render() 메소드의 사용법을 살펴볼 수 있습니다. 또한 내부 셀이 <div>과 같은 블록 요소를 사용하는 경우 수직으로 표시됩니다. 그래서 이것을 <span>으로 변경할 수 있습니다. 또는 style = "float : left;"를 추가 할 수 있습니다. div의 CSS에. 나는 너와 비슷한 것을 가졌다. 그러나 광산은 1 열 아래 등으로 2 행 테이블의 정의 셀이었다

+----+ 
| | 
+----+ 
| | 
+----+ 

나는 이러한 사용자 지정 세포의 수를 포함하는 셀리스트를 사용했다. CellList의 문제점은 세로로 표시한다는 것입니다. 그래서 수평으로 표시하기 위해 CellList를 재정의해야했습니다. 나는 CellList의 템플릿을 수정하여 float : left를 만들고 아래 그림과 같이 셀을 수평으로 렌더링하기 시작했습니다.

+----+  +----+ +----+ 
| |  | | | | 
+----+  +----+ +----+ 
| |  | | | | 
+----+  +----+ +----+