Làm thế nào để ghi đè kiểu GWF obfuscated cho tiêu đề DataGrid

Question

Tôi đang cố gắng tìm ra cách ghi đè kiểu dữ liệuGridHeader được xác định trong DataGrid.css! GWT cốt lõi. Tên phong cách GWT được obfuscated với adler32 vì vậy tôi không thể chỉ đơn giản là sử dụng .dataGridHeader trong css của tôi. Trong trường hợp của tôi, tôi muốn một sự thay đổi đơn giản của không gian trắng: bình thường.

Tôi đã xem các bài viết ở đây về việc gửi css nhưng tất cả chúng dường như là cấp lớp chứ không phải là một kiểu phụ được sử dụng trong một thành phần như DataGrid.

Làm cách nào để ghi đè kiểu tiêu đề được sử dụng trong một thành phần như DataGrid?

Answer 1

Cũng giống như với bất kỳ ClientBundle và CssResource: tạo ra một giao diện kéo dài Datagrid.Resources và override phương thức dataGridStyle với một chú thích @Source trỏ đến file CSS của riêng bạn (hoặc có thể để cả file gốc và file riêng của bạn, vì vậy họ sẽ được kết hợp với nhau).

Làm theo cách đó sẽ ghi đè lên phong cách cho tất cảDataGrid s trong ứng dụng của bạn mặc dù (nó thực sự phụ thuộc vào CssResource dụ được ensureInjected() đầu tiên: Ai là từ bản gốc DataGrid.Resources hoặc một từ tiểu giao diện của bạn): vì bạn sử dụng cùng kiểu trả về (DataGrid.Style), tên lớp bị xáo trộn sẽ giống nhau.

Nếu bạn muốn thay đổi kiểu theo từng trường hợp, ngoài ra, hãy khai báo giao diện mở rộng DataGrid.Style và sử dụng loại đó làm loại trả về số ghi dataGridStyle của bạn: vì tên lớp bị xáo trộn dựa trên cả tên giao diện đủ điều kiện và tên phương thức, giao diện phụ DataGrid.Style của bạn sẽ tạo ra các tên lớp bị xáo trộn khác với giao diện DataGrid.Style gốc.

Sau đó, tất nhiên, GWT.create() giao diện phụ DataGrid.Resources của bạn và chuyển giao nó làm đối số cho hàm tạo DataGrid.

Xem thêm http://code.google.com/p/google-web-toolkit/issues/detail?id=6144

Answer 2

Cảm ơn Thomas.

Chỉ cần để làm cho nó dễ dàng hơn cho các độc giả ...

Tạo một giao diện mới

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

Sử dụng một tham chiếu tĩnh

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

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

Cuối cùng tạo một file CSS mới gwtDataGrid.css . Lưu ý rằng nếu bạn cần ghi đè kiểu, bạn phải sử dụng ! Quan trọng trên mỗi định nghĩa.

.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; 
} 

Vậy đó