CODEWITHSUNDEEP
groovyprogress-barvaadinvaadin7
user9630935
user9630935

Reputation: 369

How to increase the size (thickness) of a vaadin progressbar

How am i able to increase the height(thickness) of a vaadin progressbar- 7.6.3. And also how can i display the values which are progressed. For example in the middle of a progressbar showing how much is done and how much is remaining. I have tried with the following code but it is always the default size.

_progress.setWidth("100%");
_progress.setHeight("100%");

and also i tired using css, something like, 

_progress.setCaption(" ");
_progress.setCaptionAsHtml(true);
_progress.addstylename("progress");

where ".progress" i have defined in my .css with 

.progress1 {
color: black;
text-align: right;
font-size: 2em;
font-weight: bold;
height: 100%;
}

Upvotes: 2

Views: 304

Answers (1)

Julius Hörger
Julius Hörger

Reputation: 381

Instead of defining a style just for your progress bar, you have to include the wrapper to your style rule.

  .v-progressbar-fat .v-progressbar-wrapper {
    height: 20px;
  }

If you add this to your style sheet and apply the style name "fat" to your progress bar, it's height will be changed to 20px (Or whatever amount you wish)

Upvotes: 1

Related Questions