0

Silverlight 5.0 を使用して、次のようなグリッドに一連のチェックボックスがあります。

<Border Grid.Column="1" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,25,10,0" Background="LightGray" Opacity="0.7" >
    <Grid Margin="5" >
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <CheckBox Grid.Row="0" Content="Item 1" Margin="0" />
        <CheckBox Grid.Row="1" Content="Item 1A" Margin="20,0,0,0" />
        <CheckBox Grid.Row="2" Content="Item 2" Margin="0" />
        <CheckBox Grid.Row="3" Content="Item 2A" Margin="20,0,0,0" />
        <CheckBox Grid.Row="4" Content="Item 2B" Margin="20,0,0,0" />
        <CheckBox Grid.Row="5" Content="Item 3" Margin="0" />
    </Grid>
</Border>

マージンを設定することで、アイテム 1A がアイテム 1 の下にインデントされ、アイテム 2A と 2B がアイテム 2 の下にインデントされるという、必要な効果が得られます。

ただし、これは単なるサンプルです。これらのアイテムは他にもたくさんあるので、実際には何らかのバインディングを使用して配置したいと思います。

Name、IsSelected、および Level (通常の場合は 0、インデントの場合は 20) を持つクラスと、次のような xaml から始めました。

<Border Grid.Column="1" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,25,10,0" Background="LightGray" Opacity="0.7" >
      <data:DataGrid x:Name="LayerOptionsGrid" AutoGenerateColumns="False" HeadersVisibility="None"> 
          <data:DataGrid.Columns>
              <data:DataGridCheckBoxColumn Binding="{Binding IsSelected}" />                                                     
              <data:DataGridTemplateColumn>
                   <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                             <ContentControl >
                                  <ContentPresenter Content="{Binding Name}" Margin="{Binding Level}" />
                             </ContentControl>
                        </DataTemplate>
                   </data:DataGridTemplateColumn.CellTemplate>
               </data:DataGridTemplateColumn>
           </data:DataGrid.Columns>
       </data:DataGrid>
   </Grid>
</Border>

私が得るのは、チェックボックスと名前のグリッドです。それほど悪くはありませんが、次の 2 つの大きな問題があります。チェックボックスを2回クリックして変更します（1回選択すると思います）。この結果を得るためのより良い方法を探しています：

(Checkbox) Item 1
    (Checkbox) Item 1A 
(Checkbox) Item 2
    (Checkbox) Item 2A
    (Checkbox) Item 2B

など、私の最初のブルートフォースアプローチが提供しました（必要な柔軟性はありませんが）。

注: Margin と呼ばれる Thickness プロパティを提供し、ContentControl に Margin="{Binding Margin}" を追加すると、Text のインデントは取得されますが、CheckBox のインデントは取得されません。

私はどんな選択肢も受け入れます。

4

1 に答える 1

0

問題のクリック選択部分を見ているときに答えが見つかりました。CellTemplate全体を次のCellEditingTemplateに置き換えました。

<data:DataGridTemplateColumn>
    <data:DataGridTemplateColumn.CellEditingTemplate>
        <DataTemplate>
            <CheckBox Margin="{Binding Margin}" IsThreeState="False" IsChecked="{Binding Path=IsSelected, Mode=TwoWay}" Content="{Binding Name}" />
        </DataTemplate>
    </data:DataGridTemplateColumn.CellEditingTemplate>
</data:DataGridTemplateColumn>

また、行を削除しました

<data:DataGridCheckBoxColumn Binding="{Binding IsSelected}" />

両方の問題を解決しました。

于 2012-08-28T21:14:44.487 に答える