2012-06-15 62 views
1

僅僅可以簡單地擴展文本框來創建由文本框和標籤組成的自定義窗口小部件,隨後繼承文本框的功能以及事件處理。自定義Widget擴展文本框

從我的理解是,一般會擴展複合,然後在構造函數中實現initWidget()。

initWidget(binder.createAndBindUi(this)); 

我可以通過只擴展文本框來做類似的事嗎?

我想這樣做的原因是因爲已經創建了帶有標籤的指示器文本框,但是在此自定義小部件中應用事件處理時,當我嘗試在某處使用它時會給我帶來意想不到的結果。

import com.google.gwt.core.client.GWT; 

public class IndicatorTextField extends Composite implements HasText, HasKeyUpHandlers{ 

public interface Binder extends UiBinder<Widget, IndicatorTextField> { 
} 

private static final Binder binder = GWT.create(Binder.class); 

public interface Style extends CssResource{ 
    String textStyling(); 
    String requiredInputLabel(); 
    String colorNotValidated(); 
} 

@UiField Style style; 
@UiField Label label; 
@UiField TextBox textBox; 


public IndicatorTextField() 
{ 
    initWidget(binder.createAndBindUi(this)); 
} 

public void setBackgroundValidateTextbox(boolean validated) 
{ 
    if(validated) 
    { 
     textBox.getElement().addClassName(style.colorNotValidated()); 
    } 
    else 
    { 
     textBox.getElement().removeClassName(style.colorNotValidated()); 
    } 
} 

@Override 
public String getText() { 
    return label.getText(); 
} 

@Override 
public void setText(String text) { 
    label.setText(text); 
} 

@UiHandler("textBox") 
public void onKeyUp(KeyUpEvent event) 
{ 
    DomEvent.fireNativeEvent(event.getNativeEvent(), this); 
} 

@Override 
public HandlerRegistration addKeyUpHandler(KeyUpHandler handler) {  
    //return textBox.addKeyUpHandler(handler); 
    return addDomHandler(handler, KeyUpEvent.getType()); 
} 
} 

回答

0

看看TextBox類的默認構造函數。

/** 
* Creates an empty text box. 
*/ 
public TextBox() { 
    this(Document.get().createTextInputElement(), "gwt-TextBox"); 
} 

它創建文本輸入元素。你可以用這樣的構造方法來創建自定義類LabeledTextBox

public class LabeledTextBox extends TextBox { 

    public MyTextBox() { 
     super(Document.get().createDivElement()); 
     final DivElement labelElement = Document.get().createDivElement(); 
     final InputElement textBoxElement = Document.get().createTextInputElement(); 
     getElement().appendChild(labelElement); 
     getElement().appendChild(textBoxElement); 
    } 

    ... 

} 

我沒有嘗試這個類自己。最有可能的是,它將需要額外的調整,可能會有聽衆問題等。

您是否真的需要通過繼承TextBox來創建一個小部件?你爲什麼不用某種Panel來代替?這對我來說是一個更簡單的方法。