ItemsStackPanel ItemsStackPanel ItemsStackPanel ItemsStackPanel Class

Definition

Arranges child elements of an ItemsControl into a single line that can be oriented horizontally or vertically. Supports pixel-based UI virtualization and grouped layouts.

public : sealed class ItemsStackPanel : Panel, IItemsStackPanel, IItemsStackPanel2public sealed class ItemsStackPanel : Panel, IItemsStackPanel, IItemsStackPanel2Public NotInheritable Class ItemsStackPanel Inherits Panel Implements IItemsStackPanel, IItemsStackPanel2// This API is not available in Javascript.
<ItemsStackPanel .../>
Inheritance
Attributes
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)

Inherited Members

Inherited properties

Inherited events

Inherited methods

Examples

This example shows how to use an ItemsStackPanel to display ListView items stacked horizontally.

<ListView>
    <ListView.ItemsPanel> 
        <ItemsPanelTemplate>
            <ItemsStackPanel Orientation="Horizontal"/>  
        </ItemsPanelTemplate> 
    </ListView.ItemsPanel> 
</ListView> 

Remarks

ItemsStackPanel can be used only as the ItemsPanel of an ItemsControl that displays more than one item at a time. It can't be used with an ItemsControl that displays only one item at a time, such as a ComboBox or FlipView. ItemsStackPanel is the default ItemsPanel for ListView.

By default, the ItemsStackPanel stacks items vertically from top to bottom. You can set the Orientation property to Horizontal to stack items from left to right.

Constructors

ItemsStackPanel() ItemsStackPanel() ItemsStackPanel() ItemsStackPanel()

Initializes a new instance of the ItemsStackPanel class.

public : ItemsStackPanel()public ItemsStackPanel()Public Sub New()// This API is not available in Javascript.

Properties

AreStickyGroupHeadersEnabled AreStickyGroupHeadersEnabled AreStickyGroupHeadersEnabled AreStickyGroupHeadersEnabled

Gets or sets a value that specifies whether a group header moves with the group when the group is panned vertically.

public : PlatForm::Boolean AreStickyGroupHeadersEnabled { get; set; }public bool AreStickyGroupHeadersEnabled { get; set; }Public ReadWrite Property AreStickyGroupHeadersEnabled As bool// This API is not available in Javascript.
Value
PlatForm::Boolean bool bool bool

true if the group header moves with the group when the group is panned vertically; otherwise, false. The default is true.

Examples

<ListView>
    <ListView.ItemsPanel> 
        <ItemsPanelTemplate>
            <ItemsStackPanel AreStickyGroupHeadersEnabled="False"/>  
        </ItemsPanelTemplate> 
    </ListView.ItemsPanel> 
</ListView> 

Remarks

Group headers can be sticky only when the group is panned vertically and the GroupHeaderPlacement is Top. If the panel's Orientation is Horizontal or GroupHeaderPlacement is not Top, this property is ignored.

AreStickyGroupHeadersEnabledProperty AreStickyGroupHeadersEnabledProperty AreStickyGroupHeadersEnabledProperty AreStickyGroupHeadersEnabledProperty

Identifies the AreStickyGroupHeadersEnabled dependency property.

public : static DependencyProperty AreStickyGroupHeadersEnabledProperty { get; }public static DependencyProperty AreStickyGroupHeadersEnabledProperty { get; }Public Static ReadOnly Property AreStickyGroupHeadersEnabledProperty As DependencyProperty// This API is not available in Javascript.

CacheLength CacheLength CacheLength CacheLength

Gets or sets the size of the buffers for items outside the viewport, in multiples of the viewport size.

public : double CacheLength { get; set; }public double CacheLength { get; set; }Public ReadWrite Property CacheLength As double// This API is not available in Javascript.
ItemsStackPanel CacheLength="double" />
Value
double double double double

The size of the buffers for items outside the viewport, in multiples of the viewport size. The default is 4.0.

Remarks

To improve scrolling performance, ItemsStackPanel creates and caches item containers for items that are off-screen on both sides of the viewport. The CacheLength property specifies the size of the buffers for the off-screen items. You specify CacheLength in multiples of the current viewport size. For example, if the CacheLength is 4.0, 2 viewports worth of items are buffered on each side of the viewport.

