In the creation of an AbstractCell<String>, I have successfully implemented a header displaying "Welcome to your mobile...". Now, I am interested in incorporating two buttons within this AbstractCell: one for navigating back to the previous page and another for returning to the welcome page. The current implementation involves extending a class that utilizes AbstractCell<String>, as shown in the code snippet below:
public class HeaderCell extends AbstractCell<String> {
// Templates interface definition
interface Templates extends SafeHtmlTemplates {
String style = "HeaderPanel";
@SafeHtmlTemplates.Template("<div class=\""+style+"\">{0}</div>")
SafeHtml cell(SafeHtml value);
}
private Templates templates = GWT.create(Templates.class);
@Override
public void render(com.google.gwt.cell.client.Cell.Context context,
String value, SafeHtmlBuilder sb) {
SafeHtml safeValue = SafeHtmlUtils.fromString(value);
SafeHtml rendered = templates.cell(safeValue);
sb.append(rendered);
}
}
My main query pertains to whether there exists any method to integrate the aforementioned two buttons into the header cell design. Additionally, please take note of the black-colored styling applied to the header cell. PS: To achieve the visual appearance resembling the image provided, the following CSS rules are used:
.HeaderPanel {
-moz-box-shadow: inset -1px -1px 15px 1px #ffffff;
-webkit-box-shadow: inset -1px -1px 15px 1px #ffffff;
box-shadow: inset -1px -1px 15px 1px #ffffff;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #242524), color-stop(1, #242524));
background: -moz-linear-gradient(center top, #242524 5%, #242524 100%);
background-color: #242524;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
border: 1px solid #dcdcdc;
color: #ffffff;
font-family: arial;
font-size: 17px;
font-weight: bold;
padding: 8px 36px;
text-decoration: none;
text-shadow: 1px 1px 29px #ffffff;
text-align: center;
}