如何創建提供自己標記的鏈接？

我正在嘗試創建一個可以隱藏或顯示我的網頁部分的鏈接。該鏈接應該是可重用的，並根據狀態顯示兩個圖像中的一個。如何創建提供自己標記的鏈接？

在我使用鏈接的每個頁面上添加這兩個子組件都是笨重的，所以我想創建一個組件，該組件的行爲如同鏈接，同時自動添加其內容。

這是鏈接組件：

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

如何創建提供自己標記的鏈接？

回答

相關問題