GWT 2.2 CellTable에서 TextInputCell을 클리핑하지 않고 열의 너비를 설정 하시겠습니까?

Question

나는 약간 특이한 문제가 있습니다. GWT 2.2 릴리스에서 CellTable을 사용하고 있습니다. CellTable은 고정 레이아웃으로 구성됩니다. 테이블에 편집 가능한 열 (TextInputCell)이 있습니다.

현재 셀 너비를 고정하기 위해 CellTabel에서 setColumnWidth 메서드를 사용하고 있습니다. 이것은 잘 작동하지만 은 입력 텍스트 요소에 대한 폭 제한을 적용하지 않습니다. 결과적으로 편집기 입력 필드가 열 아래로 오버 플로우되어 잘라내는 느낌을줍니다.

다음은 문제를 설명하기 위해 수정 된 GWT 문서의 코드 샘플입니다. 이름 필드의 크기가 조정되지 않고 테이블 내부에서 오버플로됩니다.

공용 클래스 평가판 EntryPoint를 구현 { 개인 정적 클래스 연락 { 개인 정적의 INT nextId = 0;

private final int id; 
    private final String address; 
    private Date birthday; 
    private String name; 
    private Long number; 

    public Contact(String name, Date birthday, String address, Long number) 
    { 
     nextId++; 
     this.id = nextId; 
     this.name = name; 
     this.birthday = birthday; 
     this.address = address; 
     this.number = number; 
    } 
} 

private static final List<Contact> CONTACTS = Arrays.asList(new Contact("John", new Date(80, 4, 12), "123 Fourth Avenue", 0L), new Contact("Joe", 
     new Date(85, 2, 22), "22 Lance Ln", 1L), new Contact("George", new Date(46, 6, 6), "1600 Pennsylvania Avenue", 2L)); 


public void onModuleLoad() 
{ 
    final CellTable<Contact> table = new CellTable<Contact>(10); 
    table.setWidth("60px", true); 
    ListDataProvider<Contact> listPrvdr; 

    final TextInputCell nameCell = new TextInputCell(); 
    Column<Contact, String> nameColumn = new Column<Contact, String>(nameCell) 
    { 
     @Override 
     public String getValue(Contact object) 
     { 
      return object.name; 
     } 
    }; 
    table.addColumn(nameColumn, "Name"); 
    table.setColumnWidth(nameColumn, "60px"); 

    nameColumn.setFieldUpdater(new FieldUpdater<Contact, String>() 
    { 
     public void update(int index, Contact object, String value) 
     { 
      object.name = value; 
      table.redraw(); 
     } 
    }); 

      listPrvdr = new ListDataProvider<Contact>(); 
    listPrvdr.addDataDisplay(table); 
    RootPanel.get().add(table); 

    listPrvdr.getList().addAll(CONTACTS); 
} 

}

나는 무엇을 놓치고? 호스트 열뿐 아니라 입력 필드에 너비 제약 조건을 적용하려면 어떻게해야합니까?

Answer 1

나는 모든 niggles를 관리하기 위해 외부 CSS를 사용했습니다. 어쨌든 TextInputCell을 하위 클래스 화해야했기 때문에 많은 노력을 기울이지 않았습니다. 하위 클래스가 아니며 어떤 이유로 든 외부 CSS 수정을 사용할 수없는 경우 TextInputCell 요소의 스타일을 직접 지정할 수있는 방법이 없습니다.

누구에게 더 좋은 해결책이 있다면이 스레드에 답장하여 공유하십시오.

Answer 2

최대한 멀리는 개인 부재 (EditTextCell뿐만 아니라)이 내부 TextInputCell

private static Template template; 

내측 입력 요소의 뷰에 대한 관심을 이해한다. 나는 (TextInputCell이처럼) AbstractEditableCell에서 내 클래스를 확장하고처럼 내 자신의 템플릿을 할당했다 :

@Template("<input type=\"text\" value=\"{0}\" tabindex=\"-1\" size=\"{1}\" maxlength=\"{1}\" style=\"{2}\"></input>") 

Answer 3

...... 
    Column<yyyData,String> xxxColumn = new Column<yyyData,String> 
       (new TextInputCell()) { 
     @Override 
     public String getValue(yyyData data) { 
      return String.valueOf(data.getxxx()); 
     } 
     @Override 
     public String getCellStyleNames(Context context,yyyData data) 
     { 
      if (Float.valueOf(data.getxxx()) <= 61) 
       return ("test"); 
      else 
       return ("mystyle"); 
     } 
    }; 
........ 

css file 
    .test input,td.test input{ 
     width: 4em; 
     border: 1px solid #FFFF66; 
    } 
    .mystyle input, td.mystyle input { 
      width: 2em; 
      border: 2px solid #2396AF; 
    } 

Answer 4

난 그냥 좀 더 도움을 필요로 누군가를 위해 전체 노동자 계급을 게시합니다 :

을

static class MyInputCell extends TextInputCell 
{ 
    private static Template template; 

    interface Template extends SafeHtmlTemplates 
    { 
     // {0}, {1}, {2} relate to value, size, style 
     @Template("<input type=\"text\" value=\"{0}\" tabindex=\"-1\" size=\"{1}\" maxlength=\"{1}\" style=\"{2}\"></input>") 
     SafeHtml input(String value, String size, String style); 
    } 

    public MyInputCell() 
    { 
     template = GWT.create(Template.class); 
    } 

    @Override 
    public void render(Context context, String value, SafeHtmlBuilder sb) 
    { 
     // Get the view data. 
     Object key = context.getKey(); 
     ViewData viewData = getViewData(key); 
     if(viewData != null && viewData.getCurrentValue().equals(value)) 
     { 
      clearViewData(key); 
      viewData = null; 
     } 

     String s = (viewData != null) ? viewData.getCurrentValue() : value; 
     if(s != null) 
     { 
      // this is where we set value, size, style 
      sb.append(template.input(s, "3", "width: 50px")); 
     } 
     else 
     { 
      sb.appendHtmlConstant("<input type=\"text\" tabindex=\"-1\"></input>"); 
     } 
    }