ListBoxItem Horizo​​ntalContentAlignment =拉伸无法正常工作 [英] ListBoxItem HorizontalContentAlignment=Stretch not working

问题描述

我无法让列表框项目延伸到整个列表框宽度。

下面是我的列表框的xaml

 < ListBox x：Name = MyListBox 
 VerticalAlignment = Stretch 
 Horizo​​ntalAlignment = Stretch 
 Horizo​​ntalContentAlignment =拉伸 
 Margin = 0,10,0,0 
 ItemsSource = {Binding Path = Users} 
 ScrollViewer.Horizo​​ntalScrollBarVisibility = Disabled 
 Grid.Column =  0 
 Grid.ColumnSpan = 1 
 Grid.Row = 1 
 Grid.RowSpan = 3> 
< ListBox.ItemTemplate> 
< DataTemplate> 
< local：MyListBoxTemplate /> 
< / DataTemplate> 
< /ListBox.ItemTemplate> 
< / ListBox> 
  

我尝试了其他帖子上的以下建议，但这些建议对我没有用：

• 将ListBox的Horizo​​ntalContentAlignment设置为Stretch


• 覆盖listboxitem的样式，即ItemContainerStyle标记中的新样式列表框xaml（注意：我正在使用世界性导航主题）


• 在CoreStyles.xaml中编辑DefaultListBoxItemStyle样式以包括Horizo​​ntalContentAlignmemt

是因为我要为数据模板使用单独的xaml文件吗？
还是我的数据模板有问题？
是否有人对我可以尝试的其他方法有任何建议？

我看到某个地方也许可以将ListBoxItem Width绑定到ListBox的实际宽度上？

我对此很陌生，所以如果我错过了一些非常简单/显而易见的内容，我会向您道歉！

下面是我的数据模板：

 < Grid x： Name = LayoutRoot Horizo​​ntalAlignment = Stretch ShowGridLines = True Height = 20> 
< Grid.ColumnDefinitions> 
< ColumnDefinition Width = 10 * /> 
< ColumnDefinition Width = 30 * /> 
< ColumnDefinition Width = 300 * /> 
< ColumnDefinition Width = 50 * /> 
< ColumnDefinition Width = 10 * /> 
< /Grid.ColumnDefinitions> 
< Image x：Name = TwitterImageIcon 
 Grid.Column = 1 
 Grid.ColumnSpan = 1 
 Source = {Binding Path = imageUrl} 
 /> 
< StackPanel Orientation = Horizo​​ntal Grid.Column = 2 Grid.ColumnSpan = 1 Horizo​​ntalAlignment = Stretch> 
 
