CellTables и CSS (GWT) - PullRequest
Новая
       3

CellTables и CSS (GWT)

8 голосов
/ 10 сентября 2011

Может ли кто-нибудь помочь мне в настройке фона строки CellTable пожалуйста, я пытался всю ночь сделать это и продолжать терпеть неудачу, и это сводит меня с ума. Я пытался использовать вызов setRowStyles(), но это кажется, не работает, и я читал, что вы не можете изменить стиль для CellTable после того, как стиль был установлен - как стиль по умолчанию установлено. Затем я попытался создать CellTable со своим собственным интерфейсом. CellTableResources как видно из поста на эту тему, НО дал мне сообщения об ошибках об элементах ccs unobfuscated .... которые мои css, не будучи запутанным, является очевидным сообщением об ошибке. Теперь я не знаю, что попробовать, и я официально застрял.

Я читал об этом @external, и это, похоже, не помогло ... даже не уверен, куда должен идти внешний бит ... Я думаю, в css, но, как обычно, когда застрял, я ' Я пытаюсь что-нибудь!

TonyK

1 Ответ

13 голосов
/ 10 сентября 2011

Я знаю, как это может быть неприятно, я был в том же месте. Я включил все шаги, которые я использовал, чтобы заставить это работать. Но, похоже, вы почти у цели, поэтому вам, вероятно, не понадобится все это.

Как вы уже упоминали, чтобы использовать собственные имена классов CSS, вы должны реализовать com.google.gwt.user.cellview.client.CellTable.Resources и передать экземпляр вашего класса в конструктор CellTable.

Объявление CellTable 

CellTable<MyData> myCellTable = new CellTable<MyData>(10, MyResources.INSTANCE);

Для реализации ресурсов также требуется экземпляр com.google.gwt.resources.client.ImageResource и com.google.gwt.user.cellview.client.CellTable.Style , класс, который предоставит ваши имена классов CSS. Для простоты здесь используются заглушки реализаций Resources, ImageResource и Style, которые ничего не делают, но предоставляют строки в качестве имен стилей. В конце концов, они могут поступать из ClientBundle, но это не является обязательным требованием.

Заглушка стиля (с использованием строковых литералов) 

import com.google.gwt.user.cellview.client.CellTable.Style;

public class MyStyle implements Style {

    public static final MyStyle INSTANCE = new MyStyle();

    @Override public boolean ensureInjected() {

        return false;
    }

    @Override public String cellTableCell() {

        return "myCssClassName";
    }

    @Override public String cellTableEvenRow() {

        return "myCssClassName";
    }

    @Override public String cellTableEvenRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableOddRow() {

        return "myCssClassName";
    }

    @Override public String cellTableOddRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableFirstColumn() {

        return "myCssClassName";
    }

    @Override public String cellTableFirstColumnFooter() {

        return "myCssClassName";
    }

    @Override public String cellTableFirstColumnHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableFooter() {

        return "myCssClassName";
    }

    @Override public String cellTableHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableHoveredRow() {

        return "myCssClassName";
    }

    @Override public String cellTableHoveredRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableKeyboardSelectedCell() {

        return "myCssClassName";
    }

    @Override public String cellTableKeyboardSelectedRow() {

        return "myCssClassName";
    }

    @Override public String cellTableKeyboardSelectedRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableLastColumn() {

        return "myCssClassName";
    }

    @Override public String cellTableLastColumnFooter() {

        return "myCssClassName";
    }

    @Override public String cellTableLastColumnHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableLoading() {

        return "myCssClassName";
    }

    @Override public String cellTableSelectedRow() {

        return "myCssClassName";
    }

    @Override public String cellTableSelectedRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableSortableHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableSortedHeaderAscending() {

        return "myCssClassName";
    }

    @Override public String cellTableSortedHeaderDescending() {

        return "myCssClassName";
    }

    @Override public String cellTableWidget() {

        return "myCssClassName";
    }

    @Override public String getName() {

        return "myCssClassName";
    }

    @Override public String getText() {

        return "myCssClassName";
    }
}

Заглушка ImageResource 

import com.google.gwt.resources.client.ImageResource;

