UWP ItemsWrapgridのリストビューのアイテムの内容に基づいた幅の設定

Question

私は、UWPのdatatemplateのトグルボタン付きListviewを持っています。リストビューをitemwrapgridとして設定しました。私はトグルボタンの内容の長さに基づいて項目の異なる幅を割り当てようとしています。誰でも私にこれを手伝うことができますか？

<ListView x:Name="lstVw1" IsMultiSelectCheckBoxEnabled="True" Margin="0,20,0,0"> 
        <ListView.ItemsPanel> 
         <ItemsPanelTemplate> 
          <ItemsWrapGrid Orientation="Horizontal" Width="Auto" HorizontalAlignment="Stretch"></ItemsWrapGrid> 
         </ItemsPanelTemplate> 
        </ListView.ItemsPanel> 
        <ListView.ItemTemplate> 
         <DataTemplate> 
          <ToggleButton Style="{StaticResource ButtonStyle}" Content="{Binding ItemText}" Click="ToggleButton_Click"> 
          </ToggleButton> 
         </DataTemplate> 
        </ListView.ItemTemplate> 
        <ListView.ItemContainerStyle> 
         <Style TargetType="ListViewItem"> 
          <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 

          <Setter Property="Template"> 
           <Setter.Value> 
            <ControlTemplate> 
             <ContentPresenter Padding="5"/> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 

        </ListView.ItemContainerStyle> 
       </ListView> 

上記のXAMLは、私が上記のカスタムラップパネルを作成したリストの中equalyサイズのトグルボタンに

Answer 1

を与えます。

Reference

Answer 2

私はUWP Community ToolkitからWrapPanelを使用します。あなたはnugetパッケージをダウンロードしてWrapPanelが誤っMicrosoft.Toolkit.Uwp.Controls.WrapPanel名前空間に置かれたこと

<ListView.ItemsPanel> 
    <ItemsPanelTemplate> 
     <wrapPanel:WrapPanel Orientation="Horizontal"/> 
    </ItemsPanelTemplate> 
</ListView.ItemsPanel> 

注WrapPanelであるためにあなたのListViewのあなたのItemsPanelを変更するので、あなたのXAMLでwrapPanel名前空間を宣言する必要がありますすることができます

xmlns:wrapPanel="using:Microsoft.Toolkit.Uwp.Controls.WrapPanel" 

Answer 3

これは、デフォルトではまさにそのように動作します - ItemTemplateは、コンテンツに合わせて拡大していきます。 ItemsStackPanelをItemsPanelTemplateとする必要があります。あなたは間違っていた何

はこのラインである、あなたはそれを削除する必要があります。コントロールは、バージョン2.0で適切な `Microsoft.Toolkit.Uwp.Controls`ネームスペースに移動すること

<Setter Property="HorizontalContentAlignment" Value="Stretch" />