Framework: inline-icon is incorrectly rendered when using inside a FormLayout

Created on 27 Aug 2015  路  9Comments  路  Source: vaadin/framework

Originally by _aaaaa_aaaaa_


Based on the example code provided by oddcully@freenode which can be found at http://pastebin.com/uXgBxsG8

I am trying to create a textfield with an inline-icon based on examples from Valo demo code base, but I am unable to do so.

The inline icon works fine when working with a standalone TextField.

But the problem appears when attempting to use it for a TextField within a FormLayout.

Something similar to that shown in this [[Image(http://i.imgur.com/320qmI5.png)]]


Imported from https://dev.vaadin.com/ issue #18668

bug duplicate

Most helpful comment

I confirm it too in Vaadin 8.0, this code:

VerticalLayout verticalLayout = new VerticalLayout();
TextField nameField = new TextField("Name");
nameField.setIcon(FontAwesome.USER);
nameField.addStyleName(ValoTheme.TEXTFIELD_INLINE_ICON);
verticalLayout.addComponent(nameField);

produces this correctly:

screen shot 2016-12-16 at 10 24 59

while this code:

VerticalLayout verticalLayout = new VerticalLayout();
TextField nameField = new TextField("Name");
nameField.setIcon(FontAwesome.USER);
nameField.addStyleName(ValoTheme.TEXTFIELD_INLINE_ICON);
FormLayout formLayout = new FormLayout(nameField);
verticalLayout.addComponent(formLayout);

produces this:
screen shot 2016-12-16 at 10 27 16

When will this be addressed?

All 9 comments

Originally by _feelinforyou_


I have the same error in a FormLayout. The error also exists if you create Textfields for Filtering in Grid.

Originally by _Bugarin_


Yes. I can confirm this bug "feature" ;). Hope this gets fixed soon.

I confirm it too in Vaadin 8.0, this code:

VerticalLayout verticalLayout = new VerticalLayout();
TextField nameField = new TextField("Name");
nameField.setIcon(FontAwesome.USER);
nameField.addStyleName(ValoTheme.TEXTFIELD_INLINE_ICON);
verticalLayout.addComponent(nameField);

produces this correctly:

screen shot 2016-12-16 at 10 24 59

while this code:

VerticalLayout verticalLayout = new VerticalLayout();
TextField nameField = new TextField("Name");
nameField.setIcon(FontAwesome.USER);
nameField.addStyleName(ValoTheme.TEXTFIELD_INLINE_ICON);
FormLayout formLayout = new FormLayout(nameField);
verticalLayout.addComponent(formLayout);

produces this:
screen shot 2016-12-16 at 10 27 16

When will this be addressed?

A lot of tickets have been left hanging in the issue tracker through the years. Some of them are still relevant, some of them have been fixed a long time ago and some are no longer valid. To get a better look on what is important and still relevant, we are closing old tickets which have not been touched in a long time. No further work will be done on this ticket. If the ticket seems to be still actual, please verify the problem existence over latest framework version and then open a new ticket in vaadin/framework with all the suitable information.

Verified that this is still an issue in 8.3.2 and copied the issue to #10752

Hello there!

We are sorry that this issue hasn't progressed lately. We are prioritizing issues by severity and the number of customers we expect are experiencing this and haven't gotten around to fix this issue yet.

There are a couple of things you could help to get things rolling on this issue (this is an automated message, so expect that some of these are already in use):

  • Check if the issue is still valid for the latest version. There are dozens of duplicates in our issue tracker, so it is possible that the issue is already tackled. If it appears to be fixed, close the issue, otherwise report to the issue that it is still valid.
  • Provide more details how to reproduce the issue.
  • Explain why it is important to get this issue fixed and politely draw others attention to it e.g. via the forum or social media.
  • Add a reduced test case about the issue, so it is easier for somebody to start working on a solution.
  • Try fixing the issue yourself and create a pull request that contains the test case and/or a fix for it. Handling the pull requests is the top priority for the core team.
  • If the issue is clearly a bug, use the Warranty in your Vaadin subscription to raise its priority.

Thanks again for your contributions! Even though we haven't been able to get this issue fixed, we hope you to report your findings and enhancement ideas in the future too!

Still occurs in 8.6.3.
Is there any workaround?

Hello there!

We are sorry that this issue hasn't progressed lately. We are prioritizing issues by severity and the number of customers we expect are experiencing this and haven't gotten around to fix this issue yet.

There are a couple of things you could help to get things rolling on this issue (this is an automated message, so expect that some of these are already in use):

  • Check if the issue is still valid for the latest version. There are dozens of duplicates in our issue tracker, so it is possible that the issue is already tackled. If it appears to be fixed, close the issue, otherwise report to the issue that it is still valid.
  • Provide more details how to reproduce the issue.
  • Explain why it is important to get this issue fixed and politely draw others attention to it e.g. via the forum or social media.
  • Add a reduced test case about the issue, so it is easier for somebody to start working on a solution.
  • Try fixing the issue yourself and create a pull request that contains the test case and/or a fix for it. Handling the pull requests is the top priority for the core team.
  • If the issue is clearly a bug, use the Warranty in your Vaadin subscription to raise its priority.

Thanks again for your contributions! Even though we haven't been able to get this issue fixed, we hope you to report your findings and enhancement ideas in the future too!

Closing as duplicate

The workaround has been descriped in ticket https://github.com/vaadin/framework/issues/10752

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Artur- picture Artur-  路  6Comments

Artur- picture Artur-  路  6Comments

focbenz picture focbenz  路  3Comments

FSchliephacke picture FSchliephacke  路  4Comments

sarahfuchs picture sarahfuchs  路  6Comments