Listbox items not wrapping, tried almost everything. it might be due to ItemTemplate

huangapple
go评论89阅读模式
英文:

Listbox items not wrapping, tried almost everything. it might be due to ItemTemplate

问题

尝试将WrapPanel添加为父元素、子元素以及项目模板的父元素，但不起作用

  1. <UserControl.Resources>
  2.     <DataTemplate x:Key="CredentialTemplate" DataType="{x:Type local:Credentials}">
  3.         <WrapPanel Width="800" Orientation="Horizontal">
  4.             <Grid Background="Red" Width="160" Height="160">
  5.                 <Grid.RowDefinitions>
  6.                     <RowDefinition Height="40"/>
  7.                     <RowDefinition/>
  8.                     <RowDefinition/>
  9.                 </Grid.RowDefinitions>
  10.                 <Grid.ColumnDefinitions>
  11.                     <ColumnDefinition/>
  12.                     <ColumnDefinition/>
  13.                 </Grid.ColumnDefinitions>
  14.                 <TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding FileName}" FontWeight="Bold" Margin="0,0,10,0"/>
  15.                 <Button Grid.Row="1" Grid.Column="0" x:Name="btnCopyUsername" Tag="{Binding Button}" Content="Copy Username" Click="OnCopyUsernameButtonClicked" Margin="10"/>
  16.                 <Button Grid.Row="1" Grid Column="1" x:Name="btnCopyPassword" Tag="{Binding Button}" Content="Copy Password" Click="OnCopyPasswordButtonClicked" Margin="10"/>
  17.                 <Button Grid.Row="2" Grid.Column="0" x:Name="btnEdit" Tag="{Binding Button}" Content="Edit" Click="OnEditButtonClicked" Margin="10"/>
  18.                 <Button Grid.Row="2" Grid.Column="1" x:Name="btnCopyBoth" Tag="{Binding Button}" Content="Copy Both" Click="OnCopyBothButtonClicked" Margin="10"/>
  19.             </Grid>
  20.         </WrapPanel>
  21.     </DataTemplate>
  22. </UserControl.Resources>
  23. <WrapPanel Width="900" Background="Yellow">
  24.     <ListBox ItemsSource="{Binding Credentials}" ItemTemplate="{StaticResource CredentialTemplate}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled">
  25.         <ListBox.ItemsPanel>
  26.             <ItemsPanelTemplate>
  27.                 <WrapPanel Orientation="Horizontal" Background="Green" Margin="10"/>
  28.             </ItemsPanelTemplate>
  29.         </ListBox.ItemsPanel>
  30.     </ListBox>
  31. </WrapPanel>
  32. </UserControl>

可能是Grid控件不允许包装，通常情况下，没有项目模板的情况下应该可以工作。

屏幕截图

英文:

**Tried adding wrap panel as parent, as child, as item template parent, but didn't work
**

  1.     &lt;UserControl.Resources&gt;
  2. &lt;DataTemplate x:Key=&quot;CredentialTemplate&quot; DataType=&quot;{x:Type local:Credentials}&quot;&gt;
  3. &lt;WrapPanel Width=&quot;800&quot; Orientation=&quot;Horizontal&quot;&gt;
  4. &lt;Grid Background=&quot;Red&quot; Width=&quot;160&quot; Height=&quot;160&quot;&gt;
  5. &lt;Grid.RowDefinitions&gt;
  6. &lt;RowDefinition Height=&quot;40&quot;/&gt;
  7. &lt;RowDefinition/&gt;
  8. &lt;RowDefinition/&gt;
  9. &lt;/Grid.RowDefinitions&gt;
  10. &lt;Grid.ColumnDefinitions&gt;
  11. &lt;ColumnDefinition/&gt;
  12. &lt;ColumnDefinition/&gt;
  13. &lt;/Grid.ColumnDefinitions&gt;
  14. &lt;TextBlock Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding FileName}&quot; FontWeight=&quot;Bold&quot; Margin=&quot;0,0,10,0&quot;/&gt;
  15. &lt;Button Grid.Row=&quot;1&quot; Grid.Column=&quot;0&quot; x:Name=&quot;btnCopyUsername&quot; Tag=&quot;{Binding Button}&quot; Content=&quot;Copy Username&quot; Click=&quot;OnCopyUsernameButtonClicked&quot; Margin=&quot;10&quot;/&gt;
  16. &lt;Button Grid.Row=&quot;1&quot; Grid.Column=&quot;1&quot;  x:Name=&quot;btnCopyPassword&quot; Tag=&quot;{Binding Button}&quot; Content=&quot;Copy Password&quot; Click=&quot;OnCopyPasswordButtonClicked&quot; Margin=&quot;10&quot;/&gt;
  17. &lt;Button Grid.Row=&quot;2&quot; Grid.Column=&quot;0&quot; x:Name=&quot;btnEdit&quot; Tag=&quot;{Binding Button}&quot; Content=&quot;Edit&quot; Click=&quot;OnEditButtonClicked&quot; Margin=&quot;10&quot;/&gt;
  18. &lt;Button Grid.Row=&quot;2&quot; Grid.Column=&quot;1&quot; x:Name=&quot;btnCopyBoth&quot; Tag=&quot;{Binding Button}&quot; Content=&quot;Copy Both&quot; Click=&quot;OnCopyBothButtonClicked&quot; Margin=&quot;10&quot;/&gt;
  19. &lt;/Grid&gt;
  20. &lt;/WrapPanel&gt;
  21. &lt;/DataTemplate&gt;
  22. &lt;/UserControl.Resources&gt;
  23. &lt;WrapPanel Width=&quot;900&quot; Background=&quot;Yellow&quot;&gt;
  24. &lt;ListBox ItemsSource=&quot;{Binding Credentials}&quot; ItemTemplate=&quot;{StaticResource CredentialTemplate}&quot; ScrollViewer.HorizontalScrollBarVisibility=&quot;Disabled&quot;  ScrollViewer.VerticalScrollBarVisibility=&quot;Disabled&quot;&gt;
  25. &lt;ListBox.ItemsPanel&gt;
  26. &lt;ItemsPanelTemplate&gt;
  27. &lt;WrapPanel Orientation=&quot;Horizontal&quot; Background=&quot;Green&quot; Margin=&quot;10&quot;/&gt;
  28. &lt;/ItemsPanelTemplate&gt;
  29. &lt;/ListBox.ItemsPanel&gt;
  30. &lt;/ListBox&gt;
  31. &lt;/WrapPanel&gt;
  32. &lt;/UserControl&gt;

