WPF使StackPanel处于水平方向答案

【问题标题】：WPF Make StackPanel in Horizontal OrientationWPF使StackPanel处于水平方向
【发布时间】：2017-01-24 07:12:34
【问题描述】：

我的xaml代码如下

<Window.Resources>
    <DataTemplate DataType="{x:Type local:TopRulerElementViewModel}">
            <Ellipse Width="5" Height="5">
                <Ellipse.Fill>
                    <SolidColorBrush Color="Black"/>
                </Ellipse.Fill>
            </Ellipse>
    </DataTemplate>
</Window.Resources>
<StackPanel Orientation="Horizontal" Grid.Row="1" Grid.Column="1" Height="200" Width="500">
        <ItemsControl ItemsSource="{Binding TopRulerElements}"/>
</StackPanel>

我在 ViewModel 中的代码是这样的

    private ObservableCollection<TopRulerElementViewModel> _TopRulerElements;

    public ObservableCollection<TopRulerElementViewModel> TopRulerElements
    {
        get { return _TopRulerElements; }
        set
        {
            _TopRulerElements = value;
            RaisePropertyChanged("TopRulerElements");
        }
    }

但是当我运行我的应用程序时。所有椭圆都垂直显示。如何使椭圆水平显示？

【问题讨论】：

标签： c# wpf stackpanel

【解决方案1】：

你不应该那样做，你需要设置控件的 itemspanel 属性来指定项目应该如何对齐。试试下面的代码。

    <Window.Resources>
        <DataTemplate DataType="{x:Type local:TopRulerElementViewModel}">
                <Ellipse Width="5" Height="5">
                    <Ellipse.Fill>
                        <SolidColorBrush Color="Black"/>
                    </Ellipse.Fill>
                </Ellipse>
        </DataTemplate>
    </Window.Resources>

    <ItemsControl ItemsSource="{Binding TopRulerElements}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal" Grid.Row="1" Grid.Column="1" Height="200" Width="500"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
    </ItemsControl>

【讨论】：

【解决方案2】：

我找到了答案。对 xaml 代码进行小的更改时，可以垂直显示 Ellipse。

<StackPanel Orientation="Horizontal" Grid.Row="1" Grid.Column="1" Height="200" Width="500">
            <ItemsControl ItemsSource="{Binding TopRulerElements}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
</StackPanel>

添加ItemsPanel，然后就可以了

【讨论】：