Gauge Component

I recently had the privilege of attending a customer-training session given by one of our Flex architects. The session covered component creation in Flex. I volunteered a component I wrote a while back as a test case to have our expert help us write better components.

This gauge component is one outcome of that session (another is an article I wrote which will appear on the Macromedia site early next year). Feel free to download the component. It includes some skin files, too. I placed comments throughout to help guide you when building your own components.

GaugeSamples.jpg

Download file

7 Responses to Gauge Component

  1. Could i translate your Archives to chinese .Release to my website~?

  2. Could i translate your Archives to chinese .Release to my website~?

  3. Bryan Choi says:

    I have two questions.

    First Question,

    I modified your Gauge class that I add TRACE() function in all function and saw log.

    Follow is log message. I am wandering about measure() method that was not called.

    =============================================

    classConstruct() start

    classConstruct() end

    Gauge() start

    Gauge() end

    init() start

    init() end

    createChildren() start

    createChildren() end

    test.mxml::initialize

    경고: invalidateSize�(가) 함수가 아닙니다.

    at MovieClip::_measureSizes()

    경고: invalidateLayout�(가) 함수가 아닙니다.

    at MovieClip::_measureSizes()

    경고: invalidate�(가) 함수가 아닙니다.

    at Object::_finishConstruction()

    commitProperties() start

    commitProperties() end

    경고: invalidate�(가) 함수가 아닙니다.

    at Object::_finishConstruction()

    경고: invalidateSize�(가) 함수가 아닙니다.

    at mx_managers_LayoutManager::measureSizes()

    경고: invalidateLayout�(가) 함수가 아닙니다.

    at mx_managers_LayoutManager::measureSizes()

    size() start

    size() end

    layoutChildren() start

    layoutChildren() end

    draw() start

    rotateNeedle() start

    rotateNeedle() end

    draw() end

    test.mxml::creationComplete

    layoutChildren() start

    layoutChildren() end

    =============================================

    As you can see, there is not measure() function.

    I want to know why?

    Second Question,

    Follow is a part of test.mxml. This function change value of the mygauge.

    =================================================================

    function updateGauge(event) {

    mygauge.value=event.target.value;

    bigauge.value=event.target.value;

    }

    =================================================================

    Follow is a part of Gauge class. This set function call the dispatchEvent() function.

    =================================================================

    [Inspectable(category=”Common”,type=”Number”,defaultValue=0)]

    [ChangeEvent(“changeValue”)]

    public function set value(n:Number) : Void {

    trace(“set value() start”);

    __value = n;

    __needleChanged = true;

    invalidate(); // this will trigger draw() method

    dispatchEvent({type:”changeValue”});

    trace(“set value() end”);

    }

    =================================================================

    I want to know where is handler of event.

    When this set value() function is called, what is happen?

    Please, answer me about that.

    Thank you for your reading.

  4. Peter Ent says:

    The measure method is called only if the Flex layout system needs to call it. For example, if you specify the width and height on a component, the measure method will not get called.

  5. Bryan Choi says:

    Thank you for your answer.

    I have another question.

    I cann’t find function ‘createObject2()’ in Gauge class but there is not error.

    I know that creationObject2 method call init() and createChildren(), right?

    I am wandring about it. Please, tell me why?

    Thanks.

  6. Bryan Choi says:

    I am so sorry.

    not createObject2() but constructObject2().

  7. Bryan Choi says:

    How can I delete my comment?