It might be the grid control that not letting wrap, normally without item template it should work

Screenshot

答案1

得分: 0

我使用了你的标记的简化版本来探讨这个问题。
我没有凭证类，但格子里的内容并不重要。

我的标记中有更少的wrappanels：

  1. <Grid>
  2.     <Grid.Resources>
  3.         <DataTemplate x:Key="CredentialTemplate">
  4.             <Grid Background="Red" Width="40" Height="40">
  6.             </Grid>
  7.         </DataTemplate>
  8.     </Grid.Resources>
  9.     <ListBox ItemsSource="{Binding Points}" 
  10.              ItemTemplate="{StaticResource CredentialTemplate}" 
  11.              ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
  12.              ScrollViewer.VerticalScrollBarVisibility="Disabled">
  13.         <ListBox.ItemsPanel>
  14.             <ItemsPanelTemplate>
  15.                 <WrapPanel Orientation="Horizontal" 
  16.                            Background="Green" Margin="10"/>
  17.             </ItemsPanelTemplate>
  18.         </ListBox.ItemsPanel>
  19.     </ListBox>
  20. </Grid>

我的视图模型中有30个点。
我的网格较小

正常包裹：

Listbox items not wrapping, tried almost everything. it might be due to ItemTemplate

英文:

I explored this issue with a simplified version of your markup.
I don't have a credentials class, but what's in the grids doesn't matter.

My markup has less wrappanels:

  1.     &lt;Grid&gt;
  2. &lt;Grid.Resources&gt;
  3. &lt;DataTemplate x:Key=&quot;CredentialTemplate&quot;&gt;
  4. &lt;Grid Background=&quot;Red&quot; Width=&quot;40&quot; Height=&quot;40&quot;&gt;
  5. &lt;/Grid&gt;
  6. &lt;/DataTemplate&gt;
  7. &lt;/Grid.Resources&gt;
  8. &lt;ListBox ItemsSource=&quot;{Binding Points}&quot; 
  9. ItemTemplate=&quot;{StaticResource CredentialTemplate}&quot; 
  10. ScrollViewer.HorizontalScrollBarVisibility=&quot;Disabled&quot; 
  11. ScrollViewer.VerticalScrollBarVisibility=&quot;Disabled&quot;&gt;
  12. &lt;ListBox.ItemsPanel&gt;
  13. &lt;ItemsPanelTemplate&gt;
  14. &lt;WrapPanel Orientation=&quot;Horizontal&quot; 
  15. Background=&quot;Green&quot; Margin=&quot;10&quot;/&gt;
  16. &lt;/ItemsPanelTemplate&gt;
  17. &lt;/ListBox.ItemsPanel&gt;
  18. &lt;/ListBox&gt;
  19. &lt;/Grid&gt;

I've got 30 Points in my viewmodel.
My grid is smaller

Wraps ok:

Listbox items not wrapping, tried almost everything. it might be due to ItemTemplate

答案2

得分: 0

