wpf - ListBox 中的水平单选按钮

Question

在 WPF 中，我试图将单选按钮绑定到 ViewModel 中的属性，例如这个 SO 答案https://stackoverflow.com/a/2285732

一切正常，除了按钮是垂直堆叠的。现在，这似乎很容易解决，只需修改 ItemsPanelTemplate。

这是我的代码：

<ListBox ItemsSource="{Binding ItemOptions}" SelectedItem="{Binding SelectedOption}">
     <ListBox.ItemsPanel>
          <ItemsPanelTemplate>
               <StackPanel Orientation="Horizontal" IsItemsHost="True" />
          </ItemsPanelTemplate>
     </ListBox.ItemsPanel>
     <ListBox.ItemContainerStyle>
          <Style TargetType="{x:Type ListBoxItem}">
               <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListBoxItem}"  >
                            <RadioButton Content="{TemplateBinding Content}" 
                                 IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsSelected}"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
           </Style>
     </ListBox.ItemContainerStyle>
</ListBox>

但是，这些项目保持垂直堆叠。任何想法为什么这对 ListBox 的方向没有影响？

Answer 1

Try this:

<ListBox.Template>
      <ControlTemplate TargetType="{x:Type ListBox}">
          <ScrollViewer x:Name="scrollviewer" 
                        HorizontalScrollBarVisibility="Visible" CanContentScroll="False">
            <StackPanel IsItemsHost="True" Orientation="Horizontal" />
          </ScrollViewer>
      </ControlTemplate>
 </ListBox.Template>

I tried to get this working with the ItemsPanelTemplate, as you did, without success. This worked great for me. Regards

Answer 2

这是一个没有样式的基本示例。请注意，WrapPanel处理布局。

    <ListBox Margin="0,10,0,0"        
             ItemsSource="{StaticResource Orders}">
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel HorizontalAlignment="Stretch"/>
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <RadioButton Content="{Binding CustomerName}" />
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

具有在后面代码中定义的模型的数据。

<Page.Resources>
    <model:Orders x:Key="Orders">
        <model:Order CustomerName="Alpha"
                    OrderId="997"
                    InProgress="True" />
        <model:Order CustomerName="Beta"
                    OrderId="998"
                    InProgress="False" />
        <model:Order CustomerName="Omega"
                    OrderId="999"
                    InProgress="True" />
        <model:Order CustomerName="Zeta"
                    OrderId="1000"
                    InProgress="False" />
    </model:Orders>
</Page.Resources>

结果