You can set a smaller cache length to optimize startup time, or set a larger cache size to optimize scrolling performance. Item containers that are off-screen are created at a lower priority than those in the viewport.

CacheLengthProperty CacheLengthProperty CacheLengthProperty CacheLengthProperty

Identifies the CacheLength dependency property.

public : static DependencyProperty CacheLengthProperty { get; }public static DependencyProperty CacheLengthProperty { get; }Public Static ReadOnly Property CacheLengthProperty As DependencyProperty// This API is not available in Javascript.
Value
DependencyProperty DependencyProperty DependencyProperty DependencyProperty

The identifier for the CacheLength dependency property.

FirstCacheIndex FirstCacheIndex FirstCacheIndex FirstCacheIndex

Gets the index in the data collection of the first item in the cache.

public : int FirstCacheIndex { get; }public int FirstCacheIndex { get; }Public ReadOnly Property FirstCacheIndex As int// This API is not available in Javascript.
Value
int int int int

The index in the data collection of the first item in the cache. The default is -1.

Remarks

The index of the container for the very first item and the focused items are not reported if they are not in the cache.

FirstVisibleIndex FirstVisibleIndex FirstVisibleIndex FirstVisibleIndex

Gets the index in the data collection of the first item on the screen. Partially visible items are considered to be on screen.

public : int FirstVisibleIndex { get; }public int FirstVisibleIndex { get; }Public ReadOnly Property FirstVisibleIndex As int// This API is not available in Javascript.
Value
int int int int

The index in the data collection of the first item on the screen. The default is -1.

GroupHeaderPlacement GroupHeaderPlacement GroupHeaderPlacement GroupHeaderPlacement

Gets or sets a value that specifies where group headers are positioned in relation to the group.

public : GroupHeaderPlacement GroupHeaderPlacement { get; set; }public GroupHeaderPlacement GroupHeaderPlacement { get; set; }Public ReadWrite Property GroupHeaderPlacement As GroupHeaderPlacement// This API is not available in Javascript.
ItemsStackPanel GroupHeaderPlacement="groupHeaderPlacementMemberName" />
Value
GroupHeaderPlacement GroupHeaderPlacement GroupHeaderPlacement GroupHeaderPlacement

An enumeration value that specifies where group headers are positioned in relation to the group. The default is Top.

Remarks

Valid values are Top and Left.

GroupHeaderPlacementProperty GroupHeaderPlacementProperty GroupHeaderPlacementProperty GroupHeaderPlacementProperty

Identifies the GroupHeaderPlacement dependency property.

public : static DependencyProperty GroupHeaderPlacementProperty { get; }public static DependencyProperty GroupHeaderPlacementProperty { get; }Public Static ReadOnly Property GroupHeaderPlacementProperty As DependencyProperty// This API is not available in Javascript.

GroupPadding GroupPadding GroupPadding GroupPadding

Gets or sets the amount of space around a group.

public : Thickness GroupPadding { get; set; }public Thickness GroupPadding { get; set; }Public ReadWrite Property GroupPadding As Thickness// This API is not available in Javascript.
Value
Thickness Thickness Thickness Thickness

The amount of space around a group as a Thickness value. Thickness is a structure that stores dimension values using pixel measures. The default is a uniform Thickness of 0.

GroupPaddingProperty GroupPaddingProperty GroupPaddingProperty GroupPaddingProperty

Identifies the GroupPadding dependency property.

public : static DependencyProperty GroupPaddingProperty { get; }public static DependencyProperty GroupPaddingProperty { get; }Public Static ReadOnly Property GroupPaddingProperty As DependencyProperty// This API is not available in Javascript.
Value
DependencyProperty DependencyProperty DependencyProperty DependencyProperty

The identifier for the GroupPadding dependency property.

ItemsUpdatingScrollMode ItemsUpdatingScrollMode ItemsUpdatingScrollMode ItemsUpdatingScrollMode

Gets or sets a value that specifies scrolling behavior when the ItemsSource is updated.

