New Grid Component scrollbar issues.

I am trying to use the new vaadin component

Grid.

But when i add a basic grid to the page I get the horizontal and vertical scrollbar on the top and the grid contents at the bottom.

18444.png

Looks like the theme for the Grid component is missing. Are you using one of the built-in themes, or do you have a custom theme?

Thank you very much. Yes. I do use a custom theme. And i found out that it is the culprit.

Commented the custom theme and the grid came out fine. But i do want to use the custom theme.

How do i included the necessary theme of grid?

If you extend any of the built-in themes, it should come with that. If you’ve extracted your theme from a previous Vaadin version, you need to re-extract it from 7.4.0 to get the Grid theme included.

What built-in theme are you using as the starting point for your custom theme? Can you share your main stylesheet, how you import and include the built-in theme?

I just had the same problem today. The problem always occurs if I compile my custom theme with the “Compile Theme” button in Eclipse, but not if I compile it with a build script. I’ll try to investigate the issue further.

My problem was apparently caused by TouchKit, as it depends on vaadin-themes-7.3. Excluding the library does not seem to affect TouchKit, as it doesn’t use the regular Vaadin themes.

For example, in ivy.xml you can exclude it as follows:

<dependency org="com.vaadin.addon" name="vaadin-touchkit-agpl" rev="4.0.0" conf="default,widgetset-compile->default"> <exclude org="com.vaadin" name="vaadin-themes"/> </dependency> There could be some other factor affecting the problem, as it appeared rather suddenly for me. Perhaps the Ivy configuration mappings or something else.

The problem I had can also be solved by having the newer vaadin-themes dependency in the widgetset-compile conf as follows:

<dependency org="com.vaadin"
            name="vaadin-themes"
            rev="&vaadin.version;"
            conf="nodeploy,default,widgetset-compile->default"/>

There’s now tickets
#16944
and
#16946
about the issue; I’m not entirely sure which is the real problem.

Thank you very much for your timely help Jouni Koivuviita. Yes i did upgrade from vaadin 7.3.10 to 7,4 and I regenerated my custom theme and it fixed the issue.

I have the same issue, but i don’t know how to “regenerate” my custome theme.
Can someone help me, please?

I’ve tried the solution of marko (adding the dependency), but nothing changed.
I’m using the dashboard css

@import "../valo/valo";
@import "common";
@import "views/login";
@import "views/dashboardview";
@import "views/schedule";
@import "views/sales";
@import "views/transactions";
@import "views/reports";

// Optimize the CSS output
$v-included-components: remove($v-included-components, accordion);
$v-included-components: remove($v-included-components, colorpicker);
$v-included-components: remove($v-included-components, grid);
$v-included-components: remove($v-included-components, popupview);
$v-included-components: remove($v-included-components, progressbar);
$v-included-components: remove($v-included-components, slider);
$v-included-components: remove($v-included-components, splitpanel);
$v-included-components: remove($v-included-components, tree);
$v-included-components: remove($v-included-components, treetable);
$v-included-components: remove($v-included-components, twincolselect);

// Main layout padding
$view-padding: round($v-unit-size / 1.5) !default;

// Slight adjustment to menu background-color
$valo-menu-background-color: #414B56;

@mixin dashboard {
  @include valo;
  @include dashboard-common;
  @include dashboard-login-view;
  @include dashboard-dashboard-view;
  @include dashboard-schedule-view;
  @include dashboard-sales-view;
  @include dashboard-transactions-view;
  @include dashboard-reports-view;
}

Thanks

remove the below line
$v-included-components: remove($v-included-components, grid);
and regenerate.

First of all, thanks for your help!
Good tip your one, seems legit.
I’ve cleared my scss , but the problem is still there (i’ve recompiled my theme).

Here’s the scss cleared, do you see any other problem?



EDIT: i’ve closed and repoened eclipse, and it worked!

Thank you so much Srinivasan !

@import "../valo/valo";
@import "common";
@import "views/login";
@import "views/dashboardview";


// Main layout padding
$view-padding: round($v-unit-size / 1.5) !default;

// Slight adjustment to menu background-color
$valo-menu-background-color: #414B56;

@mixin dashboard {
  @include valo;
  @include dashboard-common;
  @include dashboard-login-view;
  @include dashboard-dashboard-view;
}

its some caching issues. I had similar problem. I left work and next day it worked :).