以下是您要翻译的内容：

  1. <List view Item Template with wrapping list view items>
  2. in my case i have sales man list and i am displaying sales man name in round button using Wrap Panel.
  4.     <ListView Grid.Column="1"  Grid.Row="3"  Name="lv" 
  5.           Style="{DynamicResource NewCollectionInfoModuleSalesRepListViewStyle}"
  6.           SelectedValue="{Binding Path=SelectedSalseRepData,
  7.                                   Mode=TwoWay, 
  8.                                   UpdateSourceTrigger=PropertyChanged,
  9.                                   NotifyOnValidationError=True, 
  10.                                   ValidatesOnDataErrors=True, ValidatesOnExceptions=True}">
  11.             
  12.             <ListView.ItemsPanel>
  13.                 <ItemsPanelTemplate>
  14.                     <WrapPanel />
  15.                 </ItemsPanelTemplate>
  16.             </ListView.ItemsPanel>
  18.             <ListView.ItemTemplate>
  19.                 <DataTemplate>
  20.                     <Grid>
  21.                         <Grid.RowDefinitions >
  22.                             <RowDefinition Height="80" />
  23.                         </Grid.RowDefinitions>
  24.                         <Grid.ColumnDefinitions>
  25.                             <ColumnDefinition Width="188" />
  26.                         </Grid.ColumnDefinitions>
  28.                         <Button  Grid.Row="0" Grid.Column="0"
  29.                                  HorizontalAlignment="Stretch"
  30.                                  VerticalAlignment="Stretch"
  31.                                  Style="{DynamicResource NewCollectionInfoModuleSalesRepListButtonStyle}"
  32.                                  Background="{Binding Path=SelectedSalesRepColor,Mode=TwoWay}"
  33.                                  IsEnabled="False">
  34.                             <StackPanel>
  36.                                 <TextBlock  Grid.Row="0" Grid.Column="0"
  37.                                                     Style="{DynamicResource NewCollectionInfoModuleSalesRepListTextBlockStyle}"
  38.                                                     Text="{Binding Path=Name,Mode=TwoWay}"
  39.                                                     Foreground="{Binding Path=SelectedSalesRepTextBlockColor,Mode=TwoWay}">
  40.                                 </TextBlock>
  41.                             </StackPanel>
  42.                         </Button>
  44.                     </Grid>
  45.                 </DataTemplate>
  46.             </ListView.ItemTemplate>
  47.         </ListView>
英文:

List view Item Template with wrapping list view items
in my case i have sales man list and i am displaying sales man name in round button using Wrap Panel.

  1. &lt;ListView Grid.Column=&quot;1&quot;  Grid.Row=&quot;3&quot;  Name=&quot;lv&quot; 
  2. Style=&quot;{DynamicResource NewCollectionInfoModuleSalesRepListViewStyle}&quot;
  3. SelectedValue=&quot;{Binding Path=SelectedSalseRepData,
  4. Mode=TwoWay, 
  5. UpdateSourceTrigger=PropertyChanged,
  6. NotifyOnValidationError=True, 
  7. ValidatesOnDataErrors=True, ValidatesOnExceptions=True}&quot;
  8. ItemContainerStyle=&quot;{DynamicResource NewCollectionInfoModuleSalesRepListViewItemStyle}&quot;
  9. ItemsSource=&quot;{Binding Path=lstSalesRepresentative}&quot;&gt;
  10. &lt;ListView.ItemsPanel&gt;
  11. &lt;ItemsPanelTemplate&gt;
  12. &lt;WrapPanel /&gt;
  13. &lt;/ItemsPanelTemplate&gt;
  14. &lt;/ListView.ItemsPanel&gt;
  15. &lt;ListView.ItemTemplate&gt;
  16. &lt;DataTemplate&gt;
  17. &lt;Grid&gt;
  18. &lt;Grid.RowDefinitions &gt;
  19. &lt;RowDefinition Height=&quot;80&quot; /&gt;
  20. &lt;/Grid.RowDefinitions&gt;
  21. &lt;Grid.ColumnDefinitions&gt;
  22. &lt;ColumnDefinition Width=&quot;188&quot; /&gt;
  23. &lt;/Grid.ColumnDefinitions&gt;
  24. &lt;Button  Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot;
  25. HorizontalAlignment=&quot;Stretch&quot;
  26. VerticalAlignment=&quot;Stretch&quot;
  27. Style=&quot;{DynamicResource NewCollectionInfoModuleSalesRepListButtonStyle}&quot;
  28. Background=&quot;{Binding Path=SelectedSalesRepColor,Mode=TwoWay}&quot;
  29. IsEnabled=&quot;False&quot;&gt;
  30. &lt;StackPanel&gt;
  31. &lt;TextBlock  Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot;
  32. Style=&quot;{DynamicResource NewCollectionInfoModuleSalesRepListTextBlockStyle}&quot;
  33. Text=&quot;{Binding Path=Name,Mode=TwoWay}&quot;
  34. Foreground=&quot;{Binding Path=SelectedSalesRepTextBlockColor,Mode=TwoWay}&quot;&gt;
  35. &lt;/TextBlock&gt;
  36. &lt;/StackPanel&gt;
  37. &lt;/Button&gt;
  38. &lt;/Grid&gt;
  39. &lt;/DataTemplate&gt;
  40. &lt;/ListView.ItemTemplate&gt;
  41. &lt;/ListView&gt;

huangapple
  • 本文由 发表于 2023年2月19日 23:45:02
  • 转载请务必保留本文链接：https://go.coder-hub.com/75501321.html
  • itemtemplate
  • listbox
  • wpf
  • xaml
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定