2017-12-01 10 views
0

問題

こんにちは、 私はWicketsのフィードバックメッセージの色を設定しようとしています。私は現在、Wicket GUI(Wicket 7.6.1)を維持しています。 Session.get().warn("Watch out!")は、CSSクラスalert-successで注釈された緑の警告ボックスを表示しているようです。色を黄色に変えたいと思います。私がこれまでに得たものWicketセッションでフィードバックメッセージの色を設定するにはどうすればよいですか?

私はSession.get().getApplication().getResourceSettings()が私にプロパティの工場を含むいくつかのリソース設定へのアクセスを与えることがわかりました。しかし、私はそれを使う方法を知らない。また、私は自分のセッションに関連するマークアップファイルを探しましたが、何も見つかりませんでした。

ご協力いただければ幸いです!

答えて

1

必要に応じてカスタムフィードバックパネルを作成できます。

CustomFeedBackPanel.html

<wicket:panel> 
    <div wicket:id="feedbackul"> 
     <wicket:container wicket:id="messages"> 
      <p wicket:id="message"></p> 
     </wicket:container> 
    </div> 

</wicket:panel> 

CustomFeedBackPanel.java

public class CustomFeedbackPanel extends Panel implements IFeedback { 

    private static final long serialVersionUID = 1L; 
    private final MessageListView messageListView; 
    WebMarkupContainer messagesContainer = new WebMarkupContainer("feedbackul") { 
     private static final long serialVersionUID = 1L; 

     @Override 
     protected void onConfigure() { 
      super.onConfigure(); 
      setVisible(anyMessage()); 
     } 
    }; 


    public CustomFeedbackPanel(final String id) { 
     this(id, null); 
    } 


    public CustomFeedbackPanel(final String id, IFeedbackMessageFilter filter) { 
     super(id); 

     add(messagesContainer); 
     messageListView = new MessageListView("messages"); 
     messagesContainer.add(messageListView); 

     if (filter != null) { 
      setFilter(filter); 
     } 
    } 

    public final boolean anyErrorMessage() { 
     return anyMessage(FeedbackMessage.ERROR); 
    } 

    public final boolean anyMessage() { 
     return anyMessage(FeedbackMessage.UNDEFINED); 
    } 

    public final boolean anyMessage(int level) { 
     List<FeedbackMessage> msgs = getCurrentMessages(); 

     for (FeedbackMessage msg : msgs) { 
      if (msg.isLevel(level)) { 
       return true; 
      } 
     } 

     return false; 
    } 

    public final FeedbackMessagesModel getFeedbackMessagesModel() { 
     return (FeedbackMessagesModel) messageListView.getDefaultModel(); 
    } 

    public final IFeedbackMessageFilter getFilter() { 
     return getFeedbackMessagesModel().getFilter(); 
    } 

    public final CustomFeedbackPanel setFilter(IFeedbackMessageFilter filter) { 
     getFeedbackMessagesModel().setFilter(filter); 
     return this; 
    } 

    public final Comparator<FeedbackMessage> getSortingComparator() { 
     return getFeedbackMessagesModel().getSortingComparator(); 
    } 

    public final CustomFeedbackPanel setSortingComparator(Comparator<FeedbackMessage> sortingComparator) { 
     getFeedbackMessagesModel().setSortingComparator(sortingComparator); 
     return this; 
    } 

    @Override 
    public boolean isVersioned() { 
     return false; 
    } 

    public final CustomFeedbackPanel setMaxMessages(int maxMessages) { 
     messageListView.setViewSize(maxMessages); 
     return this; 
    } 

    protected String getCSSClass(final FeedbackMessage message) { 
     String css = "feedback"; 
     if (message.getLevel() == FeedbackMessage.ERROR 
       || message.getLevel() == FeedbackMessage.FATAL) { 
      css = "feedback error"; 
     } 
     if (message.getLevel() == FeedbackMessage.SUCCESS) { 
      css = "feedback success"; 
     } 
     if (message.getLevel() == FeedbackMessage.WARNING) { 
      css = "feedback warn"; 
     } 

     return css; 
    } 

    protected final List<FeedbackMessage> getCurrentMessages() { 
     final List<FeedbackMessage> messages = messageListView.getModelObject(); 
     return Collections.unmodifiableList(messages); 
    } 

    protected FeedbackMessagesModel newFeedbackMessagesModel() { 
     return new FeedbackMessagesModel(this); 
    } 

