0

表を挿入するときに、MS Word と同じ動作を取得しようとしています。四角形のグリッド上を移動すると、四角形が青色になり、表に必要な列と行の数が表示されます。

私が見つけた例を採用しましたが、現在の四角形の左と上にあるすべての四角形で塗りつぶしを変更したいときに行き詰まります。

私の ViewModel では、8 つの項目のコレクションを作成します。

ObservableCollection<BoardTileViewModel> board = new ObservableCollection<BoardTileViewModel>();
for (int i = 0; i < 8; i++)
{
    board.Add(new BoardTileViewModel(this, i % 4, i / 4));
}
this.Board = new ReadOnlyObservableCollection<BoardTileViewModel>(board);

ご覧のとおり、BoardTileViewModel はコンストラクターを介して X/Y 座標を取得するため、それを使用して何かを行うことができます。そして、ItemsControl に次のスタイルを使用します。

<ResourceDictionary
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Style x:Key="TileButtonStyle" TargetType="Button">
        <Setter Property="Margin" Value="0 0 1 1" />
        <Setter Property="Width" Value="30" />
        <Setter Property="Height" Value="30" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <Rectangle x:Name="PART_Rectangle" Fill="White" Stroke="Black"></Rectangle>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="PART_Rectangle" Property="Fill" Value="RoyalBlue" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="BoardItemsControlStyle" TargetType="ItemsControl">
        <Setter Property="Width" Value="124" />
        <Setter Property="Height" Value="62" />
        <Setter Property="ItemTemplate">
            <Setter.Value>
                <DataTemplate>
                    <Button Style="{StaticResource TileButtonStyle}" Command="{Binding Check}" />
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <WrapPanel />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

マウスが置かれている四角形の左と上にあるすべての四角形の塗りつぶしを設定する方法を提案する人はいますか?

4

1 に答える 1