class MyImageResource implements ImageResource {

    public static final MyImageResource INSTANCE = new MyImageResource();

    @Override public int getHeight() {

        return 0;
    }

    @Override public int getLeft() {

        return 0;
    }

    @Override public String getName() {

        return "";
    }

    @Override public int getTop() {

        return 0;
    }

    @Override public String getURL() {

        return "";
    }

    @Override public int getWidth() {

        return 0;
    }

    @Override public boolean isAnimated() {

        return false;
    }
}

Заглушка ресурса 

import com.google.gwt.resources.client.ImageResource;
import com.google.gwt.user.cellview.client.CellTable.Resources;
import com.google.gwt.user.cellview.client.CellTable.Style;

public class MyResources implements Resources {

    public static final MyResources INSTANCE = new MyResources();

    @Override public ImageResource cellTableFooterBackground() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableHeaderBackground() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableLoading() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableSelectedBackground() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableSortAscending() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableSortDescending() {

        return MyImageResource.INSTANCE;
    }

    @Override public Style cellTableStyle() {

        return MyStyle.INSTANCE;
    }
}

Итак, на данный момент у вас должна быть Cell Tabula Rasa без стиля, и вы должны иметь возможность проверять свой элемент CellTable в браузере и видеть myCssClassName как вездесущее имя класса CSS, без всяких сомнений.

Если в этот момент вы ссылаетесь на таблицу стилей с помощью одного из традиционных методов, вы сможете настроить строки «myCssClassName» в соответствии с вашей конкретной таблицей стилей.

Ссылка на таблицу стилей 

<link href="myStyleSheet.css" rel="stylesheet" type="text/css">

Теперь, если вы хотите внедрить свои стили с помощью ClientBundle, у вас есть несколько дополнительных шагов.

Во-первых, убедитесь, что в какой-то момент вы вводите таблицу стилей; это действительно легко забыть. Простое место в EntryPoint вашего модуля, так что вы можете быть уверены, что он вызывается.

CssResource Injection 

MyClientBundle.INSTANCE.myCssResource().ensureInjected();

Наконец, используйте ваш CssResource, чтобы предоставить имена для реализации Style ранее. Независимо от того, запутываются ли имена классов CSS, они должны вводиться и таким образом использовать правильное имя.

Заглушка ClientBundle 

import com.google.gwt.core.client.GWT;
import com.google.gwt.resources.client.ClientBundle;

public interface MyClientBundle extends ClientBundle {

    public static final MyClientBundle INSTANCE = GWT.<MyClientBundle>create(MyClientBundle.class);

    @Override @Source("path/to/myStyleSheet.css") MyCssResource myCssResource();
}

Заглушка CssResource 

import com.google.gwt.resources.client.CssResource;

public interface MyCssResource extends CssResource {

    @ClassName("myCssClassName") String myCssClassName();

    @ClassName("myOtherName") String myOtherCssClassName();
}

Заглушка таблицы стилей 

.myCssClassName {
    background-color: magenta;
    /* Yes, you will see when it is working. */
}

@external .myOtherName {
    background-color: yellow;
}

Стиль заглушки (с помощью ClientBundle) 

import com.google.gwt.user.cellview.client.CellTable.Style;

public class MyStyle implements Style {

    public static final MyStyle INSTANCE = new MyStyle();

    @Override public boolean ensureInjected() {

        return false;
    }

    @Override public String cellTableCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableEvenRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableEvenRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableOddRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableOddRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFirstColumn() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFirstColumnFooter() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFirstColumnHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFooter() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableHoveredRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableHoveredRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableKeyboardSelectedCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableKeyboardSelectedRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableKeyboardSelectedRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLastColumn() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLastColumnFooter() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLastColumnHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLoading() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSelectedRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSelectedRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSortableHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSortedHeaderAscending() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSortedHeaderDescending() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableWidget() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String getName() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String getText() {

        return MyCssResource.INSTANCE.myCssClassName();
    }
}

Так и должно быть. Я уверен, что есть другие способы сделать то же самое, но до сих пор это работало хорошо для меня. Удачи, и я надеюсь, что это сэкономит вам время.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...