Поскольку код, который вы опубликовали, не является полным, трудно сказать, почему ваша вертикальная прокрутка не работает. Код, который вы опубликовали, является правильным, а следующий - полный образец, который работает на моей стороне.
XAML:
<Page x:Class="UWPApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:UWPApp"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="VisualStateGroup">
<VisualState x:Name="narrow">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="0" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="textBlock.Text" Value="NARROW" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="medium">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="520" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="textBlock.Text" Value="MEDIUM" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="large">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="1200" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="textBlock.Text" Value="LARGE" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<GridView x:Name="MyGridView"
Grid.Row="0"
IsItemClickEnabled="True"
ItemClick="MyGridView_ItemClick"
ScrollViewer.HorizontalScrollMode="Disabled"
ScrollViewer.VerticalScrollBarVisibility="Visible"
ScrollViewer.VerticalScrollMode="Enabled"
SizeChanged="MyGridView_SizeChanged">
<GridView.Resources>
<Storyboard x:Name="EnterStoryboard">
<FadeOutThemeAnimation TargetName="MyGridView" />
</Storyboard>
<Storyboard x:Name="ExitStoryboard">
<FadeInThemeAnimation TargetName="MyGridView" />
</Storyboard>
</GridView.Resources>
<GridView.ItemTemplate>
<DataTemplate>
<RelativePanel x:Name="idPanel">
<Image Source="{Binding}" />
</RelativePanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
<TextBlock x:Name="textBlock" Grid.Row="1" Height="50" FontWeight="Bold" />
</Grid>
</Page>
Code-за:
public sealed partial class MainPage : Page
{
public List<string> ImageCollection = new List<string> {
"http://az619822.vo.msecnd.net/files/CanaryIslandsTurtle_EN-US8274101746_1366x768.jpg",
"http://az619822.vo.msecnd.net/files/ShanghaiElevatedWalkway_EN-US8623422930_1366x768.jpg",
"http://az619822.vo.msecnd.net/files/SkunkKit_EN-US10705950046_1366x768.jpg",
"http://az619519.vo.msecnd.net/files/RockyMtFox_EN-US11902018005_1366x768.jpg",
"http://az608707.vo.msecnd.net/files/Burano_EN-US12610622868_1366x768.jpg",
"http://az608707.vo.msecnd.net/files/SealionMom_EN-US13623871731_1366x768.jpg",
"http://az608707.vo.msecnd.net/files/Kestrel_EN-US10433052515_1366x768.jpg"
};
public MainPage()
{
this.InitializeComponent();
MyGridView.ItemsSource = ImageCollection;
}
private void MyGridView_SizeChanged(object sender, Windows.UI.Xaml.SizeChangedEventArgs e)
{
var _panel = (ItemsWrapGrid)MyGridView.ItemsPanelRoot;
var _actual = VisualStateGroup.CurrentState;
int _gridColumnNumber;
switch (_actual.Name)
{
case "medium":
{
_gridColumnNumber = 2;
break;
}
case "large":
{
_gridColumnNumber = 3;
break;
}
default:
{
_gridColumnNumber = 1;
break;
}
}
_panel.ItemWidth = e.NewSize.Width/_gridColumnNumber;
}
private void MyGridView_ItemClick(object sender, ItemClickEventArgs e)
{
//TODO
}
}
Как я не знаю подробности вашей data:Element
, так что я просто использовать URL в моем образце. Вертикальная прокрутка работает хорошо. ![enter image description here](https://i.stack.imgur.com/sfpzB.gif)
Вы можете обратиться к этому образцу, и если у вас все еще есть проблемы, не стесняйтесь сказать мне. Кроме того, я думаю, вы также можете попробовать AdaptiveGridView XAML Control в UWP Community Toolkit, это похоже на то, что вы хотите.
Спасибо! AdaptiveGridView кажется хорошим инструментом. Хотя, если код правильный, мне кажется интересным, где ошибка. Полный проект доступен на github: https://github.com/szszptr/HowItSounds – szszptr
@szszptr Я проверил ваш исходный код на GitHub. Проблема в вашем 'RowDefinition'. при установке высоты строки в Auto, размер строки будет соответствовать его контенту. Таким образом, GridView в этой строке не сможет прокручиваться. Чтобы исправить эту проблему, вы можете изменить 'RowDefinition' на' 'как в приведенном выше примере. Строка, высота которой установлена в *, получит часть оставшейся высоты. Это может ограничить высоту GridView, и когда высота не будет достаточной, GridView будет прокручиваться. –
Для получения дополнительной информации см. [Определение макетов страниц с помощью XAML] (https://msdn.microsoft.com/windows/uwp/layout/layouts-with-xaml). –