Настройте сетку данных, чтобы показать связь между задачами - PullRequest
Новая
       35

Настройте сетку данных, чтобы показать связь между задачами

1 голос
/ 18 мая 2010

Я создал программу на Flex для создания простых расписаний, похожих на MS Project или Vico Control. У меня есть одна проблема, которую я хотел бы решить. (Вы можете увидеть это здесь: Инструмент планирования проектов OnTime, выполненный во Flex

Задачи расписания представлены в виде диаграммы Ганта, для которой я создал itemRenderer внутри одной из строк в DataGrid. Задачи показаны в виде диаграмм Ганта, но я также хотел бы показать связь между задачами.

Пожалуйста, взгляните на изображение ниже, чтобы увидеть, чего я пытаюсь достичь здесь: (вверху изображение того, как выглядит сетка данных, а ниже то, что я хотел бы добавить) альтернативный текст http://img202.imageshack.us/img202/1399/gantt.jpg

Какие-либо предложения относительно того, как я мог бы сделать это внутри средства визуализации элементов DataGrid?

Большое спасибо Ладислав

1 Ответ

1 голос
/ 20 мая 2010

ОК, вот что вам нужно сделать.

  1. В вашем dataProvider одно поле должно быть объектом (вы должны сделать его классом), который содержит следующие свойства: начало: число (в процентах) длина: число (в процентах) Индекс: ИНТ [необязательный реквизит isFirst: Boolean, isLast: Boolean]

  2. Создайте itemRenderer, используя контейнер (скажем, Canvas) и используя графический класс, нарисуйте прямоугольник, левый край которого соответствует свойству start. Это будет процент от ширины itemRender и может быть определен из unscaledWidth в защищенном методе updateDisplayList класса, который вы переопределите. Точно так же ширина прямоугольника соответствует свойству длины вашего объекта в процентах от ширины холста. Присвойте ему любую высоту.

  3. Нарисуйте разъемы. Снова используйте графический класс, чтобы нарисовать горизонтальные линии внутри и снаружи сторон прямоугольника. Дайте им постоянную длину. Нарисуйте линии от концов горизонтальных линий: до 0 для левой стороны, до this.height для правой стороны.

  4. Выясните, как далеко вы должны нарисовать промежуточный соединитель, чтобы он появился, чтобы соединиться с линией над ним. Это нужно сделать только для верхней части itemRenderer.

  5. Если isStart = true (индекс объекта равен 0), не рисуйте ничего слева или сверху прямоугольника. Если isEnd = true (индекс объекта ArrayCollection.length -1), не рисуйте ничего справа или снизу.

И все готово. Вам нужно будет понять, как рисовать с помощью графического объекта, но это довольно просто, и в любом случае вы должны иметь это в своем репертуаре.

...