2 Replies Latest reply on Sep 25, 2009 5:18 PM by d_bose

    How to do this UI? Functionality like Gantt Chart

    d_bose

      Hi, I have a requirement of building a screen like the one given below. It is a part of the screen which is suppose to have functionality similar to a Gantt Chart. I am relatively new to Flex & am not being able to figure out how to do it, what controls or components to use, etc.. Especially for the part that is on the left to the word "Press Release" in the image.

       

      ProjectSC.JPG

        • 1. Re: How to do this UI? Functionality like Gantt Chart
          Ansury Level 3

          I have no idea what that screenshot does as far as functionality (I don't see the similarity to a gantt chart), but the "Press Release" part is probably the easiest.  That appears to be a ComboBox component in Flex world.

           

          As to the rest of the screenshot, I suspect you'll have to create a custom component (likely more than one) to get the specific behavior you're looking for.  I can't advise too much since I don't know what you need, but you could try using the Flex Builder design mode to just explore all the available components to see how they work and what they do. 

           

           

          Or try looking at this http://www.adobe.com/devnet/flex/tourdeflex/web/

          • 2. Re: How to do this UI? Functionality like Gantt Chart
            d_bose Level 1

            Thanks for the reply..

            Sorry for the mistake in the question. It is not "left". I want to know how to do the stuff which is there in the "right" side of "Press Release".

             

            As for the functionality - "CEO Compensation" is an example of a project.  A project spans between 2 dates. The end date can be controled with the slider (with an open lock symbol).

            "Press Release" is an example of a component of the project. This component would have several phases like "compose", "review", "revise"...

            Each of these components would have subsequent start & end dates which can be controlled by the sliders.

            Each of these phases will have tasks shown in the little grid / list like thing below them. We can add tasks in the list as needed by selecting the list & right clicking to get a context menu which would have an "Add Task" option(not shown in the image). Each of these tasks will be for a specific individual whose name is shown in the task. On the completion of the task the specific used can come & mark it as complete by marking the circles beside it in the list / grid.

             

            It is a little difficult to explain the whole think. I have tried, but I dont know how much I could explain.

             

            I have done some research & gone through the available controls but none of them seems to do the job for me. It is a very unique screen & hence I am seeking the help of some experts who would have better understanding of Flex.

             

            Even I felt that I would need to think of some custom components. It will be extremely helpful if someone provides some guidance / direction in this regard. 

             

            Thanks