How to fit Sencha GXT table in to the Div it contains - vaadin

Hi I am new to Sencha GXT. I would like to know, How can I style a GXT grid.
I want to know this because I am currently integrating the sencha GXT grid into a Vaadin widget. I have successfully done that but, the problem is with the styling. Is there any documentation we can prefer.
Major problem is the grid works perfectly when I manually give it a width and a height but, What want is a to fit in to DIV it is in and re size the grid when the browser resizes.
Thank you.

http://docs.sencha.com/gxt-guides/3/concepts/appearance/Appearance_3.html
Here's a link to the docs, basically it follow the GWT paradigm, if you've seen it before.
But since you want to integrate GXT Grid in a Vaadin widget I'd like to ask about your needings.
I know the standard Vaadin seems a little.."poor"..but I encourage you to check out the new Grid widget in Vaadin 7.4-beta (est release Feb.): it rocks!

Related

Positioning a component in Vaadin Designer 3?

I use Vaadin Designer for framework 7. In this designer I can drag and drop a component and moving the component by clicking on it a moving it to the area I want.
And trying to do the same with the new Vaadin Designer 3. But it seems that AbsoluteLayout is deprecated and the replacement is Div. I drag a Div and on top of it a Button. But I can not move the Button by selecting it a moving it using mouse. Is this possible in Vaadin Designer 3?
BTW I dont want to position the Button using CSS.
Currently there is no AbsoluteLayout in Vaadin 10 and AFAIK not even a plan for such. As that isn't there and Vaadin Designer not supporting absolute positioning directly, this just isn't possible currently with Vaadin 10+ versions. Thus, if you need this feature, I suggest to go with Vaadin 8, which has many of most essential the improvements and will still be supported for many years.

Vaadin Flow Grid has no height

I have the following Grid showing Java system properties:
systemPropertyGrid = new Grid<>();
systemPropertyGrid.setItems(buildSystemProperties());
systemPropertyGrid.addColumn(SystemProperty::getProperty).setHeader("Property").setFlexGrow(1);
systemPropertyGrid.addColumn(SystemProperty::getValue).setHeader("Value").setFlexGrow(5);
systemPropertyGrid.setHeight("500px");
All items are shown when I replace the setHeight by setHeightByRows(true). But as soon as I don't specify systemPropertyGrid.setHeightByRows(true) the grid has a calculated height of 2 pixels in the browser (Firefox, Edge) which is the border. However, the element style height is correctly set to 500px as I can see in Firefox developer tools.
Bug in Vaadin Flow? How is this even possible that the browser doesn't use the element style height ultimately?
Screenshot:
SSCCE using the Vaadin Flow spring starter:
my-starter-project_51443246.zip. Call maven goal springBoot:run.
You are right. It doesn't work in Firefox, while it works in Chrome. You can submit an issue in GitHub.
As a workaround, if you set the height of the parent VerticalLayout, it works in both Chrome and Firefox. So, add the following statement:
setHeight("500px");
Fixed in Vaadin Grid v5.0.5 which has been released as part of Vaadin 10.0.9 or Vaadin 11.0.4. So you need to make sure to use either of those. (which of course wasn't released at the time of the original posting)

Highcart reflow function when using as a polymer component

I'm using a polymer seed UI application, in which I needed to display some graphs so decided to use high charts. I created a custom component and added one of the charts e.g. barcharts and added this polymer component to my seed application do display the bar charts.
I am able to view the charts correctly, however, I faced an know issue of rendering the charts which didn't fit the container. In order to resolve it, I need to use highcart.reflow() event. But I don't know on which lifecycle of polymer I should do it and it will resize the charts correctly on page load.
any help is appreciated

Vaadin component visible event

Is there an event, or some other way, to know when a vaadin component becomes visible in the browser? This is not for hidden components. I mean when the component is off canvas, like in a different tab that is not selected. Or may be way down the page.
It may be late but i started to create a Vaadin add-on that wraps the jQuery Waypoints library so that You can listen to Vaadin components becoming visible by scrolling.
You can find an experimental release here:
https://vaadin.com/directory#!addon/waypoints-add-on
I haven't done it but maybe you can use jQuery Waypoints.

Browser problem with smartgwt drag & drop

I'm new to smartGWT. I've taken GWT components in a canvas that is draggable & added it into VStack. My code is working fine in IE but it is dissapearing on Firefox/Chrome. Any help is appreciable. Thanks in advance.
It sounds like you are trying to freely intermix SmartGWT and GWT components, which is something we don't recommend doing. See this item in the SmartGWT FAQ.
Specific patterns of mixing GWT components into SmartGWT (and vice versa) are supported (the above FAQ item explains this). If you think your usage falls into one of those patterns, post a standalone test case of what you're trying to do (to the SmartGWT Forums).

Resources