GridActionRenderer discussion

This is a discussion thread for
GridActionRenderer
. I’m afraid I won’t be available for comments for the next four weeks at least, but I’ll read any comments when I get back. In the meantime, please help each other.

Great stuff. This is something that is really misssing from the Grid and as you may be aware there’s been some attempts for this from the community. None of them 100% succesful.

For row actions in a Grid I’m currently using the
context-menu
which was introduced a few months ago. It does the job but the user needs to be aware that right-clicking a row is a possibility in the first place. (from experience this is not obvious to many users). All in all I would much rather prefer the idea of action buttons in the Grid itself, i.e. what your add-on is about.

I’ll test it out but your demo is a bit weak for my taste. I could use a screenshot. And it seems I have to learn what an Vaadin Action is :slight_smile:

Peter

Tested it. Works fine. Very easy to use. And I didn’t have to learn about Vaadin Actions. :slight_smile:

I do have a few comments which are listed below.

Below is my first attempt. It uses a slightly modified version of Anna’s demo. As you can see it uses the traditional “Delete” and “Edit” buttons (for no other reason than because this is the typical use case). Also I like to have my action buttons as first column, rather than last. That is matter of taste. Here’s what the add-on looks like in action:



Focus issue


But let’s try to actually click something:

From the screenshot I hope you can see the problem: Just like the
context-menu add-on
there’s a focus event problem. In the screenshot I click row5 yet the first row, first cell gets a focus border as a result of my click on row5. This is very confusing for the user as it will create confusion as to what was actually clicked. One solution for this is to turn off focus style for the Grid. But I really believe it should be solved in the add-on. With the context-menu add-on I remember there was some discussion amongst Vaadin employees wether a right-click should fire a focus event to the cell that was clicked. Possibly debatable although I would personally say yes. For a left-click I don’t think there can be any debate: the cell focus should move to the cell that was clicked.


Scaling with the theme

I’ve also looked at how well the add-on works when the theme is scaled up a down. As you may be aware the excellent Valo theme has a feature by which everthing scales with the font size you set (
$v-font-size
, which defaults to 16px). This scaling in Valo applies to everything: component sizes, icon sizes, margins, insets, etc.

So lets have a look. Here’s the example again but this time with 10px font size in Valo theme:

As you can see the icons have been scaled down but the space between them hasn’t which makes it look less than ideal. So some kind of hardcoded size here. It obviously becomes worse if we scale up where the icons will be almost overlapping:

The problem is caused by a
hardcoded size of 25px width
for the HTML box where the icons are rendered. I don’t know if this can be changed so that it scales with the scale of the theme. That would be neat.

Conclusion: All in all this is by far the best attempt I’ve seen at having a row of “action buttons” in the Vaadin Grid. I’ll use it.

Thank you for the very nice addon. It is exactly right thing which is missing in the original Grid.

I have successfully tried demo from github. I have depolyed it on the local JBOSS server. It is based on maven and there is no problem.

I’m using grade in my porject.
I have added “compile ‘org.vaadin.anna:gridactionrenderer:1.0.1’” to by build.gradle and all server-side works fine, but client side does not work, I got “Uncaught client-side exception”.

I’m new in vaadin, so, may be I forgot to add some requred dependency to make work client side?
Here is my build.gradle:

buildscript {
  ext {
    springBootVersion = '1.4.0.RELEASE'
  }
  repositories {
    mavenCentral()
  }
  dependencies {
    classpath("org.springframework.boot:spring-boot-gradle-plugin:${springBootVersion}")
  }
}

apply plugin: 'java'
apply plugin: 'idea'
apply plugin: 'spring-boot'

jar {
  baseName = 'snt'
  version = '0.0.1-SNAPSHOT'
}

sourceCompatibility = 1.8
targetCompatibility = 1.8

repositories {
  mavenCentral()
    maven { url "http://maven.vaadin.com/vaadin-addons" }
}


dependencies {

  compile 'org.springframework.boot:spring-boot-starter-data-jpa'

  compile 'com.vaadin:vaadin-spring-boot-starter:1.0.0'
  compile 'org.vaadin:viritin:1.56'
  compile 'org.vaadin.anna:gridactionrenderer:1.0.1'

  testCompile('org.springframework.boot:spring-boot-starter-test')
}

dependencyManagement {
  imports {
    mavenBom "com.vaadin:vaadin-bom:7.7.0"
  }
}

27716.png

Thank you for the insightful feedback and reviews!

Peter raised very good points and I’ll try to do something about those issues once I get through my month-long backlog of all kinds of crucial things, so I’m afraid it might take a while :slight_smile: The width issue I was aware of but didn’t have time to refine before publishing the add-on, and I hadn’t thought about tying it to the $v-font-size – it’s a good idea if I can figure out how to make it work. The current implementation is with simple css, and I obviously can’t tie the add-on to Valo only. I’ll have to think about it. The focus problem I hadn’t noticed, but I know Grid’s focus handling is a bit tricky so I can definitely believe it needs some tweaking that I failed to take into account back in August. Might not be an easy issue to fix, but I’ll give it a shot when I find some time.

As for Pavel’s problem, I’m afraid I’ve never used Gradle myself, but I’ll see if I can get an opinion from our resident Gradle people.

Hi Pavel,

Since the addons contain client side code that needs to be compiled into Javascript you cannot use the DefaultWidgetset but instead you will need to compile your own widgetset.

With Gradle this can be done by using the
Gradle Vaadin Plugin
.

There is an example using Spring Boot and Gradle at
https://devsoap.com/building-spring-boot-vaadin-applications-with-gradle
you could have a look at. Copying it should allow you to get your project working.

Hi John,

Thank you for the reply. I will try to do so.