ItemControlのItemPanelとしてのWrappanel
-
01-10-2019 - |
質問
私が行くにつれて、まだWPFと学習をしていて、まだだまされています。今すぐコントロールの動的グループを構築しようとします(ほとんどがボタンですが、チェックボックスなどが含まれる場合があります)。
これを行う最良の方法が何であるかわからなかったので、ItemsControlスタイルを作成してから、アイテムをラッパネル内のアイテムプレゼントに追加しようとしました。アイテムがアイテムショストとして載せない限り、それらはラッパネルの内側に効果的ではなかったため、アイテムがラップを包むことはないことにすぐに気付きました。このような:
<Style x:Key="ButtonPanelGroup" TargetType="{x:Type ItemsControl}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ItemsControl}">
<Border CornerRadius="5"
BorderBrush="{StaticResource DarkColorBrush}"
BorderThickness="1"
Margin="5">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<WrapPanel IsItemsHost="True" FlowDirection="LeftToRight">
<ItemsPresenter />
</WrapPanel>
<ContentPresenter ContentSource="Name" Grid.Row="1" />
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
これは進行中の作業であり、私がまだ実装する必要がある多くのスタイリング効果があることに注意してください。ここで私はそれを使用します:
<UniformGrid Rows="1">
<ItemsControl Name="Group1" Style="{StaticResource ButtonPanelGroup}">
<Button>Button1</Button>
<Button>Button2</Button>
<CheckBox>TickBox</CheckBox>
</ItemsControl>
<ItemsControl Name="Group2" Style="{StaticResource ButtonPanelGroup}">
<Button>Button3</Button>
<Button>Button4</Button>
<Button>Button5</Button>
</ItemsControl>
<ItemsControl Name="Group3" Style="{StaticResource ButtonPanelGroup}">
<Button>Button6</Button>
<Button>Button7</Button>
<Button>Button8</Button>
</ItemsControl>
</UniformGrid>
また、ここでは均一なグリッドがここに行く方法ではなく、マージンも痛みになる可能性があるため、進行中の作業であることに注意してください(マージンが重なりますか?)
今、本当の問題に。これはうまくいきません私はエラーがあります:
「itemspresenter」オブジェクトは「wrappanel」に追加できません。 ItemsControlのItemspanelとして使用されるパネルの子供のコレクションを明示的に変更することはできません。 ItemsControlは、パネルの子要素を生成します。 Object 'System.Windows.Controls.Itemspresenterでのエラー。
それで、このようなことをするための最良の方法は何ですか(ボタンやその他のコントロールをItemControlに投げ入れることができるだけで、ラインアップは本当にいいです)。コントロールをある種のコレクションに入れて繰り返す方が良いでしょうか。
うまくやりたいと思っていますが、私のWPFスキルはまだ不足しています。基本を超えて教えるWPFの本はあり、Proが実際にそれを行う方法を示していますか?
解決
あなたはを見てみたいかもしれません アイテムパネル 財産:
アイテムのレイアウトを制御するパネルを定義するテンプレートを取得または設定します。
例:
<ItemsControl>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
そして、あなたは次のようにスタイルでそれを設定することができます:
<Style TargetType="ItemsControl">
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
</Style>
他のヒント
Clue Propertyの定義ISITEMSHOST = "true"を忘れないでください。それ以外の場合は、アイテムコントロールはアイテムを表示しません。
<ListBox ItemsSource="{Binding MyItemsSource}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate >
<WrapPanel IsItemsHost="True"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ListBox>
Slow Datagrid / X Cehted DatagridおよびWrappanelソリューションのもう1つの簡単な代替手段を示します。多くのデータまたはテーブル全体が編集のためだけの場合に役立つ場合があります。 ItemsControl + grid.issharedsizescope = "true"を使用する
詳細はこちら: https://wpf.2000things.com/tag/issharedsizescope/+項目のパフォーマンスのための自動化をコントロールする: アイテムコントロールを仮想化しますか?
<Grid Grid.IsSharedSizeScope="True" Margin="0,30,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="50" Width="Auto" SharedSizeGroup="Id" />
<ColumnDefinition MinWidth="50" Width="Auto" SharedSizeGroup="Time" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0" >
<TextBlock VerticalAlignment="Center" TextWrapping="NoWrap" Text="Header1" />
</Border>
<Border Grid.Column="1" >
<TextBlock VerticalAlignment="Center" TextWrapping="NoWrap" Text="Header2" />
</Border>
</Grid>
<ItemsControl Grid.Row="1" ItemsSource="{Binding RunInstance.ConcentrationGradient.Steps}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="50" Width="Auto" SharedSizeGroup="Id" />
<ColumnDefinition MinWidth="50" Width="Auto" SharedSizeGroup="Time" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0">
<TextBlock VerticalAlignment="Center" TextWrapping="NoWrap" Text="{Binding Index, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" />
</Border>
<Border Grid.Column="1">
<TextBlock VerticalAlignment="Center" TextWrapping="NoWrap" Text="{Binding Time, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" />
</Border>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>