ListBox 中的水平单选按钮答案

【问题标题】：Horizontal RadioButtons in ListBoxListBox 中的水平单选按钮
【发布时间】：2019-11-08 00:12:33
【问题描述】：

在 WPF 中，我试图将单选按钮绑定到 ViewModel 中的属性，例如这个 SO answer 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 的方向没有影响？

【问题讨论】：

我刚刚复制并粘贴了您的 XAML 和 F5，它工作正常。项目水平堆叠。您使用的是哪个 .Net 版本？
那我就不明白了……我也在用4.0，同样的XAML在我的电脑上也能正常工作……
HighCore - 无论如何，我都非常感谢您的快速帮助。下面的答案确实对我有用 - 所以，我不确定我们的不同之处。

标签： wpf mvvm

【解决方案1】：

试试这个：

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

我尝试使用 ItemsPanelTemplate 进行此操作，就像您所做的那样，但没有成功。这对我很有用。问候

【讨论】：

【解决方案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>

结果

【讨论】：