前回までの概要

前前回まででタスク管理アプリの大枠が出来ました。
前回からはブラッシュアップを開始。
今回はWBS、ガントチャート画面をブラッシュアップします。

プロンプト

wbs表示画面の表示をブラッシュアップしたい
縦軸が各タスク、横軸が期間で表示できるように目視しやすいよう、期間を図で表現したい

回答

GanttRow.cs

namespace TaskManager.Domain
{
    public class GanttRow
    {
        public string TaskName { get; set; }

        public DateTime StartDate { get; set; }

        public DateTime EndDate { get; set; }

        public int Level { get; set; }
    }
}

WbsService.cs 修正版

階層をフラット化。

using TaskManager.Domain;

namespace TaskManager.Services
{
    public class WbsService
    {
        public List<GanttRow> BuildRows(
            List<TaskItem> tasks)
        {
            var rows = new List<GanttRow>();

            foreach (var task in tasks)
            {
                AddRow(rows, task, 0);
            }

            return rows;
        }

        private void AddRow(
            List<GanttRow> rows,
            TaskItem task,
            int level)
        {
            rows.Add(new GanttRow
            {
                TaskName = task.Title,
                StartDate = task.StartDate,
                EndDate = task.EndDate,
                Level = level
            });

            foreach (var child in task.Children)
            {
                AddRow(rows, child, level + 1);
            }
        }
    }
}

新しい WbsForm.cs

重要部分です。

using TaskManager.Domain;
using TaskManager.Services;

namespace TaskManager.Forms
{
    public partial class WbsForm : Form
    {
        private readonly TaskService _taskService;

        private readonly WbsService _wbsService =
            new();

        public WbsForm(TaskService taskService)
        {
            InitializeComponent();

            _taskService = taskService;

            InitializeGrid();

            LoadWbs();
        }

        private void InitializeGrid()
        {
            dgvWbs.Columns.Clear();

            dgvWbs.RowHeadersVisible = false;

            dgvWbs.AllowUserToAddRows = false;

            dgvWbs.ReadOnly = true;

            dgvWbs.AllowUserToResizeRows = false;

            dgvWbs.SelectionMode =
                DataGridViewSelectionMode.CellSelect;

            dgvWbs.MultiSelect = false;

            dgvWbs.AutoSizeColumnsMode =
                DataGridViewAutoSizeColumnsMode.None;

            dgvWbs.DefaultCellStyle.Alignment =
                DataGridViewContentAlignment.MiddleCenter;

            dgvWbs.ColumnHeadersDefaultCellStyle.Alignment =
                DataGridViewContentAlignment.MiddleCenter;

            // タスク列
            dgvWbs.Columns.Add(
                "TaskName",
                "タスク");

            dgvWbs.Columns["TaskName"].Width = 250;

            dgvWbs.Columns["TaskName"].DefaultCellStyle.Alignment =
                DataGridViewContentAlignment.MiddleLeft;

            // 開始日
            dgvWbs.Columns.Add(
                "StartDate",
                "開始");

            dgvWbs.Columns["StartDate"].Width = 90;

            // 終了日
            dgvWbs.Columns.Add(
                "EndDate",
                "終了");

            dgvWbs.Columns["EndDate"].Width = 90;
        }

        private void LoadWbs()
        {
            var rows =
                _wbsService.BuildRows(
                    _taskService.GetAll());

            if (rows.Count == 0)
            {
                return;
            }

            DateTime min =
                rows.Min(x => x.StartDate);

            DateTime max =
                rows.Max(x => x.EndDate);

            int days =
                (max - min).Days + 1;

            // 日付列追加
            for (int i = 0; i < days; i++)
            {
                DateTime day = min.AddDays(i);

                var column = new DataGridViewTextBoxColumn();

                column.Name =
                    day.ToString("yyyyMMdd");

                column.HeaderText =
                    day.ToString("MM/dd");

                column.Width = 50;

                column.SortMode =
                    DataGridViewColumnSortMode.NotSortable;

                column.Resizable =
                    DataGridViewTriState.False;

                dgvWbs.Columns.Add(column);
            }

            // 行追加
            foreach (var row in rows)
            {
                int index =
                    dgvWbs.Rows.Add();

                var gridRow =
                    dgvWbs.Rows[index];

                gridRow.Cells[0].Value =
                    new string(' ', row.Level * 4)
                    + row.TaskName;

                gridRow.Cells[1].Value =
                    row.StartDate.ToString("yyyy/MM/dd");

                gridRow.Cells[2].Value =
                    row.EndDate.ToString("yyyy/MM/dd");

                // 期間塗りつぶし
                for (DateTime d = row.StartDate;
                     d <= row.EndDate;
                     d = d.AddDays(1))
                {
                    int col =
                        3 + (d - min).Days;

                    gridRow.Cells[col].Style.BackColor =
                        Color.SkyBlue;
                }
            }
        }
    }
}

新しい WbsForm.Designer.cs

namespace TaskManager.Forms
{
    partial class WbsForm
    {
        private System.ComponentModel.IContainer components = null;

        private DataGridView dgvWbs;

        protected override void Dispose(bool disposing)
        {
            if (disposing &&
                (components != null))
            {
                components.Dispose();
            }

            base.Dispose(disposing);
        }

        private void InitializeComponent()
        {
            dgvWbs = new DataGridView();

            ((System.ComponentModel.ISupportInitialize)
                dgvWbs).BeginInit();

            SuspendLayout();

            // dgvWbs
            dgvWbs.ColumnHeadersHeightSizeMode =
                DataGridViewColumnHeadersHeightSizeMode
                    .AutoSize;

            dgvWbs.Dock = DockStyle.Fill;

            dgvWbs.Location =
                new Point(0, 0);

            dgvWbs.Name =
                "dgvWbs";

            dgvWbs.RowTemplate.Height =
                25;

            dgvWbs.Size =
                new Size(1200, 600);

            // WbsForm
            AutoScaleDimensions =
                new SizeF(7F, 15F);

            AutoScaleMode =
                AutoScaleMode.Font;

            ClientSize =
                new Size(1200, 600);

            Controls.Add(dgvWbs);

            Name = "WbsForm";

            Text = "WBS";

            WindowState =
                FormWindowState.Maximized;

            ((System.ComponentModel.ISupportInitialize)
                dgvWbs).EndInit();

            ResumeLayout(false);
        }
    }
}

実装、起動確認

実際に実装、動かしてみるとこうなります。

一気にそれっぽくなりました。

まとめ

WBSもわかりやすくなったため、一気に実用的になりました。
次回以降もブラッシュアップしていきます。