< TextBlock x：Name = TwitterUsernameTextBlock 
 Text = {Binding Path = username，StringFormat ='@ \ {0\}}} /> 
< TextBlock x：Name = TwitterFullNameTextBlock 
 Text = {Binding Path = fullname} /> 
< / StackPanel> 
 
 
< Button x：Name = InfoButton 
 Content = Info 
 Grid.Column = 3 
 Horizo​​ntalAlignment = Stretch  
 VerticalAlignment = Stretch /> 
< Border x：Name = StyleBorder /> 
< / Grid> 
  

任何建议都值得赞赏。 / p>

预先感谢。

更新：添加时忘了提及：

 < ListBox ...> 
< ListBox.Resources> 
< Style TargetType = ListBoxItem> 
< Setter Property = Horizo​​ntalContentAlignment Value = Stretch /> 
< / Style> 
< /ListBox.Resources> 
< / ListBox> 
  

它的工作原理会影响世界性主题，因此将鼠标悬停并在选定时，列表框项目的突出显示

解决方案

在您的列表框中尝试以下操作：

 < ListBox ...> 
< ListBox.Resources> 
< Style TargetType = ListBoxItem> 
< Setter Property = Horizo​​ntalContentAlignment Value = Stretch /> 
< / Style> 
< /ListBox.Resources> 
< / ListBox> 
  

EDIT1
（对不起，我的英语不好）

在CoreStyles.xaml上找到 ListBoxItem 样式（查找 x：Key = DefaultListBoxItemStyle ）。
在该样式内，找到名为 x：Name = contentControl 的ContentControl并添加 Horizo​​ntalContentAlignment 属性，更改后的代码将如下所示：

 < ContentControl x：Name = contentControl Horizo​​ntalContentAlignment = {TemplateBinding Horizo​​ntalContentAlignment}> 
< ContentPresenter x：Name = contentPresenter ContentTemplate = {TemplateBinding ContentTemplate} Content = {TemplateBinding Content} VerticalAlignment = Center Horizo​​ntalAlignment = {TemplateBinding Horizo​​ntalContentAlignment} Margin = 7 /> ; 
< / ContentControl> 
  

现在您可以删除 Listbox。资源我在第一个答案上显示的...如果您不希望对所有listBox都使用此行为，则可以复制此样式并为其指定其他键。

I am having trouble getting my listbox items to stretch to the whole listbox width.

Below is my xaml for my listbox

<ListBox x:Name="MyListBox"
                 VerticalAlignment="Stretch"
                 HorizontalAlignment="Stretch"
                 HorizontalContentAlignment = "Stretch"
                 Margin="0,10,0,0"
                 ItemsSource="{Binding Path=Users}"
                 ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                 Grid.Column="0"
                 Grid.ColumnSpan="1"
                 Grid.Row="1"
                 Grid.RowSpan="3">                      
        <ListBox.ItemTemplate>
            <DataTemplate>
                <local:MyListBoxTemplate/>
            </DataTemplate>
        </ListBox.ItemTemplate>
</ListBox>

I have tried the following suggestions found on other posts but they haven't worked for me:

• Set the ListBox's HorizontalContentAlignment to Stretch
• Overwriting the style for listboxitem i.e. a new style within ItemContainerStyle tags within the listbox xaml (note: I am using the cosmopolitan navigation theme)
• Editting the DefaultListBoxItemStyle style in CoreStyles.xaml to include HorizontalContentAlignmemt

Is it because I am using a separate xaml file for my data template? Or a problem with my data template? Does anyone have any suggestions on what else I could try?

I saw somewhere perhaps I could bind the ListBoxItem Width to the ListBox's actual width?

I am pretty new to this so I apologise in advance if I have missed something really simple/obvious!

Below is my data template:

<Grid x:Name="LayoutRoot" HorizontalAlignment="Stretch" ShowGridLines="True" Height="20">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="10*" />
        <ColumnDefinition Width="30*" />
        <ColumnDefinition Width="300*" />
        <ColumnDefinition Width="50*" />
        <ColumnDefinition Width="10*" />
    </Grid.ColumnDefinitions>
    <Image x:Name="TwitterImageIcon"
           Grid.Column="1" 
           Grid.ColumnSpan="1" 
           Source="{Binding Path=imageUrl}"
          />
    <StackPanel Orientation="Horizontal" Grid.Column="2" Grid.ColumnSpan="1" HorizontalAlignment="Stretch" >

        <TextBlock x:Name="TwitterUsernameTextBlock"
                   Text="{Binding Path=username,StringFormat='@\{0\}  '}"/>
        <TextBlock x:Name="TwitterFullNameTextBlock"
               Text="{Binding Path=fullname}"/>
    </StackPanel>


        <Button x:Name="InfoButton"
            Content="Info" 
            Grid.Column="3" 
            HorizontalAlignment="Stretch" 
            VerticalAlignment="Stretch"/>
        <Border x:Name="StyleBorder" />
    </Grid>

Any suggestions greatly appreciated.

Thanks in advance.

Update: Forgot to mention that when adding:

    <ListBox...>
        <ListBox.Resources>
            <Style TargetType="ListBoxItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ListBox.Resources>
    </ListBox>

It works however affects the cosmopolitan theme so that the higlighting of the listbox item when hovered over and when selected are a different style to the the rest of the cosmopolitan theme.

解决方案

Try this, inside your listbox:

<ListBox...>
    <ListBox.Resources>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        </Style>
    </ListBox.Resources>
</ListBox>

EDIT1 (sorry for my bad english)

Find the ListBoxItem style on CoreStyles.xaml (look for x:Key="DefaultListBoxItemStyle"). Inside that style, find the ContentControl named x:Name="contentControl" and add the HorizontalContentAlignment property, the code will look like this after the change:

<ContentControl x:Name="contentControl" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" >
    <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" VerticalAlignment="Center"  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="7"/>
</ContentControl>

Now you can remove the Listbox.Resources that I show on the first answer... If you do not want this behaviour to all your listBoxes, you could copy this style and give it a different key.

这篇关于ListBoxItem Horizo​​ntalContentAlignment =拉伸无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！