ガントチャート作成日記

タスクを表現してみた。
タスクの移動とサイズをドラッグで変更できるようにプログラムを修正してみた。

リサイズと移動のためにThumbコントロールを利用している。
Gridの幅を細かくしたり、Canvasコントロールに配置すれば、ユーザーが自由にコントロールを配置できる。

<GanttGrid.xaml>に修正を行う。
明細にタスクを表現するためにItemsControlのスタイルを追加する。

                <!-- タスクを表現 -->
                <ItemsControl.ItemContainerStyle>
                    <Style>
                        <Setter Property="Grid.Column" Value="{Binding Path=ColumnIndex}"/>
                        <Setter Property="Grid.Row" Value="{Binding Path=RowIndex}"/>
                        <Setter Property="Grid.ColumnSpan" Value="{Binding Path=ColumnSpan}"/>
                    </Style>
                </ItemsControl.ItemContainerStyle>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <!--ドラッグ対象のオブジェクトを定義する-->
                        <Border BorderBrush="Black" BorderThickness="0.25"  Height="18">
                            <Grid Height="18">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="3"/>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="3"/>
                                </Grid.ColumnDefinitions>
                                <Thumb Name="LeftThumb" DragDelta="LeftThumb_DragDelta" QueryCursor="LeftThumb_QueryCursor" Grid.Column="0" >
                                    <Thumb.Template>
                                        <ControlTemplate>
                                            <Grid>
                                                <TextBlock Background="#FFF9CC95" Text="" />
                                            </Grid>
                                        </ControlTemplate>
                                    </Thumb.Template>
                                </Thumb>
                                <Thumb Name="CenterThumb" Grid.Column="1" DragDelta="Thumb_DragDelta" QueryCursor="CenterThumb_QueryCursor">
                                    <Thumb.Template>
                                        <ControlTemplate>
                                            <Grid>
                                                <TextBlock Background="#FFF9CC95" Text="サンプル"  FontFamily="MS Gothic"/>
                                            </Grid>
                                        </ControlTemplate>
                                    </Thumb.Template>
                                </Thumb>
                                <Thumb Name="RightThumb" Grid.Column="2" Width="5" Background="red" DragDelta="RightThumb_DragDelta" QueryCursor="RightThumb_QueryCursor">
                                    <Thumb.Template>
                                        <ControlTemplate>
                                            <Grid>
                                                <TextBlock Background="#FFF9CC95" Text="" />
                                            </Grid>
                                        </ControlTemplate>
                                    </Thumb.Template>
                                </Thumb>

                            </Grid>
                        </Border>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
                
<GanntGrid.cs>
下記のソースコードを追加
26で割っているのはColumnWidthの長さ。
移動量をColumnWidthで割ってColumnIndexを変更量を計算している

        //Thumbコントロールのドラッグイベント処理
        private void Thumb_DragDelta(object sender, DragDeltaEventArgs e)
        {
            var thumb = sender as Thumb;
            if (thumb == null) return;

            var cell = thumb.DataContext as GanttCell;

            int move = (int)e.HorizontalChange / 26;
            Console.WriteLine((e.HorizontalChange / 26).ToString() + ";" + move.ToString());
            cell.ColumnIndex = cell.ColumnIndex + (int)move;

        }

        private void LeftThumb_DragDelta(object sender, DragDeltaEventArgs e)
        {
            Console.WriteLine((e.HorizontalChange / 26).ToString() + ";" + "LeftThumb_DragDelta");

            var thumb = sender as Thumb;
            if (thumb == null) return;

            var cell = thumb.DataContext as GanttCell;

            int move = (int)e.HorizontalChange / 26;
            cell.ColumnIndex = cell.ColumnIndex + (int)move;
            cell.ColumnSpan = cell.ColumnSpan + (int)move * -1;

            Console.WriteLine((move).ToString());

        }

        private void RightThumb_DragDelta(object sender, DragDeltaEventArgs e)
        {
            Console.WriteLine((e.HorizontalChange / 26).ToString() + ";" + "RightThumb_DragDelta");

            var thumb = sender as Thumb;
            if (thumb == null) return;

            var cell = thumb.DataContext as GanttCell;

            int move = (int)e.HorizontalChange / 26;
            cell.ColumnSpan = cell.ColumnSpan + (int)move;
        }

        private void LeftThumb_QueryCursor(object sender, QueryCursorEventArgs e)
        {
            e.Cursor = Cursors.SizeWE;
            e.Handled = true;
        }

        private void CenterThumb_QueryCursor(object sender, QueryCursorEventArgs e)
        {
            e.Cursor = Cursors.Cross;
            e.Handled = true;
        }

        private void RightThumb_QueryCursor(object sender, QueryCursorEventArgs e)
        {
            e.Cursor = Cursors.SizeWE;
            e.Handled = true;
        }





<DownLoad>

0 件のコメント:

コメントを投稿

PowerShellでEdgeを自動化(インストール不要。参考:郵便追跡サービス自動操作)

1.経緯について  RPAのソフトをインストールできないので、これまでVBSでCreateObjectでブラウザの自動操作をすることがたまにあった。 ※いざというときの手札として持っているだけで安心感が段違い  見た目上IEがインストールされていなくても、CreateObject...