水平列表框无法滚动 Windows Phone 8.1 WP8.1

Question

我的 WP8.1 应用程序 (WinRT) 中的 ListBox 出现问题，我无法使其水平滚动。 5 张图片适合屏幕，第 6 张之后的所有内容都被简单裁剪。 我尝试在列表框周围添加ScrollViewer，在ItemsPanelTemplate 周围添加ListBox，但没有任何效果。 这是我的 xaml 代码

    <ListBox x:Name="AppBarMenu"
         Grid.Row="1"
         Canvas.ZIndex="1"
         ScrollViewer.HorizontalScrollBarVisibility="Auto"
         Background="{StaticResource BackgroundColorApp}"
         ItemTemplate="{StaticResource StackMenuItem}"
         ItemsSource="{Binding}"
         Style="{StaticResource ListBoxHorizontal}"
         ItemContainerStyle="{StaticResource ListBoxContainerStylePP}"
         Foreground="{StaticResource TBColorNonSelected}"
         SelectedIndex="{Binding SelectedIndex, ElementName=PetProtectorFrames, Mode=TwoWay}"
         Height="0"
         VerticalAlignment="Top"
         SelectionChanged="AppBarMenu_SelectionChanged"
         ScrollViewer.VerticalScrollBarVisibility="Disabled">

     </ListBox>

这是ItemsPanelTemplate的模板

<Style x:Key="ListBoxHorizontal"
       TargetType="ListBox">
    <Setter Property="BorderThickness"
            Value="0" />
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"
                            VerticalAlignment="Center"
                            HorizontalAlignment="Center" />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
</Style>

我尝试添加 VirtualizationStackpanel 而不是堆栈面板作为 ItemsPanemTemplate，但它的作用相同。而当我尝试设置属性CanHorizontallyScroll=true时，我得到两个错误，首先是VirtualizationStackpanel中不存在这个属性，删除这个属性并再次返回后，我得到错误Syntax Error found in XBF generation。 我尝试自己搜索解决方案，查看这里，用谷歌搜索，但找不到解决方案。有人可以帮我弄这个吗？我用它来搞砸了 2 天。

更新：

列表框在网格内，设置如下：

    <Grid x:Name="MainGrid">
    <Grid.RowDefinitions>
        <RowDefinition Height="0.091*" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="0.01*" />
        <RowDefinition Height="0.9*" />

    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

第二行高度设置为自动，因为我正在为列表框高度设置动画。列表框充当 AppBar，当我按下应用栏上的按钮时，列表框会显示包含菜单项。

解决方案更新：

受 SWilko 提供的解决方案的启发，我还设法通过稍微配置“ListBox”解决了我的问题，因此对我之前代码的修复如下所示：

    <ListBox x:Name="AppBarMenu"
     Grid.Row="1"
     Canvas.ZIndex="1"
     ScrollViewer.HorizontalScrollMode="Enabled"
     ScrollViewer.HorizontalScrollBarVisibility="Visible"
     ScrollViewer.VerticalScrollBarVisibility="Disabled"
     ScrollViewer.VerticalScrollMode="Disabled"
     Background="{StaticResource BackgroundColorApp}"
     ItemTemplate="{StaticResource StackMenuItem}"
     ItemsSource="{Binding}"
     Style="{StaticResource ListBoxHorizontal}"
     ItemContainerStyle="{StaticResource ListBoxContainerStylePP}"
     Foreground="{StaticResource TBColorNonSelected}"
     SelectedIndex="{Binding SelectedIndex, ElementName=PetProtectorFrames, Mode=TwoWay}"
     Height="0"
     VerticalAlignment="Top"
     SelectionChanged="AppBarMenu_SelectionChanged">

 </ListBox>

所有应该做的就是禁用垂直滚动并启用水平滚动。

Answer 1

首先是您的 ListBox 的高度设置为 0，但假设可能是错字:)

这是一个简单的ListBox 水平滚动示例。

Item.cs

public class Item
{
    public string Name { get; set; }
}

MainPage.xaml.cs 构造函数

public MainPage()
    {
        this.InitializeComponent();

        this.NavigationCacheMode = NavigationCacheMode.Required;

        var list = new List<Item>
        {
            new Item { Name = "Item 1" },
            new Item { Name = "Item 2" },
            new Item { Name = "Item 3" },
            new Item { Name = "Item 4" },
            new Item { Name = "Item 5" },
            new Item { Name = "Item 6" },
            new Item { Name = "Item 7" },
            new Item { Name = "Item 8" }
        };

        this.AppBarMenu.ItemsSource = list;
    }

MainPage.xaml

 <Grid>
    <ScrollViewer
    ScrollViewer.HorizontalScrollMode="Enabled"
    ScrollViewer.HorizontalScrollBarVisibility="Visible"
    ScrollViewer.VerticalScrollBarVisibility="Disabled"
    ScrollViewer.VerticalScrollMode="Disabled">
        <ListBox x:Name="AppBarMenu"
            ScrollViewer.HorizontalScrollBarVisibility="Disabled"
            ScrollViewer.VerticalScrollBarVisibility="Disabled"
                 Height="100"
            VerticalAlignment="Top">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}" Foreground="Red" 
                           FontSize="30"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </ScrollViewer>
</Grid>

注意ListBox 滚动查看器被禁用，ScrollViewer 被包裹在它周围。 希望你能适应你的代码