how to add text fields with rounded corners

Smart GWT Technical Q&A
1

Hello , I just started to use smartgwt.
have a question: I need to create web form where text fields have rounded corners .
tried to do it in this way , but no luck :

css:
.textfield {

padding-left: 1px;
border-style: solid;
border-color: black;
border-width: 2px;

-webkit-border-radius: 12px; /* Saf3-4, iOS 1-3.2, Android <1.6 /
-moz-border-radius: 12px; / FF1-3.6 */
border-radius: 12px;

font-family: helvetica, arial, sans serif;
padding-left: 1px;

}

code:

    final DynamicForm form = new DynamicForm();
    form.setWidth(300);
    form.setHeight(150);
    form.setNumCols(2);
    form.setColWidths(30, "*");
    form.setBorder("2px solid #808080");

    TextItem subjectItem = new TextItem();
    subjectItem.setTitle("Subject");
    subjectItem.setWidth("*");
    subjectItem.setTextBoxStyle("textfield");

    form.setFields(subjectItem, messageItem);
    form.draw();
2

Have you had any luck with this?

I’m trying the similar, but unsuccessfully.

css:
.roundedCorners {
border-radius: 10px;
}

code:

Label label = new Label(“my text”);
label.setStyleName(“roundedCorners”, true);

Should this work?

3

Well, putting a label onto canvas and applying the style to canvas solved it, but I’m still not sure why this style couldn’t be applied to a label.

Canvas cnvHint = new Canvas();
cnvHint.setStyleName(“roundedCorners”);
lblHint = new Label(“my text”);
cnvHint.addChild(lblHint);

4

For labels you should use
lblName.setBaseStyle(“roundedCorners”);