GWT Tree styling

Ich habe einen normalen Tree-widget, das will ich Stil. Ich weiß, Tree widget hat zu folgenden Stile:

•.gwt-Baum { Baum selbst }
•.gwt-Baum .gwt-TreeItem { ein Baum-Element,}
•.gwt-Baum .gwt-TreeItem-selected { ein ausgewähltes Strukturelement }

Den Menschen webb schickte mir diese CSS-und HTML als Beispiel, wie es Aussehen sollte

css:

/* Menu styling */
    #menu li {
        margin-top: 8px;
        margin-bottom: 8px;
        /*margin: 8px 0 8px 0;*/
        padding: 0;
    }

    .menuitems,.indented {
        background: none repeat scroll 0 0 transparent;
        border-width: 0;
        float: left;
        font-size: 100%;
        list-style-image: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

    .menuitems a { *
        display: block; *
        float: left; *
        clear: left;
    }

    .indented {
        border-left: 1px solid #005284;
        border-right: none;
        padding-left: 5px;
        margin-left: 20px;
    }

    .menuitems a {
        color: #000000;
        display: block;
    }

    .menuitems a:hover {
        text-decoration: underline;
    }

    .currentpage a {
        color: #C60;
        font-weight: bold;
    }

- und html -

<div id="menu">
        <ul class="menuitems">
            <li>
                <a href="abc">Option 1</a> 
            </li>
            <li>
                <a href="abc">Option 2</a> 
            </li>
            <li>
                <a href="abc">Option 3</a> 
                <ul class="indented">
                    <li class="currentpage">
                        <a href="blabla">subselection</a>
                    </li>
                    <li>
                        subselection 2
                    </li>
                </ul>
            </li>
            <li>
                <a href="abc">Option 4</a> 
            </li>
        </ul>   
    </div>

Bin ich kämpfen ein bisschen, um dies zu sehen, wie Sie wollen. Ich bin mit uibinder.

  • Sollte ich eine .css Datei oder ui:style in den ui-binder-Datei?
  • Muss ich entfernen die Standard-Stile mit "removeStyleName" und setStyleName an jedem Baum Element?

Thx

Update:

Finden Sie heraus, wie hinzufügen von Bildern zu Blättern. Machen Sie eine Schnittstelle:

public interface TreeResources extends Resources {
     ImageResource treeOpen();
     ImageResource treeClosed();
  }

Erstellen der Baum mit GWT.erstellen.
stellen Sie sicher, dass die Bilder mit den passenden Namen (treeOpen.gif, treeClosed.gif) befinden sich im gleichen Ordner, oder Sie konnte, und Anmerkungen darauf hinzuweisen.

Frage ist, wie man Sie auf der rechten Seite anstelle von der linken Seite?

  • Finden Sie heraus, wie hinzufügen von Bildern zu Blättern. Machen und interface: public interface TreeResources extends Resources { ImageResource treeOpen(); ImageResource treeClosed(); } stellen Sie sicher, dass die Bilder mit den passenden Namen in dem selben Ordner. Die Frage ist, wie man Sie auf der rechten Seite statt?
Schreibe einen Kommentar