5

私はかなり独特の問題を抱えています。GWT 2.2 リリースの CellTable を使用しています。CellTable は、固定レイアウト用に構成されています。テーブルに編集可能な列 (TextInputCell) があります。

現在、CellTabel で setColumnWidth メソッドを使用して、列の幅を修正しています。これはうまく機能しますが、入力テキスト要素に幅の制約が適用されません。その結果、エディターの入力フィールドが列の下にオーバーフローし、切り取られたような印象を与えます。

問題を示すために変更された GWT ドキュメントのコード サンプルを次に示します。名前フィールドのサイズが変更されておらず、テーブル内にオーバーフローしていることに注意してください。

public class Trial は EntryPoint を実装します { private static class Contact { private static 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 );
}

}

ここに画像の説明を入力

私は何が欠けていますか？ホスト列だけでなく、入力フィールドに幅の制約を適用するにはどうすればよいですか?

4

4 に答える 4

3

私の知る限り、個人会員

private static Template template;

TextInputCell（およびEditTextCell）の内部は、内部の入力要素のビューを考慮します。（TextInputCellのように）AbstractEditableCellからクラスを拡張し、次のような独自のテンプレートを割り当てました。

@Template("<input type=\"text\" value=\"{0}\" tabindex=\"-1\" size=\"{1}\" maxlength=\"{1}\" style=\"{2}\"></input>")
于 2011-06-08T17:56:25.123 に答える
2

私は外部 CSS を使用して、すべての小さな問題を管理しました。とにかく TextInputCell をサブクラス化する必要があったので、それほど手間はかかりませんでした。サブクラス化を行っておらず、何らかの理由で外部の CSS 修正を使用できない場合、TextInputCell 要素のスタイルを直接設定する方法はありません。

誰かがより良い解決策を持っている場合は、このスレッドに返信して共有してください。

于 2011-03-21T08:04:23.837 に答える
1 
  ......
    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;
    }
于 2012-07-26T04:28:56.630 に答える