UWP 独立滚动视图 - 编程之家

如何解决UWP 独立滚动视图

这个想法是在一个可滚动的列表视图中有一个包含大量元素的一列和一个包含小细节的第二列（不可滚动）。问题是整个页面都在滚动，因此第二列不在视图中。

<Grid>
        <Grid.ColumnDeFinitions>
            <ColumnDeFinition Width="300" />
            <ColumnDeFinition Width="*" />
        </Grid.ColumnDeFinitions>
        <Scrollviewer x:Name="scrollviewer" Grid.Column="0">
            <Listview ItemsSource={...} ItemTemplate={...} />
        </Scrollviewer>
        <StackPanel Grid.Column="1">
            <...>
        </StackPanel>
</Grid>

我尝试使用 SizeChanged 事件 (scrollviewer.Height = Window.Current.Bounds.Height) 将窗口高度链接到滚动查看器的高度，并且它可以正常工作，直到我滚动一点，然后它会因错误“检测到布局周期”而崩溃。我认为这应该是非常常见的情况，我在这里遗漏了一些东西。有人可以帮忙吗？

解决方法

我无法重现您的问题。您可以查看以下示例来比较您的代码。

MainPage.xaml：

<Page
..>

<Grid>
    <NavigationView PaneDisplayMode="Left"  ItemInvoked="NavigationView_ItemInvoked">
        <NavigationView.MenuItems >
            <NavigationViewItem Content="A" x:Name="A" />
            <NavigationViewItem Content="B" x:Name="B" />
            <NavigationViewItem Content="C" x:Name="C" />
        </NavigationView.MenuItems>
        <Frame x:Name="ContentFrame"/>
    </NavigationView>
</Grid>

MainPage.xaml.cs：

private void NavigationView_ItemInvoked(NavigationView sender,NavigationViewItemInvokedEventArgs args)
    {
        var item = args.InvokedItemContainer;
        switch (item.Name)
        {
            case "B":
                ContentFrame.Navigate(typeof(BlankPage1));
                break;
        }
    }

BlankPage1.xaml：

<Page
..>
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="300" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

        <ListView x:Name="listView" ItemsSource="{x:Bind Fruits}">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="local:Fruit">
                    <TextBlock Text="{x:Bind price}"/>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
 
    <StackPanel Grid.Column="1">
        <TextBlock Text="yyyyyyyyygggg"/>
        <TextBlock Text="hkcsduhgfuhiualhfijht" />
    </StackPanel>
</Grid>

BlankPage1.xaml.cs：

public sealed partial class BlankPage1 : Page
{
    public ObservableCollection<Fruit> Fruits { get; set; }
    public BlankPage1()
    {
        this.InitializeComponent();
        Fruits = new ObservableCollection<Fruit>()
        {
            new Fruit(){name="apple",price=12},new Fruit(){name="peach",price=15},new Fruit(){name="pear",price=8},new Fruit(){name="banana",price=31},new Fruit(){name="grape",price=5},.......
            // Add items that fill the entire page
           new Fruit(){name="banana",new Fruit(){name="apple",price=12}
                   
        };
      
    }
}
public class Fruit
{
    public string name { get; set; }
    public int price { get; set; }
}