WPF 使 StackPanel 处于水平方向
WPF Make StackPanel in Horizontal Orientation
我的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");
}
}
但是当我运行我的申请。所有椭圆都垂直显示。
如何让椭圆水平显示?
你不应该那样做,你需要设置控件的项目面板 属性 来指定项目应该如何对齐。试试下面的代码。
<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>
我找到了答案。 xaml 代码稍作改动,即可垂直显示椭圆。
<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,然后就可以了
我的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");
}
}
但是当我运行我的申请。所有椭圆都垂直显示。 如何让椭圆水平显示?
你不应该那样做,你需要设置控件的项目面板 属性 来指定项目应该如何对齐。试试下面的代码。
<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>
我找到了答案。 xaml 代码稍作改动,即可垂直显示椭圆。
<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,然后就可以了