WPF基础五：UI①布局元素StackPanel

目录

StackPanel

StackPanel类

StackPanel.Orientation：指示子元素的堆叠维度

HorizontalAlignment：水平对齐方式

VerticalAlignment：垂直对齐方式

范例：

C#代码

StackPanel 控件的滚动条

---

StackPanel

 

将子元素排列成水平或垂直的一行。

---

StackPanel类

名称	备注	权限
OrientationProperty	标识 Orientation 依赖项属性。	public

 

名称	备注	权限
CanHorizontallyScroll	获取或设置一个值，该值指示内容能否水平滚动	public
CanVerticallyScroll	获取或设置一个值，该值指示内容能否垂直滚动	public
ExtentHeight	获取包含盘区垂直大小的一个值	public
ExtentWidth	获取包含盘区水平大小的值	public
HasLogicalOrientation	获取一个值，该值指示此 StackPanel 是水平方向还是垂直方向	protected
HorizontalOffse	获取一个值，该值包含滚动内容的水平偏移量	public
LogicalOrientation	获取一个值，该值表示 Orientation 的 StackPanel	public
Orientation	获取或设置一个值，该值指示子元素的堆叠维度	public
ScrollOwner	获取或设置一个值，该值标识控制此 StackPanel 中的滚动行为的容器	public
VerticalOffset	获取包含滚动内容的垂直偏移量的值	public
ViewportHeight	获取包含内容视区垂直大小的值	public
ViewportWidth	获取包含内容视区水平大小的值	public

名称	备注	权限
ArrangeOverride	排列 StackPanel 元素的内容	protected
LineDown	将内容向下滚动一个逻辑单位	public
LineLeft	将内容向左滚动一个逻辑单位	public
LineRight	将内容向右滚动一个逻辑单位	public
LineUp	将内容向上滚动一个逻辑单位	public
MakeVisible	滚动到指定坐标并使该 Visual 部分可见	public
MeasureOverride	测量 StackPanel 的子元素，以便准备在 ArrangeOverride(Size) 处理过程中排列它们	protected
MouseWheelDown	向下逻辑滚动内容以响应鼠标滚轮按钮的单击操作	public
MouseWheelLeft	向左逻辑滚动内容以响应鼠标滚轮按钮的单击操作	public
MouseWheelRight	向右逻辑滚动内容以响应鼠标滚轮按钮的单击操作	public
MouseWheelUp	向上逻辑滚动内容以响应鼠标滚轮按钮的单击操作	public
PageDown	将内容向下逻辑滚动一页	public
PageLeft	将内容向左逻辑滚动一页	public
PageRight	将内容向右逻辑滚动一页	public
PageUp	将内容向上逻辑滚动一页	public
SetHorizontalOffset	设置 HorizontalOffset 属性的值	public
SetVerticalOffset	设置 VerticalOffset 属性的值	public

---

• StackPanel包含UIElement对象的集合  ，这些对象位于 Children 属性中。
• StackPanel中包含内容的HorizontalAlignment 、VerticalAlignment的默认值都是 stretch。
• 默认情况下，Panel 元素不接收焦点。 若要强制 panel 元素以接收焦点，请将 Focusable 属性设置为 true 。
• StackPanel 实现 IScrollInfo 接口以支持逻辑滚动。 逻辑滚动用于滚动到逻辑树中的下一个元素。 这与物理滚动相反，后者按给定方向按定义的物理增量滚动内容。 如果需要物理滚动而不是逻辑滚动，请将StackPanel 包含在 ScrollViewer 中，并将其 CanContentScroll 属性设置为 false 。
   

---

StackPanel.Orientation：指示子元素的堆叠维度

• Horizontal：水平布置。
• Vertical：垂直布置。

HorizontalAlignment：水平对齐方式

• Left
• Center
• Right
• Stretch

VerticalAlignment：垂直对齐方式

• Top
• Center
• Bottom
• Stretch

 

---

范例：

<Window x:Class="StackPanelDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:StackPanelDemo"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <StackPanel Orientation="Horizontal">
            <Button Content="Btn1" HorizontalAlignment="Stretch" MaxWidth="500" MinWidth="100" />
            <Button Content="Btn2" HorizontalAlignment="Stretch" MaxWidth="500" MinWidth="100"/>
            <Button Content="Btn3" HorizontalAlignment="Stretch" MaxWidth="500" MinWidth="100"/>
        </StackPanel>
    </Grid>
</Window>

修改 Orientation="Vertical"

---

C#代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace StackPanelDemo
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            StackPanel stackPanel = new StackPanel();
            stackPanel.Orientation = Orientation.Vertical;

            Button button1 = new Button();
            Button button2 = new Button();
            Button button3 = new Button();

            button1.Height = 200;
            button1.MinWidth = 100;
            button1.MaxWidth = 500;
            button1.HorizontalAlignment = HorizontalAlignment.Stretch;
            button1.Content = "Btn1";

            button2.Height = 200;
            button2.MinWidth = 100;
            button2.MaxWidth = 500;
            button2.HorizontalAlignment = HorizontalAlignment.Stretch;
            button2.Content = "Btn2";

            button3.Height = 200;
            button3.MinWidth = 100;
            button3.MaxWidth = 500;
            button3.HorizontalAlignment = HorizontalAlignment.Stretch;
            button3.Content = "Btn3";

            stackPanel.Children.Add(button1);
            stackPanel.Children.Add(button2);
            stackPanel.Children.Add(button3);

            ((this as Window).Content as Grid).Children.Add(stackPanel);

        }
    }
}

---

StackPanel 控件的滚动条

<Window
    x:Class="StackPanelDemo.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:StackPanelDemo"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Title="MainWindow"
    Width="800"
    Height="450"
    mc:Ignorable="d">
    <Grid>
        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
            <StackPanel x:Name="sp1"  Orientation="Vertical">
                <Button
                    Height="200"
                    MinWidth="100"
                    MaxWidth="500"
                    HorizontalAlignment="Stretch"
                    Content="Btn1" />
                <Button
                    Height="200"
                    MinWidth="100"
                    MaxWidth="500"
                    HorizontalAlignment="Stretch"
                    Content="Btn2" />
                <Button
                    Height="200"
                    MinWidth="100"
                    MaxWidth="500"
                    HorizontalAlignment="Stretch"
                    Content="Btn3" />
            </StackPanel>
        </ScrollViewer>
    </Grid>
</Window>

---

其他一些方法如LineUp()等，必须实现System.Windows.Controls.Primitives.IScrollInfo接口