public : ItemsUpdatingScrollMode ItemsUpdatingScrollMode { get; set; }public ItemsUpdatingScrollMode ItemsUpdatingScrollMode { get; set; }Public ReadWrite Property ItemsUpdatingScrollMode As ItemsUpdatingScrollMode// This API is not available in Javascript.
<ItemsStackPanel ItemsUpdatingScrollMode="itemsUpdatingScrollModeMemberName" />
Value
ItemsUpdatingScrollMode ItemsUpdatingScrollMode ItemsUpdatingScrollMode ItemsUpdatingScrollMode

A value of the enumeration. The default is KeepItemsInView.

Remarks

This property controls how the ItemsStackPanel responds when the user has scrolled the items, and new items are added to the ItemsSource.

For example, if a user scrolls down a list of emails, and the ItemsSource updates, adding a new email to the top of the list:

  • If ItemsUpdatingScrollMode is KeepItemsInView, then the scroll offset is adjusted to keep the first visible item showing at the top of the view.
  • If ItemsUpdatingScrollMode is KeepScrollOffset, then the scroll offset relative to the top of the list is maintained. As a result, the items on the screen are pushed down to account for the new item added at the top.

In other cases, like in a chat app, items are added to the bottom of the list. In this case, you can set ItemsUpdatingScrollMode to KeepLastItemInView. This adjusts the scroll offset to keep the last visible item showing at the bottom of the view. (KeepLastItemInView is available starting with Windows 10, version 1607.)

Tip

In Windows 8, the ListView control uses VirtualizingStackPanel as its default ItemsPanel; in Windows 8.1, the ListView control uses ItemsStackPanel as its default ItemsPanel. When upgrading a ListView in a Windows 8 app to use ItemsStackPanel, set the ItemsUpdatingScrollMode property to KeepScrollOffset if you need to keep the behavior of the Windows 8 ListView.

LastCacheIndex LastCacheIndex LastCacheIndex LastCacheIndex

Gets the index in the data collection of the last item in the cache.

public : int LastCacheIndex { get; }public int LastCacheIndex { get; }Public ReadOnly Property LastCacheIndex As int// This API is not available in Javascript.
Value
int int int int

The index in the data collection of the last item in the cache. The default is -1.

LastVisibleIndex LastVisibleIndex LastVisibleIndex LastVisibleIndex

Gets the index in the data collection of the last item on the screen. Partially visible items are considered to be on screen.

public : int LastVisibleIndex { get; }public int LastVisibleIndex { get; }Public ReadOnly Property LastVisibleIndex As int// This API is not available in Javascript.
Value
int int int int

The index in the data collection of the last item on the screen. The default is -1.

Orientation Orientation Orientation Orientation

Gets or sets the dimension by which child elements are stacked.

public : Orientation Orientation { get; set; }public Orientation Orientation { get; set; }Public ReadWrite Property Orientation As Orientation// This API is not available in Javascript.
ItemsStackPanel Orientation="orientationMemberName" />
Value
Orientation Orientation Orientation Orientation

One of the enumeration values that specifies the orientation of child elements. The default is Vertical.

OrientationProperty OrientationProperty OrientationProperty OrientationProperty

Identifies the Orientation dependency property.

public : static DependencyProperty OrientationProperty { get; }public static DependencyProperty OrientationProperty { get; }Public Static ReadOnly Property OrientationProperty As DependencyProperty// This API is not available in Javascript.
Value
DependencyProperty DependencyProperty DependencyProperty DependencyProperty

The identifier for the Orientation dependency property.

ScrollingDirection ScrollingDirection ScrollingDirection ScrollingDirection

Gets a value that indicates whether items are panning forward or backward, or aren't panning.

public : PanelScrollingDirection ScrollingDirection { get; }public PanelScrollingDirection ScrollingDirection { get; }Public ReadOnly Property ScrollingDirection As PanelScrollingDirection// This API is not available in Javascript.
Value
PanelScrollingDirection PanelScrollingDirection PanelScrollingDirection PanelScrollingDirection

An enumeration value that indicates whether the items are panning Forward or Backward, or None if the items are not panning.

See Also