在其文本输入字段上将日期字段图标放在左侧

时间:2011-03-31 15:02:15

标签: flex flex4 datefield

关于dateField,有TextInput和Icon。我希望图标显示在TextInput的左侧,而不是它出现在右侧,因为它处于默认状态。

有人可以给我一个暗示吗?

3 个答案:

答案 0 :(得分:2)

由于DateField仍然是Halo组件,因此需要对其进行扩展以便能够更改其子项。您将要创建一个新组件,扩展DateField,然后覆盖createChildren和updateDisplayList函数。检查DateField如何创建它的子项并相应地更改它们的位置。 updateDisplayList函数用于组件调整大小时,以便您可以正确调整子项的大小。

答案 1 :(得分:1)

查看here(参见源代码)。有一个autosuggest组件,但原理是相同的。或者这应该足够了:

public class myDateField extends DateField
{
    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
    {
        super.updateDisplayList(unscaledWidth,unscaledHeight);
        this.textInput.x=this.getChildAt(1).width;
        this.getChildAt(1).x = 0;
    }       
}

答案 2 :(得分:0)

这就是我所做的 - 与J_A_X描述的解决方案相同,但是使用代码,因为我认为如果你是ActionScript的新手,Adobe设置位置的方式有点令人困惑。我喜欢ChRapO的方法,但我选择尝试与MX DateField组件设置这些元素的位置的方式保持一致。

我的扩展DateField类:

package com.escalationpoint.tagger.view.component
{
import mx.controls.DateField;
import mx.core.mx_internal;

use namespace mx_internal;


public class DateField extends mx.controls.DateField
{
    public function DateField()
    {
        super();
    }

    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
    {
        // Unfortunate that we can't call super.super.updateDisplayList
        // since we're redoing work done in super.updateDisplayList.  Oh, well...
        super.updateDisplayList(unscaledWidth, unscaledHeight);

        var w:Number = unscaledWidth;
        var h:Number = unscaledHeight;

        var arrowWidth:Number = downArrowButton.getExplicitOrMeasuredWidth();
        var arrowHeight:Number = downArrowButton.getExplicitOrMeasuredHeight();

        textInput.setActualSize(w - arrowWidth - 2, h);
        textInput.move(arrowWidth + 4, 0);

        downArrowButton.setActualSize(arrowWidth, arrowHeight);
        downArrowButton.move(0, Math.round((h - arrowHeight) / 2));
    }
    }
}

与原始DateField组件中的updateDisplayList方法进行比较:

override protected function updateDisplayList(unscaledWidth:Number,
                                              unscaledHeight:Number):void
{
    super.updateDisplayList(unscaledWidth, unscaledHeight);

    var w:Number = unscaledWidth;
    var h:Number = unscaledHeight;

    var arrowWidth:Number = downArrowButton.getExplicitOrMeasuredWidth();
    var arrowHeight:Number = downArrowButton.getExplicitOrMeasuredHeight();

    downArrowButton.setActualSize(arrowWidth, arrowHeight);
    downArrowButton.move(w - arrowWidth, Math.round((h - arrowHeight) / 2));

    textInput.setActualSize(w - arrowWidth - 2, h);
}