1

onBlurイベントでJavaコードを使用してag：labelの色を変更したいと思います。私はEclipse、UIBinderを使用しています。

これは私が考えていることですが、機能しません。

StandardDocumentDownload.ui.xmlファイル内

<ui:style>     
   .testStyle {
   }
   .styleRequiredData
   {
        color:red;

    }
 </ui:style>

これは私のstandardDocumentDownload.javaファイルのイベントです

@UiHandler("comboTitle")
void onComboTitleBlur(BlurEvent event) {
    int title = comboTitle.getSelectedIndex();

    if(title == 0)
    {
        labTitleReq.setText("Please enter a value");
        labTitle.addStyleName("styleRequiredData");
    }
    else
    {
        labTitleReq.setText("");
    }

}

イベントの発生時に、ラベルの既存のスタイルに赤を追加するにはどうすればよいですか。

敬具

4

2 に答える 2

12

インラインスタイルへのプログラムによるアクセスはこちらをご覧ください

あなたにとって、それは次のようなものでなければなりません：

<ui:style type="com.yourapp.YourClass.MyStyle">     
    .testStyle {
    }
    .styleRequiredData
    {
        color:red;
    }
</ui:style>

public class YourClass extends Widget {
    interface MyStyle extends CssResource {
        String testStyle();
        String styleRequiredData();
    }

    @UiField MyStyle style;

    /* ... */

    @UiHandler("comboTitle")
    void onComboTitleBlur(BlurEvent event) {
        int title = comboTitle.getSelectedIndex();
        if(title == 0){
            labTitleReq.setText("Please enter a value");
            labTitle.getElement().addClassName(style.styleRequiredData);
        } else {
            labTitleReq.setText("");
        }
    }
}
于 2012-06-05T11:57:56.063 に答える
3

それを見つけるのにしばらく時間がかかりましたが、ドキュメントです。「UiBinderを使用した宣言型レイアウト：インラインスタイルへのプログラムによるアクセス」でその方法を説明します。ここにコードスニペットがあります

UiBinder： 

  <ui:style type='com.my.app.MyFoo.MyStyle'>
    .redBox { background-color:pink; border: 1px solid red; }
    .enabled { color:black; }
    .disabled { color:gray; }
  </ui:style>

  <div class='{style.redBox} {style.enabled}'>I'm a red box widget.</div>

</ui:UiBinder>

背後にあるコード：

public class MyFoo extends Widget {
  interface MyStyle extends CssResource {
    String enabled();
    String disabled();
  }

  @UiField MyStyle style;

  /* ... */

  void setEnabled(boolean enabled) {
    getElement().addClassName(enabled ? style.enabled() : style.disabled());
    getElement().removeClassName(enabled ? style.disabled() : style.enabled());
  }
}

説明：

この要素には、type='com.my.app.MyFoo.MyStyle'という新しい属性があります。つまり、そのインターフェイス（上記のMyFooウィジェットのJavaソースで定義されている）を実装し、必要な2つのCSSクラス（有効と無効）を提供する必要があります。

次に、@UiFieldMyStyleスタイルを見てください。MyFoo.javaのフィールド。これにより、ブロック用に生成されたCssResourceへのコードアクセスが可能になります。setEnabledメソッドは、ウィジェットのオンとオフを切り替えるときに、そのフィールドを使用して有効なスタイルと無効なスタイルを適用します。

指定されたタイプのスタイルブロックで他のクラスを好きなだけ定義できますが、コードはインターフェイスに必要なクラスにのみアクセスできます。

于 2012-06-05T11:58:35.417 に答える