6

DataGrid.cssで定義されたdataGridHeaderスタイルをオーバーライドする方法を理解しようとしています！GWTコア。GWTスタイル名はadler32で難読化されているため、cssで.dataGridHeaderを使用することはできません。私の場合、空白：通常の単純な変更を望みます。

ここでcssの挿入に関する記事を見たことがありますが、それらはすべて、DataGridなどのコンポーネント内で使用されるサブスタイルではなく、クラスレベルのように見えます。

DataGridなどのコンポーネント内で使用されるヘッダースタイルをオーバーライドするにはどうすればよいですか？

4

2 に答える 2

10

ClientBundleany and と同様に、独自の CSS ファイル (または元のファイルと独自のファイルの両方を指すため、それらが結合される可能性があります) を指す注釈を使用して、メソッドCssResourceを拡張Datagrid.Resourcesおよびオーバーライドするインターフェイスを作成します。dataGridStyle@Source

ただし、そのようにすると、アプリ内のすべて の のスタイルがオーバーライドさDataGridれます (実際には、どちらのCssResourceインスタンスがensureInjected()最初に取得されるかによって異なります: 元のインスタンスDataGrid.Resourcesまたはサブインターフェイスからのインスタンス): 同じ戻り値の型 ( DataGrid.Style) を使用するため、難読化されたクラス名は同じになります。

ケースバイケースでスタイルを変更する場合は、さらに、拡張するインターフェイスを宣言し、それをオーバーライドDataGrid.Styleへの戻り値の型として使用しdataGridStyleます。難読化されたクラス名は、完全修飾されたインターフェイスの両方に基づいているためです。名前とメソッド名を変更すると、DataGrid.Styleサブインターフェースは元のインターフェースとは異なる難読化されたクラス名を生成しDataGrid.Styleます。

次に、もちろん、GWT.create()サブDataGrid.Resourcesインターフェイスを作成し、それを引数としてDataGridコンストラクターに渡します。

http://code.google.com/p/google-web-toolkit/issues/detail?id=6144も参照してください。

于 2012-06-04T08:06:27.600 に答える
9

ありがとうトーマス。

読者にとって分かりやすいように…

新しいインターフェースを作成する

public interface GwtCssDataGridResources extends DataGrid.Resources {
      @Source({Style.DEFAULT_CSS, "gwtDataGrid.css"})
      Style dataGrid();
}

静的参照を使用する

public static final GwtCssDataGridResources gwtCssDataGridResources = GWT.create(GwtCssDataGridResources.class);

    static {
        gwtCssDataGridResources.dataGrid().ensureInjected();
    }

最後に、新しい CSS ファイル gwtDataGrid.css を作成します。スタイルをオーバーライドする必要がある場合は、各定義で!importantを使用する必要があることに注意してください。

.dataGridHeader {
    color: #FF0000 !important;
}

.dataGridFirstColumnHeader {
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
}

.dataGridLastColumnHeader {
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
}

それでおしまい

于 2013-01-11T11:39:12.047 に答える