    protected Component newMessageDisplayComponent(String id, FeedbackMessage message) { 
     Serializable serializable = message.getMessage(); 
     Label label = new Label(id, (serializable == null) ? "" : serializable.toString()); 
     label.setEscapeModelStrings(CustomFeedbackPanel.this.getEscapeModelStrings()); 
     //label.add(new AttributeModifier("class",getCSSClass(message))); 
     return label; 
    } 

    private final class MessageListView extends ListView<FeedbackMessage> { 
     private static final long serialVersionUID = 1L; 

     public MessageListView(final String id) { 
      super(id); 
      setDefaultModel(newFeedbackMessagesModel()); 
     } 

     @Override 
     protected IModel<FeedbackMessage> getListItemModel(
       final IModel<? extends List<FeedbackMessage>> listViewModel, final int index) { 
      return new AbstractReadOnlyModel<FeedbackMessage>() { 
       private static final long serialVersionUID = 1L; 


       @Override 
       public FeedbackMessage getObject() { 
        if (index >= listViewModel.getObject().size()) { 
         return null; 
        } else { 
         return listViewModel.getObject().get(index); 
        } 
       } 
      }; 
     } 

     @Override 
     protected void populateItem(final ListItem<FeedbackMessage> listItem) { 
      final FeedbackMessage message = listItem.getModelObject(); 
      message.markRendered(); 
      final Component label = newMessageDisplayComponent("message", message); 
      final AttributeModifier levelModifier = AttributeModifier.replace("class", 
        getCSSClass(message)); 
      //label.add(levelModifier); 
      listItem.add(levelModifier); 
      listItem.add(label); 
      messagesContainer.add(levelModifier); 

     } 


    } 
} 

あなたがgetCssClass()方法を検討すべき主なもの。あなたの要件に応じて変更することができます。私は参考のためだけに変更しました。

protected String getCSSClass(final FeedbackMessage message) { 
      String css = "feedback"; 
      if (message.getLevel() == FeedbackMessage.ERROR 
        || message.getLevel() == FeedbackMessage.FATAL) { 
       css = "alert error"; 
      } 
      if (message.getLevel() == FeedbackMessage.SUCCESS) { 
       css = "alert success"; 
      } 
      if (message.getLevel() == FeedbackMessage.WARNING) { 
       css = "alert warn"; 
      } 

      return css; 
     } 
+0

答えていただきありがとうございます。私は既にプロジェクト内に 'FeedbackPanel'のカスタム実装があり、' getCssClass() 'メソッドを修正しました。 –

0

フィードバックメッセージは、FeedbackPanelクラスによってレンダリングされます。あなたのアプリケーションは、メッセージをBootstrap AlertsとしてレンダリングするFeedbackPanelのカスタム実装を使用しているようです。

デフォルトでは、ウィケットはすべてのメッセージのCSSクラスとしてfeedbackMessage<LogLevel>(たとえばfeedbackMessageWarning)を設定していますので、必要に応じてスタイルを設定できます。

+0

ありがとうございました。非常に便利で、これを読んだ直後にカスタマイズされたFeedbackPanelの実装が見つかりました。 –

0

カスタムFeedbackPanelと新しいHTML/Javaファイルを作成しないための代替enclosuresを使用することです:ページのコンストラクタで

<wicket:enclosure> 
    <div class="alert alert-danger alert-dismissible"> 
     <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button> 
     <h4><i class="icon fa fa-ban"></i> Error on form validation!</h4> 
     <div wicket:id="errorMessages"></div> 
    </div> 
</wicket:enclosure> 

FeedbackCollector collector = new FeedbackCollector(this); 
ExactErrorLevelFilter errorFilter = new ExactErrorLevelFilter(FeedbackMessage.ERROR); 

add(new FeedbackPanel("errorMessages", errorFilter) { 
    @Override public boolean isVisible() { 
     return !collector.collect(errorFilter).isEmpty(); 
    } 
}); 
Twitterのブートストラップ・クラスを使用

Wicket 6のフィードバックメッセージはコンポーネントに付属しているので、 FeedbackCollectorと、目的のメッセージを取得して表示するフィルタ。エンクロージャの利点は次のとおりです。

  • 新しいファイルを作成する必要はありません。
  • フラグメント/パネルと同様に機能します。
  • メッセージは必要な場合にのみレンダリングされます。

希望します。

関連する問題