Vaadin甘特图不可读

时间:2017-01-29 11:30:44

标签: vaadin gantt-chart

我想使用vaadin甘特图组件并使用一些代码示例进行测试。 我可以创建对象但不可读

public class PlanningView extends VerticalLayout implements View {

    // declare parent GUI
    private MainUI myUI;
    // declare navigator
    public Navigator navigator;
    // declare menubar
    public MenuGenerator menubar;
    private TimeZone defaultTimeZone;

    private Gantt gantt;
    private NativeSelect reso;
    private DateField start;
    private DateField end;
    private SimpleDateFormat dateFormat = new SimpleDateFormat("MMM dd HH:mm:ss zzz yyyy");

    public PlanningView(Navigator navigator, MainUI myUI) {
        this.myUI = myUI;
        this.navigator = navigator;
        menubar = new MenuGenerator(this);

        VerticalLayout mainlayout = new VerticalLayout();

        gantt = new Gantt();
        gantt.setWidth(100, Unit.PERCENTAGE);
        gantt.setHeight(500, Unit.PIXELS);
        gantt.setResizableSteps(true);
        gantt.setMovableSteps(true);

        Calendar cal = Calendar.getInstance();
        cal.setTime(new Date());
        gantt.setStartDate(cal.getTime());
        cal.add(Calendar.YEAR, 1);
        gantt.setEndDate(cal.getTime());

        cal.setTime(new Date());
        Step step1 = new Step("First step");
        step1.setStartDate(cal.getTime().getTime());
        cal.add(Calendar.MONTH, 2);
        step1.setEndDate(cal.getTime().getTime());

        gantt.addStep(step1);


        mainlayout.addComponents(gantt);

        addComponent(mainlayout);
    }
    @Override
    public void enter(ViewChangeEvent arg0) {
        // TODO Auto-generated method stub
        Notification.show("Planning");
    }
    public void navigate(String page) {
        navigator.navigateTo(page);
    }
}

这就是它的样子:

screenshot

1 个答案:

答案 0 :(得分:0)

我遇到了同样的问题,过了一会儿,我找到了解决方案。

首先,您必须在主题中添加addons.scss文件

web应用程序/ VAADIN /主题/ mytheme的/ addons.scss:

/* This file is automatically managed and will be overwritten from time to time. */
/* Do not manually edit this file. */

/* Provided by gantt-addon-1.0.1.jar */
@import "../../../VAADIN/addons/gantt/gantt.scss";


/* Import and include this mixin into your project theme to include the addon themes */
@mixin addons {
    @include gantt;
}

然后,修改您的主题文件:

web应用程序/ VAADIN /主题/ mytheme的/ mystyle.scss:

@import "addons.scss";
@import "../../../VAADIN/addons/gantt/gantt-valo.scss";
@include addons;
@include gantt-valo;    

此外,您的小部件集需要从gantt插件中继承:

<module>
    <inherits name="org.tltv.gantt.WidgetSet" />
</module>

在使用自定义客户端代码时,必须将客户端编译器依赖项添加到构建过程中:

<dependency>
    <groupId>com.vaadin</groupId>
    <artifactId>vaadin-client-compiler</artifactId>
</dependency>

注意vaadin-maven.plugin,必须告诉它编译小部件集:

<plugin>
    <groupId>com.vaadin</groupId>
    <artifactId>vaadin-maven-plugin</artifactId>
    <version>${com.vaadin_version}</version>
    <configuration>
        <extraJvmArgs>-Xmx1G  -Xss1G</extraJvmArgs>
        <webappDirectory>${basedir}/src/main/webapp/VAADIN/widgetsets</webappDirectory>
        <hostedWebapp>${basedir}/src/main/webapp/VAADIN/widgetsets</hostedWebapp>
        <compileReport>true</compileReport>
        <strict>true</strict>
    </configuration>
    <executions>
        <execution>
            <goals>
                <goal>resources</goal>
                <goal>update-theme</goal>
                <goal>update-widgetset</goal>
                <goal>compile</goal>
            </goals>
        </execution>
    </executions>
</plugin>