Question

我尝试使用wicket在简单的表格中添加图像。我在谷歌搜索但我不理解答案。目前，我只有细胞中图像的路径。

page.html中

 <table id="table51">
    <tr>
        <th id="th51"><span wicket:id="chap51t1"></span></th>
        <th id="th51"><span wicket:id="chap51t2"></span></th>
        <th id="th51"><span wicket:id="chap51t3"></span></th>
        <th id="th51"><span wicket:id="chap51t4"></span></th>
    </tr>
    <tr wicket:id="perso">
        <td id="td51" wicket:id="perso_nom"></td>
        <td id="td51" wicket:id="perso_image"></td>
        <td id="td51" wicket:id="perso_description"></td>
        <td id="td51" wicket:id="perso_type"></td>
    </tr>
</table>

page.java

List<Table51Bean> tableperso = new ArrayList<Table51Bean>();
    tableperso.add(new Table51Bean(getString("chap51p1n"), getString("chap51p1i"), getString("chap51p1d"), getString("chap51p1t")));
    tableperso.add(new Table51Bean(getString("chap51p2n"), getString("chap51p2i"), getString("chap51p2d"), getString("chap51p2t")));
    ListView<Table51Bean> perso = new ListView<Table51Bean>("perso", tableperso) {
        @Override
        protected void populateItem(final ListItem<Table51Bean> item) {
            // Retrieve the current Locale
            final Table51Bean loc = item.getModelObject();

            // Add a Label for the nom
            item.add(new Label("perso_nom", new AbstractReadOnlyModel<String>() {
                @Override
                public String getObject() {
                    return loc.getNom();
                }
            }));

            // Add a Label for the image
            item.add(new Label("perso_image", new AbstractReadOnlyModel<String>() {
                @Override
                public String getObject() {
                    return loc.getImage();
                }
            }));


            // Add a Label for the description
            item.add(new Label("perso_description", new AbstractReadOnlyModel<String>() {
                @Override
                public String getObject() {
                    return loc.getDescription();
                }
            }));

            // Add a Label for the type
            item.add(new Label("perso_type", new AbstractReadOnlyModel<String>() {
                @Override
                public String getObject() {
                    return loc.getType();
                }
            }));
        }
    };
    divchap51.add(perso);

我想知道是否可以在此代码中集成图像？

Answer 1

有可能。只需添加Panel Image而不是Label。

或者，正如我也更喜欢，将class添加到空Label并解决使用CSS设置图像的问题。

.person_image_class
{
    display: inline-block;
    background-image: url('myimgae.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 120px;
    height: 90px;
}

item.add(new Label("perso_").add(new AttributeModifier("class", true, new Model<String>("person_image_class"))));

Wicket在简单的表格中添加图像

1 个答案: