如何创建提供自己标记的链接？

我正在尝试创建一个可以隐藏或显示我的网页部分的链接。该链接应该是可重用的，并根据状态显示两个图像中的一个。如何创建提供自己标记的链接？

在我使用链接的每个页面上添加这两个子组件都是笨重的，所以我想创建一个组件，该组件的行为如同链接，同时自动添加其内容。

这是链接组件：

public class ToggleVisibilityLink extends AjaxFallbackLink<Boolean> 
{ 
    public ToggleVisibilityLink(final String id, final IModel<Boolean> model) 
    { 
    super(id, model); 

    setOutputMarkupId(true); 

    add(new Image("collapseImage") 
    { 
     @Override 
     public boolean isVisible() 
     { 
     return !getModelObject(); 
     } 
    }); 
    add(new Image("expandImage") 
    { 
     @Override 
     public boolean isVisible() 
     { 
     return getModelObject(); 
     } 
    }); 
    } 

    @Override 
    public void onClick(final AjaxRequestTarget target) 
    { 
    setModelObject(!getModelObject()); 
    if (target != null) 
    { 
     target.add(this); 
     send(this.getParent(), Broadcast.EXACT, target); 
    } 
    } 
}

这是如何我目前使用的HTML（这是添加到页面或面板，我用的是链接）：

<a href="#" wicket:id="collapseExpandLink" class="collapseExpandLink"> 
    <wicket:link> 
    <img src="collapse.png" wicket:id="collapseImage" class="collapseExpandImage collapse"> 
    </wicket:link> 
    <wicket:link> 
    <img src="expand.png" wicket:id="expandImage" class="collapseExpandImage expand"> 
    </wicket:link> 
</a>

和相应的Java调用：

add(new ToggleVisibilityLink("collapseExpandLink", new PropertyModel(this, "hidden")));

但我希望能够跳过链接内的身体一会哈哈我们已经了解了ToggleVisibilityLink的内部。我用IMarkupResourceStreamProvider进行了实验，使用Dynamic markup in Wicket作为起点。通过谷歌搜索，我发现了另一个例子，当海报只能在using a Panel下工作时，我也能够做到这一点。但是我真的很想保持链接，而不是将其打包在面板中，因为我无法在标记中设置链接样式。

我也打开替代封装链接和它的身体。

来源

2012-10-31 Aranian

你试过重写'onComponentTagBody（）'？ – biziclop

您可以通过创建面板来创建带有标记的可重用组件。 –

我想过这个（现在尝试了，使用'setBody（）'，因为Link已经实现了'onComponentTagBody（）'来启用/禁用链接），但是如何渲染图像呢？具体如何获取图片的网址？因为我可以使用此方法动态呈现HTML标记（注意显示哪个图像），但我需要一个'src'属性。我想过把它们作为一个资源，但是要完全封装我想避免的那个组件。 – Aranian

即使我试图破坏自己很糟糕（我有重复的库，我自己的不兼容的jQuery库导入和自定义资源版本控制策略），我能够使用setBody（）得到这个工作。

这是当前ToggleVisibilityLink：（？这是为什么构造保护）

public class ToggleVisibilityLink extends AjaxFallbackLink<Boolean> 
{ 
    static { 
    Application.get().getSharedResources().add("ToggleVisibilityLinkCollapse", 
               new MyPackageResource(ToggleVisibilityLink.class, "collapse.png")); 
    Application.get().getSharedResources().add("ToggleVisibilityLinkExpand", 
               new MyPackageResource(ToggleVisibilityLink.class, "expand.png")); 
    } 

    public ToggleVisibilityLink(final String id, final IModel<Boolean> model) 
    { 
    super(id, model); 

    setOutputMarkupId(true); 
    setEscapeModelStrings(false); 

    setBody(new BodyModel(model)); 
    } 

    @Override 
    public void onClick(final AjaxRequestTarget target) 
    { 
    setModelObject(!getModelObject()); 
    if (target != null) 
    { 
     target.add(this); 
     send(this.getParent(), Broadcast.EXACT, target); 
    } 
    } 

    private static final class BodyModel extends AbstractReadOnlyModel<String> 
    { 
    private final IModel<Boolean> model; 

    private BodyModel(final IModel<Boolean> model) 
    { 
     this.model = model; 
    } 

    @Override 
    public String getObject() 
    { 
     return this.model.getObject() ? 
       "<img src=\"" 
      + RequestCycle.get().urlFor(new SharedResourceReference("ToggleVisibilityLinkExpand"), null) 
      + "\" class=\"collapseExpandImage expand\">" 
       : 
       "<img src=\"" 
      + RequestCycle.get().urlFor(new SharedResourceReference("ToggleVisibilityLinkCollapse"), null) 
      + "\" class=\"collapseExpandImage collapse\">"; 
    } 
    } 
}

凡MyPackageResource是PackageResource一个简单的实现。

那么可以简单地将ToggleVisibilityLink到容器：

super.add(new ToggleVisibilityLink("collapseExpandLink", new PropertyModel(this, "hidden")));

和

<a wicket:id="collapseExpandLink" class="collapseExpandLink"></a>

，并单击链接时通过事件得到通知。

来源

2012-11-01 12:52:57 Aranian

如何创建提供自己标记的链接？

回答

相关问题