UWP 独立滚动视图

Question

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

<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) 将 link window 高度调整为滚动查看器高度，它一直有效，直到我滚动一点然后它崩溃并出现错误“检测到布局循环”。我认为这应该是非常常见的情况，我在这里遗漏了一些东西。有人可以帮忙吗？

Answer 1

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

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",price=31},
            new Fruit(){name="grape",price=5},
            new Fruit(){name="apple",price=12}
                   
        };
      
    }
}
public class Fruit
{
    public string name { get; set; }
    public int price { get; set; }
}

UWP 独立滚动视图

UWP independent scrollviews

c#

windows

xaml

uwp

scrollviewer